How To Edit Your WordPress Theme Using The WordPress Theme Customizer

Learn how to customize the appearance of your WordPress theme using the WordPress Theme Customizer and WordPress Live Preview feature.

How To Edit Your WordPress Theme Using The WordPress Theme CustomizerWordPress themes provide non-techie website owners not only with an incredible choice of professional web design options and layouts but also great versatility and the ability to further customize the theme and create a unique look and feel for their sites.

In this step-by-step guide for non-techies, we’ll look at how to edit your WordPress theme using the WordPress Theme customizer and explore the options and settings of the WordPress Theme customizer menu.

How To Edit Your WordPress Theme Using The WordPress Theme Customizer

To access the WordPress Theme customizer, log into WordPress, then go to the main menu and select Appearance > Customize

WordPress menu: Appearance > Customize

(WordPress menu: Appearance > Customize)

This brings up the WordPress Theme Customizer screen …

WordPress Theme Customizer screen

(WordPress Theme Customizer screen)

The Theme Customizer section allows you to edit and configure your theme settings and preview changes live before committing these to your site …

WordPress Theme Customizer: Theme options menu and live preview screen

(WordPress Theme Customizer: Theme options menu and live preview screen)

WordPress Theme Customizer – Live Preview Feature

The Live Preview section contains clickable edit buttons …

Click to edit WordPress theme elements

(Click to edit WordPress theme elements)

Clicking on the edit buttons brings up relevant sections of the Customizer menu and allows you to configure theme elements in live preview mode …

Edit WordPress theme elements in live preview mode

(Edit WordPress theme elements in live preview mode)

As you make changes to options, fields, or settings, WordPress displays these in the Live Preview section …

View live WordPress Theme edits in the Customizer

(View live WordPress Theme edits in the Customizer)

Once you are happy with the changes you have made to your theme, click the ‘Publish’ button to save these and update your theme settings …

Publish your theme changes

(Publish your theme changes)

In version 4.9, WordPress introduced a number of changes to improve Theme Customizer workflow, such as the ability to save your theme changes in ‘draft’ mode, schedule your theme changes for publishing at a later date, collaborate on theme design improvements with others by sharing design preview links, locking your design to protect it from being changed by other users, and more.

To access these additional publishing settings, click on the gear icon next to the ‘Publish’ button …

Click the gear icon to access additional theme publishing settings

(Click the gear icon to access additional theme publishing settings)

This brings up additional Theme Customizer options …

Additional Theme Customizer options

(Additional Theme Customizer options)

Select one of the publishing options from the ‘Action’ section to save your changes …

Publish your theme changes live, as a draft, or schedule for later

(Publish your theme changes live, as a draft, or schedule for later)

To exit the WordPress Theme Customizer feature, click on the ‘X’ button …

Exit WordPress Theme Customizer

(Exit WordPress Theme Customizer)

Note: If you exit the WordPress Theme Customizer feature without saving your changes, you will be prompted to cancel and save/publish your edits, or navigate away from the page and lose your changes …

WordPress Theme Customizer 'exit without saving' prompt

(WordPress Theme Customizer ‘exit without saving’ prompt)

Sometimes, when exiting the Theme Customizer screen, you may also see a warning from the WordPress Autosave feature asking you to restore your most recent changes …

WordPress Autosave notice

(WordPress Autosave notice)

WordPress Theme Customizer Menu

WordPress Theme Customizer Menu

(WordPress Theme Customizer Menu)

The WordPress Theme Customizer menu provides a number of configurable options and settings. The items you will see on the menu depend on the WordPress theme you have installed on your site and can include the following:

  • Default theme configuration options and settings
  • Custom theme options and settings specific to the active WordPress theme you are currently using
  • Options and settings from active WordPress plugins that you have installed on your site, which affect you current theme.

Let’s go through these menu items …

WordPress Theme Customizer Menu – Active Theme

To change your current WordPress theme, click the ‘Change’ button in the ‘Active theme’ section of the WordPress Theme Customizer menu …

WordPress Theme Customizer menu - Active theme section

(WordPress Theme Customizer menu – Active theme section)

From the ‘Themes’ section, you can select a different theme from the themes you have currently installed on your site …

