[Link for blog][1]
In the above Blog page how can i increase font for title of every post?
Add following in style.css. Appearance->Editor->style.css
.entry-title
{
font-size:30px;
}
Find Class/ID of element you want to change with tool like Element Inspector of firefox/chrome then add appropriate styling to your element.
Related
I am looking to change the font size and weight of the navigation menu items on my WordPress site, I am using The Company theme, but I can't seem to figure out the CSS required
My site is www.thepowerwithin.org.uk
I am looking to make the items in the main menu at the top bigger and bold
I have reviewed your question. I think you want to apply CSS only on main-menu anchor text not on sub-menu anchor text. If I am right then you can do as:
ul.menu:not(.sub-menu) > li > a {
font-size: 16px;
font-weight: bold;
}
You should use children-selector > to apply CSS only on the direct children of ul
When use ul.menu:not(.sub-menu) it ignores sub-menu ul of li.
The best thing to do is learn how to use the developer tools in Firefox or Chrome or Safari or IE to see what's loading on your site and how to work with and change the CSS and HTML. Dev tools allows you to make temporary changes to the locally cached browser copy of the site. You can then add the CSS changes to the theme, either by adding new CSS in theme options or to the style sheet.
If the theme allows you to add custom CSS to modify the menu, that's good. If not, make a child theme so you don't lose your changes when the theme is updated. See Child Themes « WordPress Codex
What is the proper way to set all blog posts to have a certain background in WordPress?
Sometimes this depends on the theme but you can achieve this in your CSS. Check to see that your blog posts are adding a particular class to the body tag and then do something like this in your theme's CSS file:
.single-post, .single, .post { background-color: #ff9900; }
That above CSS sets the background color of the page to a certain color, but it only applies to pages that have that CSS class present. I would check your active theme and also refer to the documentation on post classes to be on the safe side.
I'm trying to change font size and color for "Price" on product page only. When I change .price on style.css it would change price format on all pages which is not what I need. I need to change price format on product page only.
Any help,
Thanks
You can simply make the change at the top of that particular page or even on that line. Simply place open and close style tags above the body tag and between them insert the rule delaration. This will override the linked style sheet.
You can keep your CSS consolidated and still do this. Add an ID to the body tag of the products page:
<body id="pgProducts">
Or Wrap the contents
<div id="pgProducts">
then you can use that in your "over-ride" selector
#pgProducts .Price {
/*Style to appear in pgProducts only*/
}
This could give you greater extensibility should this style end up required elsewhere.
Of course you can use what ever ID you like here. You could also use a class instead of an ID but an ID has better specificity.
Is there any way to hide certain tags in post info/meta via css ? Something like #tag-id { display:none }
Your CSS may be overwritten by the theme CSS file. Try with the following css:
display:none !important;
If it doesn't work, please provide the URL of your website.
Cheers,
Dam
I need help with some CSS styling. I've tried various options with Firebug and cannot sort this out. How can I style the thumbnails on my posts (eg url: http://thatcriticguy.com/index.php?post/4/crossover-9-revamped-reinvented-and-a-must-have) and not style all images in the post at the same time. I have numerous posts on this site and need to only style the ones that are thumbnails that float right.
Is there a way to do this without modifying the template code just using CSS?
There's no way using pure CSS, because the thumbnails don't have an identifier that can distinguish them from the other images. Your only choices are either modifying the template code or using javascript to pick out the first image in a post and applying a style to it.
You need to have a "class" attribute on the images you want to style with CSS. This way your CSS will work only on the images you want.
For example you can have this HTML
<img src="..." class="thumbnail"/>
and this CSS:
.thumbnail {...}
If your posts' structure is always identical, this should do the trick:
.post-content p:first-child img
{ float: right }
It addresses all img elements in the first paragraph below post-content.
Not supported by IE 6. Source at Quirksmode.org