Adding and Using Fonts with WordPress

[members_logged_in]
Adding and Using Fonts with WordPress

Adding additional fonts to any website can enhance and help better communicate the content that is being presented to visitors. There are several ways to add additional fonts, especially Google Fonts, to a WordPress website. We will look at the options available to WordPress site owners and how to start using these fonts immediately.

Save the Webinar 0

Webinar Originally Broadcast: June 19, 2024

Video Download: HD Download | Mobile Download

Additional Downloads: PDF Handout

Additional Notes:

Code Snippet

function custom_enqueue_fonts_url() {
  $fonts_url = '';
  $lora = _x( 'on', 'Lora font: on or off', 'voce' );
  $open_sans = _x( 'on', 'Open Sans font: on or off', 'voce' );
  if ( 'off' !== $lora || 'off' !== $open_sans ){
    $font_families = array();
    if ( 'off' !== $lora ){
      $font_families[] = 'Lora:400,700,400italic';
    }
    if ( 'off' !== $open_sans ){
      $font_families[] = 'Open Sans:700italic,400,800,600';
    }
  }
  $query_args = array(
    'family' => urlencode( implode( '|', $font_families ) ),
    'subset' => urlencode( 'latin,latin-ext' ),
  );
  $fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
  return esc_url_raw($fonts_url);
}

… and then the enqueuing of the function…

function custom_enqueue_scripts_styles() {
  wp_enqueue_style( 'theme_custom_fonts', custom_enqueue_fonts_url(), array(), null );
}
add_action( 'wp_enqueue_scripts', 'custom_enqueue_scripts_styles' );

[/members_logged_in] [members_not_logged_in]

You need to be logged into your membership account to have access to the webinar replays.

[/members_not_logged_in]
Back to Top