Using the Default Theme

Magento’s default responsive theme renders the display of your storefront for different devices, and incorporates best practices for desktop, table, and mobile devices. Some themes are designed to be used only with specific devices. When Magento detects a specific browser ID, or user agent, it uses the theme that is configured to be used for the specific browser. The search string can also include Perl-Compatible Regular Expressions (PCRE). To learn more, see User Agent.

Themes

To filter the theme grid:

  1. On the Admin sidebar, go to Content > Design > Themes.

  2. Click Filters.

  3. To filter, enter an ID range, theme name (or title), folder path, or parent theme.

  4. Click Apply Filters to update the list of themes.

To view the current theme settings:

  1. On the Admin sidebar, go to Content > Design > Themes.

  2. In the list of installed themes, find the theme that you want to examine, and click the row to display the settings.

  3. To view a sample page, click the Theme Preview Image.

Preview Theme

To apply a theme:

  1. On the Admin sidebar, go to Content > Design > Configuration.

  2. Find the store view that you want to configure. Then, click Edit in the Action column.

  3. Under Default Theme, set Applied Theme to the one that you want to use for the current view.

Applied Theme

To add a user agent rule:

  1. Under Design Rule, click Add New User Agent Rule. Then, do the following:

    Design Rule

  2. In the Search String field, enter the browser ID for the specific device. For example:

  3. Search strings are matched in the order they are entered. For example, for Firefox enter:

    /^mozilla/i

  4. Repeat the process to enter additional devices.

  5. When complete, click Save Config.