Select a new theme from your installed WordPress themes

(Select a new theme from your installed WordPress themes)

Or search for new themes from the WordPress theme repository …

Search & Preview WordPress Themes From The Theme Customizer

(Search & Preview WordPress Themes From The Theme Customizer)

You can search, browse, and preview thousands on WordPress themes from from your Theme Customizer screen before deploying changes to your site and speed up the search for new themes with filters for subject, features, and layout.

Changing WordPress Themes – Installed Themes

To change your existing theme to a new theme that you have already installed on your site, click on ‘Live Preview’ …

Installed themes - Live Preview

(Installed themes – Live Preview)

WordPress will display a live preview of the new theme in your Customizer screen. Click on ‘Activate & Publish’ to activate and switch themes …

Click 'Activate & Publish' to change your active WordPress theme

(Click ‘Activate & Publish’ to change your active WordPress theme)

Changing WordPress Themes – WordPress.org Themes

If you can’t find a new theme from the themes you have currently installed on your site, you can browse the WordPress.org free theme repository from the Theme Customizer’s ‘Active theme > WordPress.org themes’ section.

After finding a new theme, click on ‘Install & Preview’ …

Install & Preview new WordPress themes

(Install & Preview new WordPress themes)

The new theme will be installed and display in the Theme Customizer’s ‘Live Preview’ screen …

WordPress Theme switching - live preview

(WordPress Theme switching – live preview)

Click on ‘Activate & Publish’ to activate and switch themes …

Click 'Activate & Publish' to change themes

(Click ‘Activate & Publish’ to change themes)

Info

As mentioned earlier, installing new themes can add new items to the WordPress Theme Customizer menu …

New WordPress themes can add new custom settings to the Customizer menu

(New WordPress themes can add new items to the Customizer menu)

New Theme Customizer menu items often add new configurable theme options and settings to the feature …

WordPress Theme Customizer menu items add new theme options and settings

(WordPress Theme Customizer menu items add new theme options and settings)

To exit the ‘Themes’ section (or any Customizer menu section), click on the arrow to the left of the menu item …

Click on the arrow to exit a Customizer section

(Click on the arrow to exit a Customizer section)

Tip

WordPress themes cannot be deleted or uninstalled from the Customizer section. To delete or uninstall a WordPress theme, go to the Themes section (‘Appearance > Themes’).

To learn more about managing and editing WordPress themes, see the tutorial below:

WordPress Theme Customizer Menu – Site Identity

Click on ‘Site Identity’ in the WordPress Theme Customizer menu …

WordPress Theme Customizer - Site Identity

(WordPress Theme Customizer – Site Identity)

This section lets you customize elements of your site like the logo, site title, tagline, and site icon …

WordPress site identity options

(WordPress site identity options)

To learn more about configuring settings in this section, see the following tutorials:

WordPress Theme Customizer Menu – Colors

Depending on the WordPress theme installed on your site, you can have a choice of options (or a single option, or no options) for customizing your site’s colors …

WordPress Theme Customizer - Colors

(WordPress Theme Customizer – Colors)

WordPress Theme Customizer Menu – Header And Background Image

Once again, depending on the WordPress theme installed on your site, you may see options for customizing your site’s Header and Background image …

Customize WordPress Header and Background images

(Customize WordPress Header and Background images)

To learn more about using logos and images in this section, see the tutorials below:

WordPress Theme Customizer Menu – Menus

To edit your WordPress theme menus in the Theme Customizer, click on the ‘Menus’ section …

WordPress Theme Customizer - Menus

(WordPress Theme Customizer – Menus)

The menus you will see displayed in this section depend on your currently active theme …

Customize your WordPress menus in the Theme Customizer

(Customize your WordPress menus)

To learn more about using menus in WordPress, see the tutorial below:

WordPress Theme Customizer Menu – Widgets

To edit your WordPress theme widgets in the Theme Customizer, click on the ‘Widgets’ menu item …

WordPress Theme Customizer - Widgets

(WordPress Theme Customizer – Widgets)

The widgets displayed in this section will depend on your currently active theme …

Customize your WordPress widgets in the Theme Customizer

(Customize your WordPress widgets in the Theme Customizer)

