How to Change Magento 2 Theme

how to change magento 2 theme
Last updated May 6, 2024

You can change the Magento 2 theme pretty easily, and doesn’t require any technical knowledge. In this article we’ll cover:

  1. Steps to change Magento 2 Theme
  2. How to add a design extension
  3. Troubleshooting- for when the changes don’t get applied.

Prerequisite:

Make sure you’ve set your store in developer mode.

Steps to Change Theme in Magento 2

The steps to applying or changing a Magento 2 theme are as follows:

  1. Log in to your Magento Admin Panel and select content > design > configuration
How to Change Magento 2 Theme

2. Click on Edit theme.

3. In the applied theme dropdown, select the theme you want to change to.

Default theme Magento stores

4. Click on Save Configuration

5. Delete Cache if it has been enabled.

6. Reload the storefront pages to check if the changed have successfully applied

Add A Design Exception

In Magento 2, you can also set a ‘design exception’. Meaning, you can set a different theme for particular user-agents, instead of creating a completely different store view for them.

  1. For this too, go to your admin panel and select content > design > configuration
  2. Click on edit theme
  3. On the Design Rule tab, select Add New User Agent Rule.
  4. In the Search String box specify the user-agent using regular expressions (PCRE) or normal strings. In the theme name drop-down menu select the theme to be used for the matching agent.
  5. Click on save configuration, and reload the front pages to see your changes.

What if Your Changes don’t Get Applied?

If your theme doesn’t change when you clear cache and reload the pages, then it is advised to:

  1. Delete all the files in pub/static/frontend and var/view_preprocessed directories and then reload the pages.

You can do this either manually, or by running the following command in CLI:

clean:<theme_name>

Related: Best Free Magento 2 Themes for 2020

If there’s anything we missed, or you have a query, do let us know in the comment section!

  •  
  •  
  •  
  •  
  •  

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *