Bromley Theme: CSS Change text style on a single post
-
Hi there
I am kind of amazed that you are unable to change the font size etc on WP. I assumed it would be there like Word as its kind of essential right?Any simple directions on how to change font style before I post would be awesome. I don’t mean go to customize and change the font style throughout every post, just some headers I need doing on single posts.
Thanks for your help
The blog I need help with is: (visible only to logged in users)
-
-
Hi there,
You should be able to change your fonts for headings and the font base from WP Admin>Appearance > Customize > Fonts. Just click on the current font name and you’ll see a drop down of all available fonts. -
@andysmart6866, are you talking about for setting font sizes for headings or such within pages or posts, such as for headings in your pages and posts?
-
Hiya there > Cheers for dropping by
1: I don’t mean go to customize and change the font style throughout every post
2: The sacredpath: Good question: I was vague as vague could be there. I was wrong by using the word headers.I mean to just change the font size in single posts. These would be different from the header text. I know you can set the font style generally on Customize but when you do that it changes everything.
Thanks for dropping by :)
-
If you’re being post specific, I would just make a span tag with a style section and define the font there. For example:
<span style=”font-family:consolas;font-size:small;”>Put your post text in here.</span>
Someone else might have a better way, this was just a hip-shot.
-
To change that h1 text to serif style font, add the font family declaration to the style in the span like this.
<h1 style="text-align: center;"><span style="color: #000000; font-family: "Times New Roman", Georgia, serif;">Use of the WKTG</span></h1>There is an alternate way of doing this though where it would be easier on you. What we can do is to define a class with the styling you want in the custom CSS and then all you have to do would be to call out the class. The beauty of this would be that you could use the same class for other types of headings as well (h2, h3, etc.) if you wished.
First off you would go to Customize > CSS and paste in the following custom CSS.
.my-heading { color: #000000; font-family: "Times New Roman", Georgia, serif; text-align: center; }Then in the Text tab in your editor, you would do this.
<h1 class="my-heading">Use of the WKTG</h1>Anytime you wanted that styling, all you would have to do would be to put in that class declaration in the h1, etc., tag.
One thing I will mention is that h1 is typically used for site titles and page/post titles and generally not in the content body. h2, h3, etc., is better in the body. What you can do is to create your own style and then apply it to whatever text you wish by just declaring the CSS class, similar to what we have done above.
-
If you wish to create your own CSS class that mimics the styling of h1, let me know and I would be more than happy to help with that.
-
Hi there sacredpath >
Looks great though I’m a bit confused: In that there are three font styles in the same sentence:
“Times New Roman”, Georgia, serif
Can you clarify that for me.Cheers SP :)
-
With fonts, it is always a good idea to specify more than one just in case the visitor’s computer doesn’t have the font. The browser will try to use the first font, and if it is not found, then it will try the second. The last one, serif, is the browser standard font and will generally always be available.
Another reason for specifying multiple fonts is that it gives you more control over how things look.
-
God that’s useful. I’ll check it out when I get home. Thanks mate. I’ll keep you posted!
-
- The topic ‘Bromley Theme: CSS Change text style on a single post’ is closed to new replies.