WordPress.org

Ready to get started?Download WordPress

Forums

Twenty Thirteen
Google fonts and font size (3 posts)

  1. Skydog2
    Member
    Posted 4 months ago #

    I am just starting to build my website with twentythirteen and would like to add google fonts and change the font size of the header. Any suggestions? Thank you

  2. WPMU DEV
    Member
    Posted 4 months ago #

    Hi @Skydog2,

    I hope you are well today and thank you for your question.

    I suggest you to create child theme of Twenty Thirteen theme instead of changing Twenty Thirteen theme directly because if you update your Twenty Thirteen theme then the changed code will be overwritten and you will lose all the changes you have made.

    Twenty Thirteen uses Google Fonts by default, you can just change it to use your own font by deregistering default font and adding new one as following

    function deregister_gfonts() {
      wp_deregister_style('twentythirteen-fonts');
    wp_enqueue_style( 'custom-twentythirteen-fonts', custom_twentythirteen_fonts_url(), array(), null );
    }
    add_action('wp_enqueue_scripts','deregister_gfonts',100);
    
    function custom_twentythirteen_fonts_url() {
    	$fonts_url = '';
    
    	$font_families = array();
    
    	$font_families[] = 'Source Sans Pro:300,400,700,300italic,400italic,700italic';
    	$font_families[] = 'Bitter:400,700';
    
    	$query_args = array(
    		'family' => urlencode( implode( '|', $font_families ) ),
    		'subset' => urlencode( 'latin,latin-ext' ),
    	);
    	$fonts_url = add_query_arg( $query_args, "//fonts.googleapis.com/css" );
    
    	return $fonts_url;
    }

    Use the font in style.css file of your child theme, you can change font size of the header by adding CSS code to change it in this file.

    Best Regards,

  3. Skydog2
    Member
    Posted 4 months ago #

    Thank you, I will work on that.

Reply

You must log in to post.

About this Theme

About this Topic