You can also access the widget section by clicking on the edit buttons in the Live Preview screen …

Edit your theme widget settings in the WordPress Live Preview screen

(Edit your theme widget settings in the WordPress Live Preview screen)

To learn more about using widgets, see the tutorials below:

WordPress Theme Customizer Menu – HomePage Settings

You can configure your WordPress home page settings from the ‘Homepage Settings’ menu item …

WordPress Theme Customizer - Homepage Settings

(WordPress Theme Customizer – Homepage Settings)

To learn more about WordPress home page settings, see the tutorial below:

WordPress Theme Customizer Menu – Additional CSS

You can view and edit some of your WordPress theme’s CSS code by clicking on the ‘Additional CSS’ menu section …

WordPress Theme Customizer - Additional CSS

(WordPress Theme Customizer – Additional CSS)

This brings up the ‘Additional CSS’ section …

Edit your WordPress Theme CSS

(Edit your WordPress Theme CSS)

In WordPress 4.9, several coding enhancements were introduced, such as Syntax Highlighting and Error Checking, which allows users to scan, pinpoint, and fix CSS editing and coding errors quickly and easily from the WordPress Theme Customizer …

Coding Enhancements

(Scan and fix CSS errors easily in your WordPress theme coding)

Tip

Even if you are a non-technical WordPress user, this feature can help you pinpoint issues and alert theme developers about problems with your existing theme.

WordPress Theme Customizer Menu – Plugin Settings

Adding certain plugins to your website can affect your WordPress theme. Depending on the plugins you have installed (e.g. Yoast SEO), you may find new options and settings added to your Theme Customizer menu …

WordPress Theme Customizer - Plugin Settings

(WordPress Theme Customizer – Plugin Settings)

To learn more about using plugins in WordPress, see the tutorials below:

WordPress Theme Customizer Menu – Live Preview Display Options

Most WordPress themes are fully responsive. The WordPress Live Preview feature in the WordPress Theme Customizer lets you see how your site will display in different devices and viewing platforms …

Live Preview Display Options Menu

(Live Preview Display Options Menu)

By default, live previews display your site as seen on a full resolution screen (e.g. a desktop or laptop computer) …

Live Preview - Full Screen Display

(Live Preview – Full Screen Display)

You can also see how your site will display on a tablet screen …

Live Preview - Tablet Screen Display

(Live Preview – Tablet Screen Display)

And on a mobile device screen …

Live Preview - Mobile Screen Display

(Live Preview – Mobile Screen Display)

Click on the ‘Hide Controls’ button to hide the WordPress Theme Customizer menu …

@@@@@@@@

(WordPress Theme Customizer – Hide Controls)

This lets you preview your theme without being distracted by the Customizer menu …

Live Preview With Theme Customizer Hidden

(Live Preview With Theme Customizer Hidden)

Congratulations! Now you know how to edit your WordPress theme using the WordPress theme Customizer feature.

How To Edit Your WordPress Theme Using The WordPress Theme Customizer

[adrotate group="6"]

***

[adrotate group="3"]

Disclaimer: WordPress and its related trademarks are registered trademarks of Automattic, Inc. This site is not affiliated with nor sponsored by Automattic, Inc. or the WordPress Open Source project. This site and the services and products offered on this site are not associated, affiliated, sponsored, or endorsed by WordPress, nor have they been tested, certified, or reviewed by WordPress. The owner, contributors and/or advertisers may derive financial benefit from sales of items linked to, advertised, or reviewed on this site.

***

Did you find this post useful? If so, please consider sharing this post with other blog owners using the social links below.

How To Install WordPress Themes Manually

Learn how to install WordPress themes manually in this tutorial.

WordPress TutorialThis tutorial was created using an earlier version of WordPress and may contain outdated information. Please bookmark this page as we will be updating this tutorial soon! To be notified of updates to our content, subscribe to our updates list (see sidebar), or Like our Facebook page.

***

Typically, when purchasing premium WordPress themes, you will download a zip file containing the theme that requires uploading to your WordPress installation directory before you can activate and use it.

In this step-by-step tutorial, you will learn how to upload and install WordPress themes manually on your website or blog.

