How can I change my font, and font size?

Community Forums Forums Design Tips and Tricks How can I change my font, and font size?

This topic is: not resolved

This topic contains 5 replies, has 2 voices, and was last updated by  braddalton 1 year, 2 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #52166

    rick4him
    Participant
    Post count: 128

    I would like to change my font on Noahsdad.com to the font that is being used here: http://dustn.tv/google-plus-one/

    I would also like to increase the size of my font (but probably not as big as what http://dustn.tv/google-plus-one/ is using.

    Would someone mind helping me figure out how to do this? Thanks so much!

    http://noahsdad.com/
    #52170

    braddalton
    Participant
    Post count: 10243

    This is the font stack they are using:
    [css]
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    [/css]

    You will need to add this to your child theme (assumes Outreach) using PHP code in your functions file.
    [php]
    /** Load Google fonts */
    add_action( ‘wp_enqueue_scripts’, ‘outreach_load_google_fonts’ );
    function outreach_load_google_fonts() {
    wp_enqueue_style(
    ‘google-fonts’,
    ‘http://fonts.googleapis.com/css?family=Lato’,
    array(),
    PARENT_THEME_VERSION
    );
    }
    [/php]

    Then you can add them to your defaults:
    [css]
    /* Defaults
    ———————————————————— */

    body,
    h1,
    h2,
    h2 a,
    h2 a:visited,
    h3,
    h4,
    h5,
    h6,
    p,
    select,
    textarea {
    color: #333;
    font-family: ‘Lato’, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
    padding: 0;
    text-decoration: none;
    }

    blockquote,
    input,
    select,
    textarea,
    .author-box,
    .breadcrumb,
    .sticky,
    .taxonomy-description,
    .wp-caption {
    background-color: #f5f5f5;
    }

    input,
    select,
    textarea {
    border: 1px solid #ddd;
    }

    input,
    label,
    select,
    textarea {
    color: #333;
    font-family: ‘Lato’, sans-serif;
    font-size: 14px;
    }

    li,
    ol,
    ul {
    margin: 0;
    padding: 0;
    }

    ol li {
    list-style-type: decimal;
    }
    [/css]


    #52171

    rick4him
    Participant
    Post count: 128

    Brad thinks again for your help. Few quick questions:

    1. What does “assumes Outreach” mean?

    2. Do I just take that first section of code and put it at the end of my functions.php file?

    3. Then do I take the 2nd block of code and add it to my child theme sytles.css files?

    Thanks for your help1

    #52172

    rick4him
    Participant
    Post count: 128

    Oh, I see what you mean by “assumes outreach”….I’m actually not using the outreach theme..this is a child theme that someone made for me. I’m not sure which theme he used for a starting point (if any.)

    #55649

    rick4him
    Participant
    Post count: 128

    bump.

    #55659

    braddalton
    Participant
    Post count: 10243

    Use the first block of code in your child themes functions.php file and change the font in the code from Lato to another Google font.

    If your functions file already includes that code, simply change the name of the font. No need to add the code again.

    Then use that font anywhere in your style sheet replacing any of your existing fonts.

    Example:
    [css]
    textarea {
    font-family: ‘Lato’, sans-serif;
    }
    [/css]


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

You must be logged in to reply to this topic.