Create a responsive mobile theme based on a default theme
What’s in this topic
The topic describes how to create a responsive mobile-specific theme using the default Magento approaches.
Creating a mobile-specific theme
To use all the responsive approaches implemented in the Magento out-of-the-box Blank and Luma themes, your theme should declare one of them as a parent.
To create a mobile-specific theme:
- Create a theme as described in Create a theme, having specified Blank or Luma as a parent theme.
- Add a
<theme_dir>/Magento_Theme/layout/default_head_blocks.xmllayout file with the following content:
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <remove src="css/styles-l.css" /> </head> </page>
This will remove the desktop-specific files from your theme.