Using the WordPress Customizer: Customize theme, colors, and layout

Reading time approx.: 15 minutes

With the WordPress Customizer you can customize the appearance of many classic WordPress themes directly in the admin area. Depending on the theme, you can modify things like the logo, colors, menus, homepage settings, widgets, or layout options there.

The big advantage of the customizer is the Live previewChanges are initially displayed in a preview and only need to be published once you are satisfied with the result.

However, not every current WordPress theme uses the classic customizer anymore. Modern Block Themes instead rely on the WordPress site editor at Design → Editor. Other themes and page builders, in turn, bring their own tools for design.

In this guide, we explain how the WordPress Customizer works, which settings you typically find there, and why the available options look different on various WordPress websites.

Briefly explained: With a classic WordPress theme, you usually reach the Customizer via Design → Customizer. You can check changes in the preview first and then publish them. If the menu item is missing, you may be using a block theme or another theme system.

What is the WordPress Customizer? #

The WordPress Customizer is an administrative interface for the visual configuration of classic WordPress themes.

On one side are the available settings. At the same time, you see a preview of your website and can control many changes before they are published for visitors.

Depending on the theme used, the following areas can be managed via the Customizer, for example:

  • Website title and subtitle
  • Logo
  • Website icon or favicon
  • Colors
  • Header
  • Background
  • Menus
  • Widgets
  • Home Page Settings
  • Layout
  • Typography
  • additional CSS

Which of these options are actually available depends mainly on the active theme.

Open the Customizer in the WordPress admin area #

With a classic theme, you will normally find the Customizer in the WordPress admin area.

Open WordPress Customizer #

  1. Log in to your WordPress admin area.
  2. Open Design.
  3. Click on Customizer.
  4. WordPress opens the Customizer with a preview of your website.

If you don't know how to log in to WordPress yet, you can find the complete guide at WordPress Login: How to log in to the admin area.

Why does my customizer look different than in a tutorial? #

That is completely normal.

The customizer merely provides the technical interface. The active theme determines to a large extent which setting options are offered within it.

A simple theme, for example, may provide only a few areas, while a more extensive theme integrates additional options for headers, footers, colors, typography, and layout.

Plugins can also add additional settings to the customizer.

Note: If a tutorial shows a Customizer menu item that you cannot find on your website, it does not automatically mean that something is missing in your WordPress installation. The feature in question may come from the theme or a plugin.

Why can't I find „Design → Customizer“ at all? #

If the menu item Customizer is missing, you might be using a modern Block Theme.

Block themes use the WordPress Site Editor. In this case, you will normally find:

Design → Editor

There, among other things, templates, headers, footers, navigation, global styles, and other website components are managed using blocks.

Therefore, you should not try to „restore“ a missing customizer with additional plugins just because an older guide uses it.

Distinguish between classic theme and block theme #

To find out which theme is active, open:

Design → Themes

There, the currently used theme is marked as active.

If under Design a Editor is offered for website design and the classic menu or widget management looks different or is missing, this indicates a block theme.

In contrast, with a classic theme, you will often still find menu items like:

  • Customizer
  • Widgets
  • Menus

However, the exact user interface still depends on the theme and the WordPress configuration.

This is how the WordPress Customizer is structured #

The classic customizer essentially consists of two areas.

In the settings area, you will find the options provided by the theme and plugins. Next to it, or on larger screens in the main area, a preview of your website is displayed.

For example, when you change a color, you can often see the effect immediately in the preview.

However, this does not necessarily mean the change is saved publicly as a result.

Publish changes in the Customizer #

If you change a setting, you should check the preview first.

Only when the result is correct, you publish or save the change using the corresponding button of the customizer.

Working safely with the Customizer #

  1. Open Design → Customizer.
  2. Select the desired setting area.
  3. Make the change.
  4. Check the result in the preview.
  5. For important layout changes, also check other pages.
  6. If possible, check the display on different screen sizes.
  7. Do not publish the change until the result is correct.

Change website information #

Many classic themes provide an area in the customizer like Website information Ready.

Depending on the theme, the following information can be managed there, for example:

  • Website Title
  • Subtitles
  • Logo
  • Website icon

The website title is a basic WordPress setting. Whether and where it is displayed depends on the theme.

When a logo is used, a theme can, for example, hide the written-out website title in the header.

Change logo via the Customizer #

