How to customise a WordPress theme

You customise a WordPress theme with the tool that comes with your type of theme. You change a block theme in the Site Editor and a classic theme in the Customizer. For features the theme lacks, you add a plugin. Changes to the theme's code belong in a child theme, so a theme update doesn't wipe them.

Which tool you use depends on your theme

WordPress themes come as block themes or classic themes, and each kind has its own tool, so check which one yours is before you open either tool. You can tell which kind you have from the Appearance menu in your dashboard. With a block theme, you'll see Editor. With a classic theme, you'll see Customize instead. A block theme hides the Customizer, unless a plugin needs it.

Back up and test before you change anything

Back up your website before you start any WordPress customisation. If a change goes wrong, the backup lets you put your website back as it was. To make one yourself, use a backup plugin: you'll find automatic backup plugins in the plugin browser of your WordPress dashboard or in the WordPress plugin directory. Our hosting also makes a daily website backup. Restoring a backup yourself is included from our Professional plan up, and on Starter you can buy it as an add-on.

It's also worth trying your changes on a staging site first. All plans of Managed Hosting for WordPress include a staging environment. It's a private website where you test new themes, plugins and other changes before they reach your live website.

With Managed Hosting for WordPress, you test your theme changes on a private staging site and publish them with a click when you're ready.

Customise a block theme in the Site Editor

In a block theme, the Site Editor lets you design your whole website with blocks, from the header to the footer. Its Styles control the look of every page:

1. In your WordPress dashboard, go to Appearance > Editor.
2. Click Styles.
3. Pick one of your theme's style variations, or change the colour palette, typography and layout for the whole site.
4. Click Save to keep your changes.

The Site Editor also lets you change the layout itself. For that, it gives you templates and template parts. A template is the layout of a type of page, such as your blog posts or the 404 page. Template parts are pieces such as the header and footer. A block theme lets you place and edit blocks outside your content too, so you change these parts the same way you edit a page. Keep in mind that a change to the header or footer applies to every page that uses it, not only the page you're looking at. If you'd rather start again, you can reset your styles to the theme's defaults. Since typography is part of Styles, that's also where you change the font in WordPress across the whole site.

Customise a classic theme with the Customizer

In a classic theme, the Customizer lets you try out changes in a live preview before anyone else sees them:

1. In your WordPress dashboard, go to Appearance > Customize.
2. Open an option category in the menu on the left and set the value you want. The preview shows each change as you make it.
3. Click Publish when you're happy with the result.

What you can change is likely to differ from theme to theme, because each theme builds its own Customizer. One of WordPress's own themes, for example, lets you change the background colour, pick a background image and turn on Dark Mode.

Add your own CSS

If a setting you need isn't there, you can customise WordPress with your own CSS. CSS, short for Cascading Style Sheets, is the code that controls colours and layout. In a classic theme, you add it in the Additional CSS panel of the Customizer. In a block theme, the Styles panel of the Site Editor has its own place for custom CSS. WordPress loads your CSS after the theme's own, so your rules override the theme's without you editing its files.

You only write the rules you want to change. Each rule controls the design of one element on your pages, such as your paragraphs or your headings. For example, the rule p { color: darkgreen; } turns the text of your paragraphs dark green.

Custom WordPress design without code: plugins and page builders

If your theme is missing a feature, such as a contact form or a booking calendar, you add it with a plugin. You'll find plugins in the official plugin directory on the WordPress site. If plugins are new to you, start with our article on what WordPress plugins are.

For page layouts, a page builder gives you a drag-and-drop editor on top of your theme. Two of them are Elementor and Beaver Builder. With Beaver Builder, for example, the design you build depends on the plugin staying installed: uninstall it, and your pages may not look exactly the same, though your content stays.

Change the theme's code in a child theme

WordPress has a theme editor, the Theme File Editor, for changing a theme's template and stylesheet files from your dashboard. Use it with care. It doesn't make backup copies, and if an error crashes your website, you can't use the editor to fix it. You'd then need SFTP, a secure connection to your website's files, to upload a working copy of the file or to rename the theme's folder so WordPress switches to another theme. A theme update can also wipe out anything you change there.

If you want to change the code, make your changes in a child theme. A child theme takes everything from its parent theme, and your changes stay separate. The parent theme can then update without losing your modifications. The same goes for changes you make in the Customizer or as custom CSS, which WordPress says are preserved when the theme updates. The Site Editor saves its changes in your website's database, not in the theme's files.

Questions about customising a WordPress theme

What happens to my changes if I switch themes?

Your custom CSS stays with the theme you added it to, so it no longer applies when you switch to another theme. Switch back, and it's active again.

When does a custom WordPress theme make more sense?

When the changes would turn your child theme into a project of its own. WordPress's theme handbook says extensive changes in a child theme can become hard to manage. In that case, the same handbook says it's often better to build a full theme of your own.

Test your new design before it goes live

Before you publish, check that your new colours and fonts are easy for everyone to read. The text needs enough contrast with its background. Our article on website accessibility covers what to look for. Contrast is one part of website accessibility, which makes sure visitors who see less well can read your pages too.

Once your design reads well for every visitor, you can put it live. With Managed Hosting for WordPress, we then update WordPress, your theme and your plugins automatically and check each update visually.