I have a request for instructions on how to switch the font replacement from cufon to Google fonts on the slicer WordPress theme. And while these apply for that particular theme they are pretty genenric and should be working for the other themes as well. So here we go…

1. Disable cufon

In order to disable cufon you need to remove some code from the functions.php file. It is the part where the cufon and the font file are loaded into the theme. It looks like this:


wp_enqueue_script( 'cufon-yui', get_template_directory_uri().'/js/cufon-yui.js', array( 'jquery' ) );
wp_enqueue_script( 'vegur', get_template_directory_uri().'/js/Vegur_300-Vegur_700.font.js', array( 'jquery' ));

Next you need to remove the replacement calls from js/custom.js. They are at the bottom of the file and look like this:


// Cufon font replacement rules
Cufon.replace("h1,h2,h3,h4,h5,#slogan,#navigation li a,.cta2 em,.cta1 em,.delimiter, .forms label, .read-more em");
Cufon('#navigation li a',{textShadow: '0px -1px 2px #000'});
Cufon('#footer h3',{textShadow: '0 -1px 1px rgba(0,0,0, 0.3)'});
Cufon('.slice h1, .slice h2, .dark-post h2, .cta1 em, .cta2 em, #footer h2',{ textShadow: '1px 1px 1px rgba(0,0,0, 0.6)'});
Cufon('.slice-light h1, .slice-light h2',{ textShadow: '1px 1px 1px rgba(256,256,256, 0.6)'});
});


2. Implement Google Webfots

After choosing your font(s) google will provide you with a code you need to insert in your website. It will look something like this:

<link href='http://fonts.googleapis.com/css?family=Changa+One' rel='stylesheet' type='text/css'>

You need to place this in header.php right under this part:

<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/custom.css" type="text/css" media="screen" /><!-- custom stylesheet -->


Then apply this css rule to all the selectors you like in your custom.css file. For example:


h1, h2, h3, h4{
font-family: 'Changa One', sans-serif;
}
#slogan,#navigation li a,.cta2 em,.cta1 em,.delimiter{
font-family: 'Changa One', sans-serif;
}