help To learn more about using WordPress themes and the benefits and advantages of choosing WordPress themes over traditional web design templates, see the tutorial below:

redarrow WordPress Themes Explained

help To learn how to upload and install a WordPress theme via the WordPress Dashboard, see the tutorial below:

redarrow How To Install WordPress Themes Using The WordPress Dashboard

How To Install A WordPress Theme Manually: Step-By-Step Tutorial

Before installing a theme on your WordPress site, download the theme’s zip file to your hard drive.

You can download Premium WordPress themes from commercial theme developers, or visit the WordPress Theme Directory to download free themes to your hard drive …

How To Install WordPress Themes

Tip

Create a folder on your hard drive to store all of your WordPress-related files (e.g. updates, plugins, themes, etc …). This will help you keep things organized and save you time managing your site.

help If you need a compression utility to download and extract zip files, go here:

redarrow WinZip

***

Download the theme you want to install into your WordPress Themes folder …

How To Install WordPress Themes

After the zip file has downloaded, extract the theme files into your WordPress Themes folder …

How To Install WordPress Themes

You should now have two versions of your theme files:

  1. The original zipped (compressed) files
  2. The unzipped (uncompressed / extracted) files

How To Install WordPress Themes

In the section below, you will learn two different methods to install WordPress themes manually to your site, which require using either the compressed or the compressed theme files, depending on which installation method you choose …

How To Install WordPress Themes

The first method described below shows you how to use FTP to upload your theme files to your server. The second method is faster and uses cPanel File Manager.

Note: If you need help understanding how to use FTP or cPanel to upload files to your server, please see this tutorial.

How To Upload A WordPress Theme Using FTP

Open up your FTP client and select the theme folder you want to upload to your site …

How To Install WordPress Themes

With your theme folder still selected, connect to your server (1). In your server window, navigate through the folders until you find the “themes” folder inside the “wp-content” directory. Select this folder as the destination directory (2).Click the upload button (3) to begin transferring files from your computer hard drive to your server …

How To Install WordPress Themes

Now that your theme files have been uploaded to your server, the next step is to log into your WordPress admin area to make sure that your theme has been installed correctly and to activate your new theme.

Skip the section below if you are using FTP to upload your files and go to the section titled “Verify That Your WordPress Theme Has Been Uploaded” at the bottom of this page to continue …

How To Upload A WordPress Theme Using cPanel

Log into your cPanel account …

cPanel Login Screen

Go to Mail, and click on File Manager

cPanel FileManager

Drill down to the “themes” folder and click the Upload button in the File Manager menu …

How To Install WordPress Themes

Click Browse to locate your file …

How To Install WordPress Themes

Locate and select the compressed (zipped) version of your WordPress Theme and click Open to begin importing the file into your server …

How To Install WordPress Themes

After the file has finished uploading, click Reload to refresh your screen …

How To Install WordPress Themes

You should see your uploaded zip file listed in the File Manager window. Select the file you have just uploaded and then click Extract

How To Install WordPress Themes

When the “Extract” screen pops up on your browser, click Extract File(s)

How To Install WordPress Themes

After all of your files are extracted, click Close to exit the “Extraction Results” window and return to the main File Manager screen …

How To Install WordPress Themes

The zipped file containing your uploaded theme is no longer required. Select the .zip file in the File Manager list and click Delete to remove the file from your server …

How To Install WordPress Themes

Now that your file has been uploaded to your server, the next step is to log into your WordPress admin area and make sure that your theme has been uploaded and installed correctly.

Verify That Your WordPress Theme Has Been Uploaded Correctly

Log into your WordPress administration area …

Wordpress Login Screen

In your WordPress dashboard menu, select Appearances > Themes

How To Install WordPress Themes

Your newly uploaded theme will show up in the “Available Themes” section of the Manage Themes tab …

How To Install WordPress Themes

Click Activate to make your newly uploaded theme your site’s current active theme …

How To Install WordPress Themes

Congratulations! Now you know how to manually upload and install a WordPress theme on your website or blog.

***

[adrotate group="3"]

