C O D I T R O N

Technologies

Create Child Theme In Magento 2

By, Sanyogita Salunkhe
1st September 2022

In our previous blog, we learned how to set up a theme in Magento 2. In this blog, we are going to learn to create a child theme.

What is a child theme in Magento?

A child theme is the inheritance of a parent theme with all the properties. It helps to create customization as per your requirements.

Why is it required to create a child theme in Magento 2?

If you want to modify certain aspects of the out-of-the-box theme preserve the original files and ensure all changes are saved after Magento is updated, you need to create a child theme.

Steps to create a child theme:

Step 1:  Create a child theme folder in the below-mentioned folder path-

Magento_root_folder/app/design/frontend/{theme-vendor-name}/{parent-theme-

name}_child

#theme-vendor-name: Coditron (The vendor name should be PascalCase.)

#parent-theme-name_child: luma_child

Magento_root_folder/app/design/frontend/Coditron/luma_child

Step 2: Create a theme.xml file under app/design/frontend/Coditron/luma_child directory and add the following content in theme.xml

Tags used in theme.xml files are:

  • <title>-Title of the child theme that is Luma child
  • <parent>-parent theme name which we are inheriting from that is Magento/luma theme
  • <media>- Theme preview image which is visible in Magento 2 Admin theme configuration section.

Step 3: Create the registration.xml file under app/design/frontend/Coditron/luma_child directory and add the following content in registration.xml

Step 4: Create a composer.json file under app/design/frontend/Coditron/luma_child directory and add the following content in composer.json

Step 5: In the admin panel, go to content->design->themes and check your child theme.

Step 6: Take a backup of pub/static folder for images, CSS, and js. Also, delete the static folder and run the command of static content deploy.

Step 7: Go to the Magento root directory and run the following command:

  • php bin/magento setup:static-content:deploy

Step 8: The newly created child theme will also deploy in the pub/static folder.

Conclusion:

That’s all for creating a Magento 2 child theme! You can now customize the child theme.

Coditron Technologies

Contact Us

Address

Corporate Office : Greens Center, Thergaon Pune 411033

Operation Office: USA: PO Box # 582973 ElkGrove CA 95758