0

I have given tasks in Magento to create a custom theme. My task is to create Magento Theme from scratch. I want a source that I can refer to. If anyone did this before please help me.

Thank You

4 Answers 4

0

you can easily checking it in Magento 2 Documentation is there chapter about it https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/themes/theme-create.html – every single step is described with file structure.

0

I believe this cover it in detail link

And this is one of the best videos covering this topic link

This might be useful for you- link

0

You need to below require steps for creating a new theme in the Magento 2:-

  1. Create a directory for the theme under app/design/frontend/<your_vendor_name>/<your_theme_name>

Example: app/design/frontend/Custom/Default

  1. Add a declaration file theme.xml and optionally create etc directory and create a file named view.xml to the theme directory
<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
    <title>Custom Magento Theme</title>
    <parent>Magento/luma</parent>
    <media>
         <preview_image>media/preview.jpg</preview_image>
    </media> 
</theme>
  1. Add a composer.json file (Optional)
{
     "name": "custom/theme-frontend-default",
     "description": "N/A",
     "config": {
         "sort-packages": true
     },
     "require": {
         "php": "~7.2.0||~7.3.0||~7.4.0",
         "magento/framework": "*",
         "magento/theme-frontend-blank": "*"
     },
     "type": "magento2-theme",
     "license": [
         "OSL-3.0",
         "AFL-3.0"
     ],
     "autoload": {
         "files": [
             "registration.php"
         ]
     }
 }
  1. Add registration.php
<?php
use \Magento\Framework\Component\ComponentRegistrar;
    ComponentRegistrar::register(
        ComponentRegistrar::THEME,
        'frontend/Custom/Default',
        __DIR__
    );
  1. Add preview image following path: app/design/frontend/Custom/Default/media/preview.jpg

  2. Create directories for CSS, JavaScript, images, and fonts here: app/design/frontend/Custom/Default/web

  3. Configure your theme in the Admin panel and activate the new theme

    Admin panel > Content > Design > Configuration > Select theme and Edit > Default Theme > Applied Theme > Select "Custom Magento Theme" from the dropdown > Save Configuration

    Screenshot: [https://www.awesomescreenshot.com/image/19172983?key=22fab33dc5226af2ee39586a53effa28][1]

  4. Clear cache.

    Now you can see your Custom Magento Theme is installed and activated.

I hope this is useful.

Thank you :) [1]: https://www.awesomescreenshot.com/image/19172983?key=22fab33dc5226af2ee39586a53effa28

0

You can check out this link for the Magento front-end theme creation process https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/themes/theme-overview.html

Thanks.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.