Change Font Style for post titles AND page titles SEPARATELY

Activello
1

Hi there!
I would love to change the look of the headings of my posts AND pages separately
This is my website: http://www.primetimechaos.com/
The problem is, that they seem to use the same code, so I cannot seem to change one of them without changing the other.

The code I used:

/CHANGE FONT FAMILY POSTS TITLE/
#page .entry-title, #page .entry-title a {
text-transform: uppercase;
font-family: ‘Raleway’, sans-serif;
font-style: normal;
font-size: 30px;
text-align: center;
letter-spacing: 1px;
}

BUT I have also seen, that you can use this code.

h2.entry-title {
text-transform: uppercase;
font-family: ‘Raleway’, sans-serif;
font-style: normal;
font-size: 30px;
text-align: center;
letter-spacing: 1px;
}

Is there any way I can make my PAGE TITLES (like “About” and “Contact”) look like the attached screenshot? WITHOUT changing my post titles?

I know how to add the border, I just don’t know how to make them seperate from each other.

Thank you!
Have a lovely day, Theresa

2

Hi @primetimechaos,

I hope you are well today and thank you for your question.

I visited your site and found you already managed to achieve it using following CSS code.

.category h1.page-title {
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    font-size: 35px;
    text-align: center;
    border-bottom: 1px solid #e0e0e0;
    border-top: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;
    letter-spacing: 1px;
}

Please advise.

Best Regards,
Movin

3

Hello!
Thanks for the quick reply!

Unfortunately that code only works for the CATEGORY HEADINGS (e.g. “travel” and “beauty”).
I would love to change the PAGE HEADINGS (e.g. “about” and “contact”) seperately and give them a different look.
Is that possible?

As far as I can see the POST headings, CATEGORY headings and PAGE headings are all different and need different code?

I included a screenshot, so you can see what I mean.
Thank you so much for you help!
Theresa

4

To style the page heading you have to use CSS selector
body.page #page h1.entry-title as displayed below.

 body.page #page h1.entry-title {
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    font-size: 35px;
    text-align: center;
    border-bottom: 1px solid #e0e0e0;
    border-top: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;
    letter-spacing: 1px;
}
5

That worked PERFECTLY!
Thank you so much!
I spent all day yesterday trying to figure it out.
Thank you!

6

You are most welcome here :slight_smile: