What is the Customizer feature?
The WordPress Customizer is a feature that rests in the appearance menu of your site. It gives the user the ability to change important settings on their site, with a live preview of the changes.
The Customizer contains common entities that you can choose to modify, such as your font color or site background. Premium themes may give more options, such as adding sections with content that the user can add to their site. The most important tool that the Customizer holds in its arsenal is the custom CSS option.
I’m not a fan of inline CSS, but the Customizer lets you add CSS and shows a live preview. This is also an option with any built-in browser developer tools, it’s still an important addition to WordPress. You get a section to add code without digging through the editor tab and finding which CSS stylesheet to edit.
A brief history on the Customizer
Written in the WordPress Codex, the Theme Customization API or Customizer for short arrived in version 3.4. Before the API was usable, most developers include an options panel for their themes. This is the precursor to the Customizer, it essentially does the same functions as the new API; however, most themes required that you do “guess-n-check changes”, meaning that there was no live preview.
If you wanted to change the color or fonts, you would need to perform the change in the options panel and refresh your site to see the change. That’s if your developer was nice enough to include a panel. Most would make a limited “free” panel that would entice you into buying the “Pro” version of their theme. So you could have access to the full options. If your theme did not have any panel, it’s back to the dark ages of editing the source code to write the changes.
Your only solution would be to pay for the “Pro” version of the theme. Most have a yearly license fee to get more money from you in the long run. Your alternative would be to learn or hire a developer who can edit the theme’s source code to your specifications.
Why should I use it?
If the brief history section didn’t emphasize the removal “guess-n-check changes” portion, the Customizer replaces your deprecated theme options panel with what can be considered to be a “live” editor. Let’s face it, looking at the code can be really scary if you have no introduction into basic HTML/CSS. The fear of messing up the code and your site become a horrible mess is a good deterrent. I know it was for me when I first began developing sites.
The Customizer can provide relief for these fears. Most developers do an excellent job of integrating the API for more control over the appearance of your site. You can even make simple changes like adding widgets or more pages to your menu, without the need to access the dashboard. The live preview feature lets you see the changes before you apply them, which can be a lifesaver for sites with a larger audience. No one wants to refresh the page and be see a hot mess, right?
It doesn’t only help the site administrator, if you are a developer tasked with building your client their WordPress site, you will love this feature. Instead of having your clients email you the changes that they want to be performed weeks after you completed the project, take an hour or two and teach them how to use the Customizer. You will most likely find that after the short teaching session that your clients may not even contact you for minor changes since you are presenting them all the options they could want in a neat and user-friendly panel.
How do I access it?
Accessing the Customizer is easier than it looks, here are the steps to access and begin using the feature:
- Find the Customizer under the appearance menu using the old WordPress dashboard
- With the Customizer open, your site is to the right and the options that you can edit on your left
- When changing a simple setting such as the background color, you will see the change reflect on the right side. This does not affect your live site at all, it is only on your end
- When you are satisfied with the changes, you can hit the publish button to finalize your edits