How to change font of page titles

  • Unknown's avatar
    fruitykiwi0891 · Member ·

    Hello,
    I need help changing the font of my page titles to match the font of post titles. I have css customising but very new at working with this and can`t figure out the right code.

    Also, I need help changing the dimensions of the header image/title from 210pz x 170px to stretch across the site.

    Thankyou!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    timethief · Member ·

    I will flag your thread so it gets move to the CSS editing forum where you can get help with this.

  • Unknown's avatar
    timethief · Member ·

    Will you also post an active link starting with http:// to the blog in question as the one linked to your username has been deleted? Better still please link your username to it so your blog can be instantly located. Dashboard -> Users -> Personal Settings -> then scroll down to Account Details. Then scroll down to where it says ‘Website‘ select the URL for your primary wordpress.com blog and then save changes.

  • Unknown's avatar
    fruitykiwi0891 · Member ·

    Hey, I think I`ve linked my url to my profile. Just in case, here is my site:

    http://saltgypsy.com/

    Cheers

  • Unknown's avatar
    thesacredpath · Member ·

    I’m seeing the same font and font size on single posts and on static pages. Examples:

    http://saltgypsy.com/talking-story/
    http://saltgypsy.com/2011/12/12/style-in-the-lineup/

    On the header image, create one that is 960px wide x whatever height you want, upload it to your media library, get the URL of that image and post it here and we can get the code worked out for you. On the height, you are probably going to want to limit it to 200px (even that will require some shifting around of a few things to maintain whitespace.

  • Unknown's avatar
    fruitykiwi0891 · Member ·

    Here is the header image I would like to try:

    With the page font, on the main static home page, the four page titles are in a font that looks like a Times Roman.

    I would like the font to change to the same as the post titles: FF Meta

    I really can`t figure it out!

    thankyou

  • Unknown's avatar
    fruitykiwi0891 · Member ·

    Header dimensions I tried above are: 960px x 200px as suggested.
    Cheers

  • Unknown's avatar
    thesacredpath · Member ·

    Replace the #branding section you have in your custom CSS with the below and add the second two rules.

    #branding {
background: url("http://saltgypsy.files.wordpress.com/2011/12/blog-header.jpg") no-repeat scroll center top transparent;
float: left;
margin: 0 40px 0 0;
min-height: 200px;
position: relative;
width: 960px;
}

#branding #header-image {
display: none;
}

#branding #header-image-link {
width: 480px;
}

    The last bit above makes the entire header image area clickable.

    On the main page (Home) I’m seeing the same sans-serif font as on the other pages and posts, only smaller. This is what I’m seeing (from the CSS)

    font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif;

    A note on your header image. I would suggest going back to your original artwork and saving it at 72dpi (web standard) instead of 320dpi. That will seriously shrink the file size. Right now it is about 6 times the file size that you want for a header image (635k). Also for graphic type images such as this, and being it is only black and white, save it as an 8-bit PNG rather than a JPG and the text will be sharp and crisp. Right now it is a little pixelated.

    You can use this one that I quickly optimized if you wish (still a JPG). It is only 29k in file size. Save it to your desktop and then upload it to your media library and replace the image URL in the background declaration above in #branding.

  • Unknown's avatar
    fruitykiwi0891 · Member ·

    Thesacredpath – thankyou so much for your help. Ive just uploaded the opt file you created so hoping that comes out better. I have also tried saving original artwork as 8-png file but not sure if Ive done it right.

    I still can`t change the fonts of the page titles on the Home page, no matter how I try fiddling with the css.

    But thankyou again, you are a champion!

  • Unknown's avatar
    thesacredpath · Member ·

    The logo and everything looks fine to me.

    The post title font on your main page in Safari, Firefox and Opera is not a serif font such as Times. It is a sans-serif font. This is the font stack in the CSS:

    ‘Helvetica Neue’,Helvetica,Arial,sans-serif

    Are you by chance talking about the navigation menu?

    If not, and the titles of the posts in the main body section of your main page are serif, then you have an issue with your browser or perhaps with a invisible proxy server used by your ISP which is not updating correctly.

    Log out of wordpress, clear your browser cache and cookies, restart your browser and have another look.

    If that does not work, then try a different browser.

  • The topic ‘How to change font of page titles’ is closed to new replies.