WordPress.org

Support

Support » How-To and Troubleshooting » Changing Twentytwelve default fonts properly with no plugins.

Changing Twentytwelve default fonts properly with no plugins.

  • *This is a learning exercise, so I do not want to use plugins

    I cannot figure out why I can’t make the default “Open-Sans” font in twentytwelve change. I have troubleshooted multiple ways to do this the ‘proper’ way. I say proper with quotes because I know that there is multiple ways of getting it to work. I want to do this using a twenty twelve-child theme with functions.php and style.css.

    The two files will override similar data from the original style.css and functions.php files in the twentytwelve theme folder. What I have so far makes since to me, but it does not work.

    In the functions.php file within the -child folder I dequeued the original fonts, and enqueued the new google fonts like so:

    function mytheme_dequeue_fonts() {
    wp_dequeue_style( 'twentytwelve-fonts' );
    }

    Then I added the action to forward the switch of the fonts. I have two different add_actions because other threads gave me two. I have no idea which one is right?

    //add_action( ‘wp_enqueue_scripts’, ‘mytheme_dequeue_fonts’, 11 );
    add_action(‘wp_print_styles’, ‘unload_fonts’, 11);

    ‘wp_enqueue_scripts’ vs. ‘wp_print_styles’ or ‘my theme_dequeue_fonts’ vs. ‘unload_fonts’? What is the difference? The committed out line worked for me.

    Then I added the same css roles in thee theme’s style.css file and put them into the -child’s style.css like so:

    /*
    Theme Name:     Twenty Twelve Child
    Theme URI:      http://example.com/
    Description:    Child theme for the Twenty Twelve theme
    Author:         T
    Author URI:     http://example.com/about/
    Template:       twentytwelve
    Version:        0.1.0
    */
    @import url(../twentytwelve/style.css);
    
    body {
    	font-family: Marck+Script, Roboto, Averia+Libre, sans-serif;
    	}
    body.custom-font-enabled {
    	font-family: Marck+Script, Roboto, Averia+Libre, sans-serif;
    	}
    .entry-content code,
    .comment-content code {
    	font-family: Marck+Script, Roboto, Averia+Libre, sans-serif;
    	}
    
    .entry-content pre,
    .comment-content pre {
    	font-family: Marck+Script, Roboto, Averia+Libre, sans-serif;
    	}
    
    body,
    input,
    textarea,
    .page-title span,
    .pingback a.url {
    	font-family: Marck+Script, Roboto, Averia+Libre, sans-serif;

    I can see the new font names being enqueued (or called for a better term) in the head when I view the source, but the fonts do not change…

    I found this that describes the ‘Open-Sans’ font is specified in twentytwelve’s functions.php around line 139. It appears that I may not be dequeuing this font correctly inside twentytwelve-child’s functions.php from the first code above. Anybody have an idea?

    In a nutshell, How to properly dequeue font style (google open font Open-Sans css)?

    Enqueue the right font I picked?

    How to edit the right CSS properties with the style.css in the twentytwelve-child? I have read through the documentation understanding twenty twelve-child style.css Tags, IDs, and Classes overwrite the same that are referenced in the theme’s main style.css file…

    Thank you in advance

  • The topic ‘Changing Twentytwelve default fonts properly with no plugins.’ is closed to new replies.