How to Install a Theme on your Magento | Adobe Commerce Website

A theme is one of the most important part of any eCommerce store. Your website design should be catchy, user-friendly and good-looking enough to make customers choose your store among thousands of others. In this article, you’ll learn how to perform Magento | Adobe Commerce theme installation without a hitch.

Get Started with Git

We recommend using Git for adding, configuring, and testing your theme. Git is a version control system, which is used to store project code. It allows to create “branches”, where you can test new functionality having no risks of losing important data or breaking down the existing functionality of your eCommerce project. For example, Git can help discover compatibility issues after the theme installation and revert your project to the previous version. This way, you can test your theme and find any problems before going live. If you’re new to eCommerce and want learn more about Git, check our article  Why Git Is a Must for eCommerce Projects.

Now, let’s move to Magento | Adobe Commerce theme installation. There are two main methods:

• Manual Installation
• Installation via Composer

Theme Installation via Composer

1. Purchase a theme;
2. Get the theme’s Composer name;
3. Enter your Magento root directory and enter the next command:composer require <vendor>/<name>:<version>For example: composer require adobe/apparel-store-theme : 1.0
4. Wait for dependencies to update;
5. Enter the following commands:git add –A && git commit –m “Add theme”git push origin <branch name>
6. Log in to the Admin;
7. Click Content > Design > Themes 
8. Check if the theme is displayed on the right panel in the list of available themes

Manual Theme Installation

To install a theme manually, you must have the theme’s code, either in a compressed archive or in a directory structure similar to the following:

To install a theme manually:

1. Copy the theme’s code under <Project root dir>/app/design/frontend for a storefront theme or <Project root dir>/app/design/adminhtml for an Admin theme. Verify that the top-level directory is <VendorName>; otherwise, the theme will not install properly.
2. Confirm the theme copied to the correct place.
   • Storefront theme: ls <Project root dir>/app/design/frontend
   • Admin theme: ls <Project root dir>/app/design/adminhtml
3. Add and commit files by command:
   git add –A && git commit –m “Add theme” 
4. Push the files to your branch:
   git push origin <branch name>
5. Wait for deployment to complete.
6. Log in to the Admin.
7. Click Content > Design > Themes 
8. Check if the theme is displayed on the right panel in the list of available themes

 

Need Help with Theme Installation?