In this beginner’s guide, you will learn about using the WordPress Theme Customizer. We will explain, what the WordPress Theme Customizer is, and show you some of the standard options that come with WordPress.
The WordPress Theme Customizer is only available if the active theme supports it. WordPress block themes that support building themes with blocks do not use the theme customizer.
NOTE: TarttWeb is reader-supported. This means that we may earn a small commission at no additional cost when you make a purchase through referral links on our site.
If you’d like to jump to the section you’re looking for, a hyperlinked table of contents is available.
What is the WordPress Theme Customizer?
The WordPress Theme Customizer is a built-in feature that allows you to easily make changes to the look and feel of your website. Using the Theme Customizer, you can preview and publish changes in real-time.
The options that are included in the Theme Customizer are dictated by your active WordPress theme, which means that each theme will have a different set of customizer options available.
How to Access the WordPress Theme Customizer
To access the WordPress Theme Customizer, you will first need to log into the admin area of your WordPress website.
Next, with your mouse cursor, hover over ‘Appearance‘, then click on ‘Customize‘ from the main navigation on the left side of the admin area. This will open the Customizer interface for your current theme.
You can also use the WordPress Theme Customizer for other themes that you have installed but are not active. To do that, you need to head over to the Appearance > Themes page.
From the left side of the admin area, hover over ‘Appearance‘ and then click on ‘Themes‘.
Next, hover over an installed theme and click on the ‘Live Preview‘ button to open the theme customizer.
How to Use the WordPress Theme Customizer
Once you have successfully opened the WordPress Theme Customizer, you will see your customization settings on the left side of the screen and a live preview of your website on the right. For this guide, we will be using the WordPress Twenty Twenty-One theme.
The WordPress Theme Customizer comes with a set of default option panels, no matter which theme you are using.
You can make changes by clicking on each panel on the left or you can make changes to each individual item by clicking on the pencil icon.
Remember that the customizer options you have available are determined by the theme you are using.
Now let us take a look at the different default option panels available in the WordPress Theme Customizer.
Customizing the Title, Logo, and Site Icon (Favicon)
The Site Identity panel has a few different options to choose from such as your Logo, Site Title, Tagline, and Site Icon also known as a Favicon.
The first option allows you to add a logo to your website. To do this, click on the ‘Select logo‘ button underneath ‘Logo‘ to upload one to your website.
The Site Identity panel also allows you to add or change your website’s title and tagline.
When WordPress is installed, the text ‘Just Another WordPress Site‘ is added by default. We recommend you either change this or leave it blank.
Checking the ‘Display Site Title & Tagline‘ box will display both the title of your website and your tagline. To display only the title of your website, you need to uncheck this box.
The last option in the Site Identity panel allows you to add a favicon to your WordPress site. You can do this by clicking on the ‘Select site icon‘ button and selecting your favicon icon.
Your favicon will need to have a width and height of 512px. We recommend using the .png format for your site icon.
Customize your Website Color Scheme
Clicking on the ‘Colors‘ panel will have options for changing colors within your theme. The options available to you will depend on the theme you are using.
For example, the WordPress Twenty Twenty-One theme gives you the option to change your website background color and an option to enable dark mode.
Adding Navigation Menus Using Theme Customizer
With the ‘Menus‘ panel, you can create, add, and control navigation menus on your website.
This panel shows you menus you’ve already created and has an option to create new ones. You can click on the ‘View All Locations‘ option to view the available menu locations that your theme supports.
To create a new navigation menu, click on the ‘Create New Menu‘ button.
Next, you’ll need to give your menu a unique name so you can manage it easily and select the location where you want it to appear. When you’re ready, click on the ‘Next‘ button to proceed.
To add items to your menu, click on the ‘Add Items’ button, which opens a new panel. You can now add categories, pages, posts, tags, and custom links to your menu.
To add items to your menu, simply click on the item to add it. To remove an item from your menu, click the red ‘X‘ next to the menu item.
If you want to reorder your menu items, you can click on the ‘Reorder‘ button and use the arrow icons, or you can simply drag and drop the items where you want them.
Adding Widgets Using the Theme Customizer
The WordPress Theme Customizer also allows you to manage widgets on your site.
Clicking on the Widgets panel will reveal the different locations where you can add widgets. Your widget locations will depend on the WordPress theme you are using.
For example, the WordPress Twenty Twenty-One theme offers widgets in the footer only, whereas the Twenty Twenty theme offers two footer widget areas.
Not only can you add widgets, but you can also add content blocks to widget areas.
To add a widget or block, simply click on the ‘Add block‘ button (the box with the plus sign), then click on Browse all.
This will open a new panel that shows all widgets and blocks that you can use in your widget area.
To add a widget, click on the one you want to add, then use the toolbar to adjust its settings. To access block settings, you need to click the Kobra menu and select ‘Show more settings‘.
Learn more about widgets by reading our guide on How to Add Widgets in WordPress.
Homepage Settings Panel
The Homepage Settings panel allows you to choose what is displayed as your homepage. By default, WordPress displays your blog posts in reverse chronological order on your homepage.
However, for many websites, such as those that offer services, users will prefer to have a custom homepage to display their products and services.
To use a custom homepage, you need to select the ‘A static page‘ radio button within the Homepage Settings panel. Doing so will reveal two dropdown menus, one to select your homepage and the other to select a page to display blog posts.
If you have already created some pages to use as your home and blog posts, you can use the dropdown menus to select them.
Otherwise, you can click on the ‘+ Add New Page‘ link right below the dropdown menu. Doing so will create a brand new blank page that you can name. Once you have created the pages you want to use, come back to the Homepage Settings and select them.
Adding Custom CSS in the Additional CSS Panel
This Additional CSS panel is for intermediate and advanced WordPress users. This panel allows you to customize your site further by letting you add custom CSS code to your website without editing any code files.
After inserting some CSS, you will see the changes live on the right side. When writing your CSS, WordPress will display helpful tips based on the letters you type and error messages if your CSS syntax isn’t correct.
Previewing Your Website on Different Screen Resolutions
Another default option in the WordPress Theme Customizer is the ability to see what your website looks like on different screen resolutions. This option allows you to see what your website looks like on different screen sizes, like a tablet or mobile phone.
Located at the bottom of the customizer screen, you will see three icons and a ‘Hide Controls‘ link.
The three icons allow you to test your website on different screen sizes, such as desktop, tablet, and mobile.
Clicking on the ‘Hide Controls‘ link hides the WordPress Customizer panel so you can view your website on full screen.
Publishing, Saving, and Scheduling Your Customizer Settings.
Once you have finished making your changes, you need to publish them to apply them to your site. Otherwise, all your hard work will be lost.
To do this, you can click the big ‘Publish‘ button at the top of the customizer. After that, you can click the ‘X‘ (close button) at the top left to exit the theme customizer.
You can also save your customizations as a draft and share a preview without giving access to your admin area.
Click on the ‘gear icon‘ next to the Publish button. Doing so will open the Action panel where you’ll find three options, Publish, Save Draft, and Schedule.
Now select the ‘Save Draft‘ option on the Action panel, then click on the ‘Save Draft button‘ to complete the action and store your changes. Now you can click the ‘Copy‘ button and share the preview link.
The last option here is the ability to schedule your changes to be published at a specific time. This is handy when you want your changes to go live when your site receives the least amount of traffic.
Lastly, you can reset all your unpublished changes by clicking on the ‘Discard changes‘ link at the bottom of the Action panel.
Wrapping Up
Hopefully, you now have a pretty good idea of how to use the WordPress Theme Customizer. Remember that the customization options available in the theme customizer will depend on the WordPress theme you are using.
If, you found this article helpful, let us know in the comments section, follow us on social media, or subscribe to our newsletter for more. If you need a guide or article written, contact us and select article request in the dropdown.
