One option that users often appreciate in themes is the ability to control typography without having to modify any code. Justin Tadlock has been experimenting with adding a typography control class for the WordPress customizer.
Instead of writing a lengthy tutorial, he opted to create a a proof-of-concept plugin that demonstrates how theme authors might accomplish this. Customizer Typography is currently being developed on GitHub and Tadlock said it is “only meant for development purposes and to show one method of executing the idea.”
The plugin was created to provide testing for two things:
- Testing a customizer control class to handle typography
- Tying multiple customize settings to a single control
“The most important was not having to add tons of code while still providing the developer complete control over each setting,” Tadlock said. “Fortunately, the Customization API in WordPress is pretty powerful and allows you to tie multiple settings to a single control.”
The plugin currently provides controls for live previewing both paragraph and headings with various font family, font weight, font style, font size, and line height options. Integrating Google Fonts is on Tadlock’s to-do list, but at the moment he’s not working to build out the plugin as the ultimate solution.
“Just to be clear, this is a proof of concept that I put together in an afternoon, not a polished solution,” he said. “The idea, for me at least, would be to eventually extract it and put it into themes.”
I installed the plugin to play around with Twenty Fifteen and found that the experience of live previewing typography changes is very satisfying from a user standpoint. Although many custom theme options panels include basic typography controls, you often have to refresh the page to see how your changes applied. This kind of control is a prime candidate for integrating into the customizer.
Tadlock’s example typography control class gives you a glimpse of what’s possible for theme authors who elect to build their options using the customizer. It’s these kinds of controls that truly solve a frustration and make it easier to personalize themes. The Customizer Typography plugin exemplifies the purpose of the customizer.
You can check out the plugin on GitHub and install it to see the live previews in action. If you’re interested to learn more about building with the Customizer API, Tadlock published a post on the Make.WordPress.org/Themes blog that contains a long list of customizer tutorials and documentation.
Realise this is a proof of concept but would refer to Themes with Visual Editors and in effect customisers without code that already are quite sophisticated in Theme frameworks aka HeadwayThemes and others. It provides for extensive typographic controls is very user friendly etc.
To do all of that within the confines of the ‘Customizer’ seems a shame not to learn from existing editors that already do this quite ably in existing solutions. I do of course defer to Justin’s superior knowledge on these matters. But just a thought.