How to Create a Magento 2 Theme?

Copy of luma theme

 

The following steps describe how to create New Magento 2 theme from the existing Magento Luma theme and its implementation.

  • Create a new Vendor folder inside app/design/frontend/NewVendorName (ex: DCKAP). The folder will be like this – app/design/frontend/DCKAP.
  • Create theme folder inside your Vendor folder app/design/frontend/DCKAP/theme-new
  • Next, navigate to vendor\magento\theme-frontend-luma
  • Copy entire folder and files inside “theme-frontend-luma” into your theme folder (i.e.) app/design/frontend/DCKAP/theme-new/
  • Edit app/design/frontend/DCKAP/theme-new/registration.php file and change as following ‘frontend/Magento/luma’ to ‘frontend/DCKAP/new’.
  • Next Edit app/design/frontend/DCKAP/theme-new/theme.xml file and change the title as per your identification.
  • Once done save and close the file.
<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
   <title>Dckap New</title>
   <parent>Magento/blank</parent>
   <media>
       <preview_image>media/preview.jpg</preview_image>
   </media>
</theme>
  • Finally, clear var/cache and var/page_cache before logging into Magento 2 Admin.
  • Navigate to Stores->Configuration->Design->Design Theme.
  • Select your newly created theme “Dckap New”. Save the configuration.
  • Refresh the frontend and you will be able to view your design from newly allocated theme.
  • To make sure please view ‘Page Source’ which will display the CSS and js URL path as per your registration.php configuration file.

Source: http://www.dckap.com/blog/creating-magento-2-theme/

Leave a Reply

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