Disclaimer: WordPress and its related trademarks are registered trademarks of Automattic, Inc. This site is not affiliated with nor sponsored by Automattic, Inc. or the WordPress Open Source project. This site and the products and services offered on this site are not associated, affiliated, sponsored, or endorsed by WordPress, nor have they been tested, certified, or reviewed by WordPress. The owner, contributors and/or advertisers may derive financial benefit from sales of items reviewed, linked to, or advertised on this site.

[adrotate group="6"]

***

Did you enjoy this post? If so, please consider using the share buttons below and share this tutorial with with other website owners.

How To Install WordPress Themes Via The WordPress Dashboard

Learn how to install WordPress themes via the WordPress Dashboard in this step-by-step tutorial.

WordPress TutorialThis tutorial was created using an earlier version of WordPress and may contain outdated information. Please bookmark this page as we will be updating this tutorial soon! To be notified of updates to our content, subscribe to our updates list (see sidebar), or Like our Facebook page.

***

WordPress provides a number of integrated search features that allows you to search, import, and install WordPress Themes automatically from your WordPress dashboard. More importantly, any WordPress user can install a theme on their site easily and without any web design knowledge required. You simply choose a WordPress theme (Free or Premium), upload it to your site, and activate it to instantly transform the entire look and feel of your website.

In this tutorial, you will learn how to install WordPress themes via the WordPress Dashboard.

help To learn more about using WordPress themes and the benefits and advantages of choosing WordPress themes over traditional web design templates, see the tutorial below:

redarrow WordPress Themes Explained

help To learn how to upload and install a WordPress theme manually, see the tutorial below:

redarrow How To Install WordPress Themes Manually

Installing WordPress Themes Via The WordPress Dashboard

Complete the step-by-step tutorial to learn how to install WordPress themes automatically on your site or blog via the WordPress dashboard.

Useful Info

In version 3.8, WordPress introduced a more streamlined grid design to the WordPress ‘Themes’ section …

Themes Section

You can add new themes by clicking the ‘Add New Theme’ button directly in the grid …

Installing Themes

The ‘Theme Details’ screen can be accessed by hovering your mouse over the theme thumbnail and clicking on the ‘Theme Details’ button …

Installing Themes

The ‘Theme Details’ screen has scrollable sections, allowing you to scroll through all the available themes installed on your site …

Installing Themes

***

Installing WordPress Themes – Step-By-Step Tutorial

Log into your WordPress admin section, then scroll down your WP-admin sidebar menu and click on Appearance > Themes

How To Install WordPress Themes

You will be taken to the “Themes” section of your WordPress administration area. Click on Install Themes

How To Install WordPress Themes

The ‘Install Themes’ section allows you to import, upload and install and activate WordPress themes on your site …

How To Install WordPress Themes

There are several options for installing WordPress themes:

  • By URL method
  • Search method
  • Upload method
  • Featured method
  • Newest method
  • Recently Updated method

Let’s go through each of these options now, starting with the Upload Method, as this is most likely the method you will use to upload themes to your site.

Installing WordPress Themes Using The Upload Method

Use the Upload method to upload a theme from your hard drive and automatically install it on your WordPress site. This feature is useful if you want to install a custom WordPress theme (e.g. a theme purchased through a theme vendor), or if your site does not allow you to install a theme directly from the WordPress Theme Directory.

To upload and install a WordPress Theme automatically to your site using the ‘Upload’ feature, make sure that you have downloaded a zipped file containing the theme you want to your hard drive.

Either download a premium theme from the vendor’s site or visit the WordPress Theme Directory and browse through the site until you find a theme that you like.

Tip: Use the WordPress Theme Directory’s Feature Filter to search for free themes based on specific criteria like custom colors, number of columns, support for featured images, full-width template, theme subject, etc …

Theme Directory - Feature Filter

(Theme Directory – Feature Filter)

When you find a theme that you like, click on the Download button to save the theme’s zip file to your hard drive …

How To Install WordPress Themes

Tip

We recommend creating a folder on your hard drive to store all of your WordPress-related files (e.g. updates, plugins, themes, etc.). This will help you keep things organized and save you time when managing your site …

How To Install WordPress Themes

Once you have downloaded your theme, go to your WordPress admin and select Appearance > Themes > Install Themes, then click on Upload in the options menu at the top of the page …

How To Install WordPress Themes

