How to Use WordPress Theme Customizer To Modify Themes

All ThemeLab themes allow users to customize their WordPress sites using the built-in Theme Customizer. Theme Customizer provides developers an easier way to replace theme option panels. But more importantly, it is easier for the end user to setup themes with live preview without even activating a theme. In this article, I will show you how to use WordPress theme customizer to modify themes.

Before we get started, please keep this in mind that not all WordPress themes use theme customizer. Some WordPress themes have their own options panel. However, recently more and more theme developers are utilizing theme customizer.

For the sake of this tutorial, I am using our first free theme Slipstream. It is a fully responsive theme for blogs and personal websites.

To launch theme customizer in WordPress, you need to click on Appearance menu to view all installed themes on your site. You will notice that your currently active theme has a customize button. Clicking on the button will launch the theme customizer. You can also launch theme customizer for any of your currently installed themes. Just take mouse over to a theme, and then click on Live Preview button. However, any changes you make to an inactive theme in Live Preview can only be stored by activating the theme.

Theme customizer screen is divided into two sections. On your right, you will see a live preview of your site. On the left, you will find different sections that you can customize through theme customizer.

Clicking on a section in theme customizer will expand it to show you the settings for that section. For example, in the screenshot below you can see Background Image section expanded in Slipstream’s Theme Customizer view.

Some of the most common theme customizer controls are

• Site Title and Tag Line – Allows you to change site title and tagline.
• Colors – Choose colors for different areas in site layout.
• Header Image – Set an image in the header.
• Background Image – Set a background image for all pages in your theme.
• Widgets – One Widgets section for each widget ready area in your theme.

The options in available in theme customizer may differ from theme to theme.

Setting Widgets in WordPress Theme Customizer

WordPress 3.9 introduced live widget previews, which allows you to set up widgets directly from theme customizer. Setting up widgets in theme customizer is easier and a little faster than adding them from the Widgets screen.

Simply click on a Widgets area to expand it. If the widget area already contains widgets, then theme customizer will display those widgets. You rearrange widget order by simply dragging widgets. You will also see a +Add Widget button at the bottom.

Clicking on the Add Widget button will display a new column to the right containing all the available widgets that you can add to your sidebars/widget ready area. Just click on the widget you want to add and it will appear in your widget area.

You can also edit widgets in theme customizer. Just click on the downward arrow next to any widget in your widget area and it will expand to show you the widget options. You can edit the widget while viewing a live preview of it. You can also remove a widget at any time by clicking on the delete link.

As the usage of theme customizer becomes popular among developers we can hope that it will become the default theme options panel in the future. We can also hope that we will be seeing innovative usage of theme customizer in the plugins as well. This will provide users a standard location and method to customize their themes.

I hope that this article helped you learn how to use theme customizer to modify WordPress themes.

If you liked this article, then join ThemeLab on Google+ and Twitter.

The post How to Use WordPress Theme Customizer To Modify Themes appeared first on ThemeLab.

Written by - Visit Website