If your theme supports a website logo via the customizer, you can replace an existing logo there or select a new one.

Replace logo #

  1. Open Design → Customizer.
  2. Open the website information or logo settings section.
  3. Select the existing logo or click the logo change feature.
  4. Select an image from the WordPress media library or upload a new file.
  5. Check size and display in the preview.
  6. Publish the change.

If your header is not managed via the customizer, the logo setting may be located somewhere else.

We explain more about the various header systems under Change header image in WordPress: correctly adjust logo, header, and title image.

What is the website icon? #

The Website icon is also often referred to as a favicon. It can be used, for example, in the browser tab, in saved bookmarks, or in other places where a compact visual identifier of your website is needed.

It is not the same as the normal logo in the header.

Therefore, a wide company logo is not automatically suited as a good website icon. For an icon, a simple, square graphic that is recognizable even in a small display is usually better suited.

Change colors in the customizer #

Many themes offer color settings in the customizer.

Depending on the theme, these can affect the following areas, for example:

  • Background color
  • Text color
  • Link color
  • Header color
  • Accent color
  • Button colors

The theme determines which colors can be changed globally.

Before changing a global color, you should consider that this setting may affect many pages at once.

Ensure sufficient contrast for colors #

A color should not only match the design. Text and important controls must also remain easily readable or recognizable.

For example, problematic are:

  • light gray text on white background
  • dark text on a similarly dark background
  • Buttons with barely legible labels
  • Links that do not visually differ sufficiently from normal text

Therefore, check not only whether a color combination looks „nice,“ but also whether content and controls can actually be easily perceived.

Adjust typography in the Customizer #

Some themes provide extensive settings for fonts and typography.

This may include:

  • typeface family
  • Font size
  • Font weight
  • Line height
  • Letter spacing
  • Headlines
  • Running text

However, these features are not part of the WordPress Customizer in every theme.

If you cannot find any typography settings, your theme might provide them in a different location or not support corresponding adjustments via the Customizer.

Do not use too many fonts #

In web design, more choices do not automatically mean a better result.

A website with many different fonts and font weights quickly looks inconsistent and may require additional web font files.

For most websites, a clear typographic structure with a few deliberately chosen variants is sufficient.

Above all, it is important that headings, body text, and UI controls are easily readable and visually consistent.

Customize the header via the Customizer #

With classic themes, various header settings can be located in the Customizer.

Depending on the theme, you can there, for example:

  • Change logo
  • Select header image
  • Change header height
  • Set colors
  • Configure navigation
  • enable additional header elements

These functions are completely theme-dependent.

If your website uses Elementor, a theme header builder, or a block theme, the visible header may not be generated via the classic customizer at all.

Edit menus via the Customizer #

With classic themes, WordPress menus can sometimes also be edited directly within the Customizer.

This allows you to make changes to the navigation while simultaneously checking the preview.

For a complete explanation of menu management, we recommend our guide Creating and managing menus in WordPress.

Manage widgets via the Customizer #

For themes that support classic widget areas, these can sometimes also be edited via the Customizer.

Typical widget areas include, for example:

  • Sidebar
  • Footer
  • Header area
  • additional theme sections

The theme determines which widget areas exist.

In modern block themes, many tasks that were previously solved with widgets are implemented with blocks instead.

Homepage settings in the customizer #

WordPress can display either the latest posts or a specified static page on the homepage.

With classic themes, you will often find this setting in the Customizer under Home Page Settings.

There you can, depending on the configuration, determine whether your home page:

  • your latest posts
  • or a static page

should display.

If you are using a static front page, you can additionally set a separate page for your blog posts.

We explain the underlying settings in more detail at Configure reading settings in WordPress.

Additional CSS #

Many classic WordPress installations offer in the Customizer the section Additional CSS.

There you can add your own CSS rules to specifically customize the appearance of your website.

CSS stands for Cascading Style Sheets and controls, among other things:

  • Colors
  • Spacers
  • Font sizes
  • Frame
  • Positioning
  • Display of certain elements

This allows you to implement customizations for which the theme does not provide its own graphical setting.

Use additional CSS only targeted #

Custom CSS rules can be very useful. However, you should know which element you are modifying and what effects a rule will have.

A very general CSS rule can unintentionally alter elements across the entire website.

Therefore, check changes in particular for:

  • Home
  • Subpages
  • Blog posts
  • Archive pages
  • Smartphones
  • Tablets

