Foobar Demo – Google Fonts

You can easily include Google Fonts in your Foobar by folowing these simple steps:

1. Browse to the Google webfonts homepage and choose a font you like
2. Click on the quick use link under the font you like
3. Scroll down and click on the javascript tab to show you some javascript code. Select all the code within the script tags and copy to your clipboard
4. Create a new Foobar and in the Custom JS metabox, simply paste that javascript code. For example :
   WebFontConfig = {
google: { families: [ 'Courgette::latin' ] }
};
(function() {
var wf = document.createElement('script');
wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
wf.type = 'text/javascript';
wf.async = 'true';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(wf, s);
})();
5. In the Custom CSS metabox, add 1 line of css code to use the new Google font:
   .foobar-message-wrapper { font-family: 'Courgette' !important}
6. Customize the Foobar to your liking as before and you are all done!