Trying to change slider font

  • Frym1

    #6397

    Trying to change slider font by using following CSS.

    .bgimage-excerpt .slider_post_entry p {
    font: SnellRoundhand BoldScript;
    }

    Please could you advise as not working :))

    Prasanna SP

    #34211

    That font isn’t included with the standard WordPress installation. So the above code doesn’t work. You need to download and install the font somewhere on your host and call it with @font-face

    Something like,

    @font-face {
    font-family: snell;
    src:url('/my/font/folder/snell.ttf') format ("truetype");
    }

    Then,

    .bgimage-excerpt .slider_post_entry p {
    font-family: snell;
    }

    This post may help you – http://wpmu.org/adding-custom-fonts-to-wordpress-with-font-face-and-css/

    Frym1

    #34212

    Prasanna, thank for you help above. I have followed the below steps but no luck so far? Am I doing something stupid?

    1) Gone into my FTP files and created a folder under the following path root/wp-content/themes/graphene-child/Font/Snell Roundhand Bold Script.ttf

    2) Edited the Child Style CSS Sheet with the following code:

    @font-face {
    font-family: snell;
    src:url('/root/wp-content/themes/graphene-child/Font/Snell Roundhand Bold Script.ttf') format ("truetype");
    }

    .bgimage-excerpt .slider_post_entry p {
    font-family: snell;
    }

    Prasanna SP

    #34213

    Rename font and remove space or separate words with –

    Prasanna SP

    #34214

    Also you don’t have to include full path to font.

    Rename font to Snell-Roundhand-Bold-Script.ttf and try the below code. Also make sure the fonts folder name is Font. (Notice the F)

    @font-face {
    font-family: snell;
    src:url('/Font/Snell-Roundhand-Bold-Script.ttf') format ("truetype");
    }

    .bgimage-excerpt .slider_post_entry p {
    font-family: snell;
    }

    Prasanna SP

    #34216

    Okay, here you go.

    @font-face {
    font-family: 'snell';
    src:url('/Font/Snell-Roundhand-Bold-Script.ttf') format ("truetype");
    }

    .bgimage-excerpt .slider_post_entry p {
    font-family: 'snell', Fallback, sans-serif;
    }

    Frym1

    #34217

    Sorry to use you time but still struggling a little 🙁

    Went into Host file and renamed file to Snell-Roundhand-Bold-Script.ttf plus folder is named Font.

    Then went into CSS file and pasted in

    @font-face {
    font-family: 'snell';
    src:url('/Font/Snell-Roundhand-Bold-Script.ttf') format ("truetype");
    }

    .bgimage-excerpt .slider_post_entry p {
    font-family: 'snell', Fallback, sans-serif;
    }

    But still nothing, am I missing something Prasanna?

    Prasanna SP

    #34218

    Try using OpenType (.otf) or Embedded OpenType (.eot) fonts instead.

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.