In this digital era, styling your store with some lovely look and feel elements helps you to deliver a great user experience and let your store customer enjoy the whole shopping process until they get products hands on. Even if your store doesn’t have responsive web layout you will not only lose your traffic and conversions, but even search engine page rankings according to search engine update pushed by Google. So, don’t you think it’s time to tune your store? Either by adding new elements or changing your current theme.
Basically, the theme is a component of Magento which provides a stunning look and feel to your entire Magento store. Which is simply a combination of custom templates, layouts, styles or media. But “How to create a theme in Magento 2?” asked by one of our readers. That’s why here is the post open for all, to learn how to create your own theme in Magento 2.
To create a Theme, first you need to declare it by creating a theme.xml file in the following path. In this file you have to set title for the theme and need to define parent tag if you are willing to inherit another theme.
app\design\frontend\Themes\yourtheme\theme.xml
|
1 2 3 4 |
<!--?xml version="1.0" encoding="utf-8"?--> <!-- your theme's name --> Themes/yourtheme <!-- the parent theme, in case your theme inherits from an existing theme --> |
Once the theme is created you have to register your theme by creating “registration.php” file at below path.
app\design\frontend\Themes\yourtheme\registration.php
|
1 2 3 4 5 6 7 8 9 |
<!--?php \Magento\Framework\Component\ComponentRegistrar::register( \Magento\Framework\Component\ComponentRegistrar::THEME, 'frontend\Themes\yourtheme', __DIR__ ); </pre> <p>Lastly, you have to create "<strong>composer.json</strong>" file at below location inside your theme folder.<br ?--> <strong>app\design\frontend\Themes\yourtheme\composer.json</strong> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
{ "name": "Themes/yourtheme", "description": "N/A", "require": { "php": "~5.5.0|~5.6.0|~7.0.0", "magento/theme-frontend-blank": "100.0.*", "magento/framework": "100.0.*" }, "type": "magento2-theme", "version": "100.0.1", "license": [ "OSL-3.0", "AFL-3.0" ], "autoload": { "files": [ "registration.php" ] } } |
Simply play & with these codes according to your need of creating your own theme in Magento 2. Don’t forget to tell us which theme you have created in your Magento 2 by commenting down below.
Happy Coding!
Great Blog! brief information with helpful content for theme customization Magento 2. With the latest update Magento 2 can’t inherit plugins & extensions from Magento1.