Important: Do not blindly copy CSS code from just any tutorial into a production website. Two WordPress websites can use completely different HTML structures and CSS classes despite having a similar appearance.

Do not confuse CSS and PHP #

The area Additional CSS is exclusively intended for CSS.

No PHP code belongs in there.

PHP runs on the server side and can modify the functions and logic of a WordPress website. CSS, on the other hand, primarily influences the visual presentation.

If you paste PHP code into a CSS field, it will not work.

Customizer is not a page builder #

The WordPress Customizer is sometimes confused with a page builder. However, both tools fulfill different tasks.

With the customizer, you primarily configure global design options or those provided by the theme.

A page builder like Elementor, on the other hand, is used to visually construct pages and sometimes also global website areas from individual elements.

Depending on the website, both systems can be used in parallel.

Why do I see changes in the Customizer, but not in the Elementor editor? #

When a website uses a page builder, different levels of design can come together.

The theme can, for example, provide global colors or a header, while the actual page content was designed with Elementor.

Elementor, in turn, can use its own colors, fonts, and templates.

Therefore, it must first be clarified, which system actually controls the element in question.

Do not randomly change the same setting in multiple places. That makes the configuration unnecessarily complicated in the long run.

Customizer change is not showing up #

If you have published a change but still see the old display on the public website, a cache may be the cause.

Cached content may exist, among other places, in:

  • your browser
  • a WordPress cache
  • a server-side cache
  • a CDN
  • a page builder

Test the website first in a private browser window.

If the old version appears there as well, then check whether you actually published the change and edited the correct theme section.

Customizer shows a different page than desired #

The customizer preview is not limited to the homepage.

You can navigate to other areas of your website within the preview to check how a global change affects them.

This is especially useful for changes to colors, typography, header, footer, or widgets.

A setting that looks good on the homepage can have unexpected effects on a blog post or other page template.

Check desktop, tablet and smartphone view #

The customizer offers options for previewing different screen sizes in many configurations.

Use this preview as a first check, but do not rely on it exclusively for important changes.

Then, if possible, open the website on a real smartphone or in different browser sizes as well.

You should pay special attention to:

  • Navigation
  • Logo
  • Header
  • Font sizes
  • Buttons
  • Spacers
  • Footer

Check changes before publishing #

One strength of the customizer is that you can preview settings first.

Use this opportunity in particular for global changes.

For example, if you change the primary color of your website, this can affect links, buttons, and other elements at the same time.

Therefore, check multiple page types before publishing a major design change.

Can I undo Customizer changes? #

You should not assume that every previously published theme setting can be restored at will via a complete version history.

For extensive changes, it is therefore advisable to document the previous values or have a backup of the website.

This is especially true if you change multiple settings at the same time and no longer know later which original values were used.

Create a backup before making major changes #

If you only change a single color, the risk is manageable. For more extensive theme adjustments, additional CSS, or changes to multiple areas of the website, however, you should make sure you have a recent data backup.

CURIAWEB WordPress Hosting includes a hosting environment designed for WordPress with, among other things, daily backups, SSL, and other features for running WordPress websites. You can find an overview at WordPress Hosting at CURIAWEB.

However, an existing hosting backup does not replace careful work. Especially with larger design changes, you should still check what you are modifying and which areas are affected by it.

Customizer and Theme Switching #

Customizer settings are often closely linked to the active theme.

When you change the theme, previous theme settings may therefore:

  • disappear
  • be replaced by other settings
  • have no effect for the new theme

That makes sense: A completely new theme can have entirely different layouts, headers, and configuration options.

Therefore, do not change the theme just because you cannot find a specific Customizer option immediately.

What happens to my content when I change themes? #

Standard WordPress content like posts and pages is generally not simply deleted by switching themes.

The Representation can, however, change significantly.

More problematic can be theme-dependent functions, widgets, special templates, or proprietary theme elements.

Therefore, changing a theme, especially on a live website, should be prepared and tested.

We explain how to install a new theme in our guide Install new theme in WordPress.

Customizer and child theme #

The customizer and a child theme fulfill different tasks.

With the Customizer, you use the configuration options provided by the theme. A Child Theme becomes relevant if you want to customize certain theme files or functions at the code level without making changes directly in the parent theme.

Therefore, for normal changes to the logo, colors, or supported layout settings, you do not automatically need a child theme.

