Changing Twentytwelve default fonts properly with no plugins. (1 post)

  1. Tryah85
    Posted 3 years ago #

    *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;
    .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

Topic Closed

This topic has been closed to new replies.

About this Topic