Click on Browse to search inside your hard drive for the theme file to be uploaded …

How To Install WordPress Themes

Locate the theme .zip file you downloaded earlier to your computer, then select the file and click Open

How To Install WordPress Themes

Click on Install Now to import and install the theme file …

How To Install WordPress Themes

Note: You may be asked to enter your FTP details in the “Connection Information” screen. If this happens, enter your “Hostname“, “Username” and “Password” and click “Proceed” to continue …

Wordpress Maintenance Tutorials

If the theme installs successfully, you will see a Theme installed successfully message on your screen. Click on ‘Live Preview’ to preview your theme, return to the main Themes page, or click Activate to begin using the theme on your site straight away …

How To Install WordPress Themes

Once your theme is activated, you can click on ‘Visit site’ to view your site live on your browser (and see your site the way your visitors will see it), or choose another function to keep working inside your WordPress admin area …

How To Install WordPress Themes

Note: “Activating” a theme replaces a previously active theme as the default theme displaying on your site. Your other themes will remain installed and inactive on your site. Inactive themes do not get deleted from your site unless you specifically delete them. You can install as many WordPress themes on your site as your server space will allow.

Installing WordPress Themes Using The Search Feature

Go to your WordPress admin and select Appearance > Themes > Install Themes, then click on Search in the options menu at the top of the page …

How To Install WordPress Themes

The Search feature allows you search for free WordPress themes listed in the WordPress Theme Directory database by entering keywords or selecting specific features …

How To Install WordPress Themes

To search for themes, enter a keyword in the ‘Search for themes by keyword’ field, or select specific features you are looking for by ticking the checkboxes next to the features you want, and click on Find Themes …

How To Install WordPress Themes

A list of themes matching your search criteria is returned by the search feature and displayed in your window. To install a theme on your site just click on the Install Now link below the theme’s thumbnail image …

How To Install WordPress Themes

You can also preview how a theme will look before installing it by clicking on the ‘Preview’ link below the thumbnail image, or click on ‘Details’ to read the theme developer’s description and other information …

How To Install WordPress Themes

Installing WordPress Themes Using The URL Feature

The default theme installation screen is By URL. If you know the location of your theme’s zip file, enter the URL into the location field and click Install Now to install your theme …

How To Install WordPress Themes

The Featured, Newest and Recently Updated methods all work in a similar way. Let’s take a look at these functions now.

Installing WordPress Themes Using The Featured Method

Go to your WordPress admin and select Appearance > Themes > Install Themes, then click on Featured in the options menu at the top of the page …

How To Install WordPress Themes

A list of featured themes on the WordPress Theme Directory is displayed in your window. To install a theme on your site just click on the Install Now link below the theme’s thumbnail image …

How To Install WordPress Themes

Installing WordPress Themes Using The Newest Feature

Go to your WordPress admin and select Appearance > Themes > Install Themes, then click on Newest in the options menu at the top of the page …

How To Install WordPress Themes

A list of newly-added themes to the WordPress Theme Directory is displayed in your window. To install a theme on your site just click on the Install Now link below the theme’s thumbnail image …

How To Install WordPress Themes

Installing WordPress Themes Using The Recently Updated Feature

Go to your WordPress admin and select Appearance > Themes > Install Themes, then click on Recently Updated in the options menu at the top of the page …

How To Install WordPress Themes

A list of the recently updated themes on the WordPress Theme Directory is displayed in your window. To install a theme on your site just click on the Install Now link below the theme’s thumbnail image …

How To Install WordPress Themes

help If you experience any problems installing a WordPress theme using the methods shown above, try using the manual method to install WordPress themes described in the tutorial below:

redarrow How To Install WordPress Themes Manually

Congratulations! Now you know how to update WordPress themes via the WordPress dashboard.

***

[adrotate group="3"]

Disclaimer: We have no association with WordPress or any of the products discussed on this website. We may derive an affiliate commission of financial benefit from the sale of products advertised, endorsed or linked to our site. All images remain the copyright of their respective owners, comply with all license terms and agreements of use are being used solely for illustrative or training purposes.

[adrotate group="6"]

***

Have you found this post useful? If so, please share this post with other WordPress users using the share buttons below.