We will explain later when a child theme is useful and how it works at What is a WordPress child theme and how do you create one?.

Customizer and WordPress Updates #

WordPress, themes, and plugins should be kept up to date. Changes that are saved via intended theme settings or the Customizer are fundamentally different from direct changes to a theme's files.

Directly edited parent theme files can be overwritten during a theme update. Therefore, you should not, for example, header.php or functions.php modifying a parent theme just to achieve a setting that might already be available through the Customizer.

We explain how to update WordPress and its components in a controlled manner at Updating WordPress: Keeping Core, Plugins, and Themes Secure and Up to Date.

Customizer does not load or shows a blank preview #

If the customizer does not load correctly, this can have various causes.

This includes, for example:

  • JavaScript error
  • Plugin conflicts
  • Theme issues
  • Cache issues
  • faulty HTTPS configuration
  • Issues with redirects
  • PHP error

First, test whether the public website and the regular WordPress admin area are working.

If the issue occurred immediately after installing or updating a plugin, this change should be taken into account during troubleshooting.

Customizer is not working properly after switching to HTTPS #

If a website is configured partially via HTTP and partially via HTTPS, issues with previewing or loading resources can occur.

Therefore, check whether the WordPress and website addresses are correctly set to HTTPS and the website is consistently accessible via the encrypted connection.

Our manual Enable SSL in WordPress and set up HTTPS correctly explains the main steps.

Customizer broken after plugin installation #

Plugins can integrate their own functions into the customizer or influence its functionality via JavaScript and other components.

If a problem occurs immediately after activating a new plugin, there may be a conflict.

We explain how to manage extensions correctly at Deactivate or delete WordPress plugins.

Does additional CSS disappear after a theme change? #

Additional CSS can be saved or applied in connection with the theme. When changing themes, you should therefore not assume that all previous CSS customizations can continue to be used unchanged for the new theme.

Even if the CSS code were still present, the classes and HTML structures of the new theme could differ.

CSS written specifically for the old theme can therefore be ineffective or even unsuitable for the new theme.

When should you not use the customizer? #

The customizer is not automatically the right tool for every design change.

Use the system that actually generates the website section in question instead.

This can be, for example:

  • Website Editor for Block Themes
  • Elementor with Elementor templates
  • Theme builder of another page builder
  • theme's own header builder
  • WooCommerce settings for specific shop features

If you change an element in the Customizer and nothing happens on the website at all, this is a strong indication that the visible element may be controlled by another system.

Typical mistakes in the WordPress Customizer #

  • searching for the Customizer even though a block theme is being used
  • Make changes and do not publish
  • change global colors without controlling other pages
  • Confusing the Customizer and the Page Builder
  • PHP code in Additional CSS paste
  • Copying CSS code unverified from third-party websites
  • only check the desktop view
  • ignore the cache on a non-visible change
  • switching the theme just because a setting cannot be found
  • Editing parent theme files directly, even though a designated setting exists

Note: The Customizer only shows you the settings that your theme and, if applicable, plugins provide there. Therefore, there is no Customizer that looks exactly the same on every WordPress website.

When should you contact CURIAWEB support? #

If you, as a CURIAWEB customer, cannot figure out where a specific theme setting is located or if the Customizer is not working technically, you can contact our support.

Helpful in this regard are:

  • the affected domain
  • the name of the active theme
  • the setting you want to change
  • whether Elementor or another page builder is used
  • as accurate a description of the problem as possible

If you are planning a new WordPress website or want to transfer an existing installation to a hosting environment designed for WordPress, you can also find our offers at CURIAWEB WordPress Hosting.

Summary #

The WordPress Customizer is especially popular among classic themes an important tool for customizing the website design. Depending on the theme, you can edit the logo, colors, header, menus, widgets, homepage settings, and other design options there, and preview the changes before publishing.

If Design → Customizer is not present on your website, it does not necessarily mean there is an error. Modern block themes instead use the site editor under Design → Editor. Elementor and other page builders, in turn, can have their own systems responsible for global website areas.

For navigation, you can find further information at Creating and managing menus in WordPress. If you specifically want to change the logo or header image, our guide will help you. Change header image in WordPress. On the other hand, you should not make major code adjustments directly in a parent theme; we will cover that separately in the WordPress Child-Theme.

Last updated August 27, 2026
Was this article helpful?
Content
Cookie Consent with Real Cookie Banner