Wordpress post background by category - wordpress

I run wordpress website and have custom background skin. For some category's i need custom skin so i use this category-id and add this code:
.skin{
display:none;
}
and after that add my
<div class="custom-category-skin"><img src=""></div>
all that works perfect. Now i need the posts in category with custom skin load the skin from the category.How can i do something like that?

Related

Woocommece - how to change the layout of shortcode template

I am using this shortcode to show all products of a specific product category on custom a template.
[products limit="12" columns="3"]
Now, as I am developing a new theme so the output of this shortcode is breaking the design.
I want to know where or which file I should take or edit to change the layout I want?
Check this image:
Here you can see the rectangle box div's is coming from the content-product.php page but I want to add/change few div before that div's
Like where the <div class="row"> and <div class="woocommerce columns-3 "> is coming? I want to change it.

hide button in css for all posts from specific wordpress category

I use this code to hide a button in css. It works. Is it possible to hide the button in a specific wordpress category posts?
div.screen-reader-text3
{
display:none;
}
any help appreciated
Yes. Wordpress adds class to body element on category page.
If you inspect your code on category page you'll see something like this in body class:
archive category category-skincare category-2.
The skincare it is a slug of my category, in your case it will be different.
You need to copy category-skincare and use it in your CSS like so:
.category-skincare div.screen-reader-text3 {
display: none;
}
Each page in wordpress have personal ID. If you inspect the page source via console, you can see in body this:
<body class="home page-template-default page page-id-58">, where page-id-58 - the unique page id.
In css it's look like that
.page-id-58 div.screen-reader-text3 {display:none;}

How can I customize a CSS framework for specific pages in Wordpress?

I'm trying to customize the framework.css for how high or low the sidebar appears on specific pages. Would it be possible to do this using a custom page template and a specific div class declaration? Such as creating a custom template and within that template creating a class to "override" the default css sidebar element settings for those pages? How would I go about doing this?
One option is to make sure the theme is using the function body_class() inside the <body> tag.
When I select the page template Sidebar Template (wp-content/themes/twenty-eleven/sidebar-page.php), the class page-template-sidebar-page-php shows up in the body tag:
According to brasofilo's answer, every page has its own class, in case of brasofilo's code, it is the page-id-674. It's generated by wordpress in general.
If you want to do styling on specific pages, you may use something like this:
body.page-id-674 div.specific-div-class {
/*code*/
}
Hope that helps!

WordPress Twenty Thirteen Theme: How to hide ".entry-content" only on main page

I would like to hide the body text below the headlines on my blog's main page, the page where all articels are listed, but would like keep it on the single post page.
My first thought was to set .entry-content to display:none but this made it disappear on both pages.
Does anyone have an idea how to remove it only on the front page?
Wordpress assigns a unique class to the body for each page. you can see the body classes by viewing source. Home page is given the class .home so you could target entry-content this way:
.home .entry-content{ display:none; }
alternatively you can create a custom template for your home page and just remove the html.
http://codex.wordpress.org/Page_Templates

Adding custom CSS to Drupal 7 to hide the message

I use my custom block for displaying a flash game at the front page of my Drupal 7 installation, but there is also the annoying message:
<div id="first-time"><p>No front page content has been created yet.</p>
<div class="item-list"><ul><li class="first last">
Add new content</li>
</ul></div></div>
below it and I can't remove it. Is there please a hook for adding custom CSS? In my module I would like to make the #first-time light grey or invisible.
I prefer not to add a blank content just to get rid of that text.
Thank you!
Alex
UPDATE:
I've added the following to my module:
function game_init() {
drupal_set_message('XXX init called XXX');
if (drupal_is_front_page()) {
drupal_add_css('#first-time {color: green;}', 'inline');
}
}
but don't see that CSS-code or XXX string inside my front page.
UPDATE2:
Oh, I had to clear the cache and now it works (the Drupal docs seem to be wrong here - there was written that 'inline' CSS is not cached...)
Hiding the CSS is the WRONG way of doing it. why did you created your content as a Custom Block?
you should create a "Page" and set this page as front page in the Configuration->Site Information.
Whatever. you can also use any of these options but is not recommended.
you can also also add a BlankPage by Adding only the Title(then hiding it in PHP on page.tpl.php)
you can add your css in /templates/themes/bartik.info
you can call drupal_add_css on the _init() hook of your custom module.
Blocks are used to display information in every page(although we can set to display only on certain pages). Say For Example. A Menu, or A Shopping Cart etc.
If you want to add some CSS for a module, you should use drupal_add_css()
Why not simply add this CSS to your theme?

Resources