Patrick's Programming Blog

Google Font Picker Control for WordPress

Over the last few months at work we've been digging into the WordPress Theme Customizer and thinking about using it as the basis for a SaaS web app. Building upon the basic controls for the theme customizer is one of the challenges we've been facing and the Google Font Picker Control is the first of (at least two) the controls that we developed to make the Theme Customizer even more awesome.

Way back in the before time when Al Gore founded the Internet and it was still black and white including fonts on your website was an amazingly difficult thing. Most developers didn't bother and instead used rastered images which bring up a whole new slew of problems. Google Fonts, Typekit, & Font Squirrel are some of the awesome services that have cropped up in the last few years to fix this. Google Fonts simply allows you to put any of their open-source fonts on your website for free with just a couple lines of code.

With this plugin we combine the idea of having any of these awesome fonts available to us and being able to preview them and easily select them in the theme customizer. Check it out.

 

All you have to do is click on the font that looks best to you and it is applied across your website. The plugin uses a bit of jQuery to detect the clicks and it modifies a hidden select box. Pretty cool huh?

As part of my programming new years resolutions I've committed myself to writing better documentation so you can find all the code you need to implement this on your own site on the Github Project page.

Exit mobile version