Install a theme

This topic discusses how to install a theme either by extracting its code to the Magento file system or using Composer.

Get started

To get started:
  1. Log in to your local development system, or switch to, the Magento file system owner.
  2. Change to a directory to which the Magento file system owner has write access.
  3. Enter the following command in a terminal to log in to your project:

    magento-cloud login
    
  4. List your projects. With the project ID, you can complete additional commands.

    magento-cloud project:list
    
  5. If necessary, clone the project to your local. You should have cloned when setting up your local development workspace.

    magento-cloud project:get <project ID>
    
  6. Change to a project directory. For example, cd /var/www/html/magento2
  7. List environments in the project. Every environment includes an active Git branch of your code, database, environment variables, configurations, and services.

    magento-cloud environment:list
    

    magento-cloud environment:list displays environment hierarchies whereas git branch displays does not. If you have any nested environments, use magento-cloud environment:list to see the full list.

  8. Fetch origin branches to get the latest code:

    git fetch origin
    
  9. Check out, or switch to, a specific branch and environment. Git commands only checkout the Git branch. The Magento Cloud command also switches to the active environment.

    magento-cloud environment:checkout <environment ID>
    

    To create a new environment, use magento-cloud environment:branch <environment name> <parent environment ID>

  10. Pull any updated code to your local for the environment ID (which is the Git branch):

    git pull origin <environment ID>
    
  11. Create a snapshot of the environment as a backup:

    magento-cloud snapshot:create -e <environment ID>
    

Install a theme manually

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:

<VendorName>
  ├── composer.json
      ├── etc
      │   └── view.xml
      ├── media
      ├── registration.php
      ├── theme.xml
      └── web
          ├── css
          │   └── source
          ├── fonts
          ├── images
          └── js
To install a theme manually:
  1. Copy the theme’s code under <Magento root dir>/app/design/frontend for a storefront theme or <Magento root dir>/app/design/adminhtml for an Admin theme.

    Make sure the top-level directory is <VendorName>; otherwise, the theme won’t install properly.

    For example

    cp -r ExampleTheme <Magento root dir>/app/design/frontend
    
  2. Confirm the theme copied to the correct place.

    • Storefront theme: ls <Magento root dir>/app/design/frontend
    • Admin theme: ls <Magento root dir>/app/design/adminhtml

    A sample follows:

    ExampleTheme Magento
    
  3. Add and commit files:

    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 Magento Admin.
  7. Click Content > Design > Themes.

    The theme displays in the right pane.

Install a theme using Composer

Installing a theme using Composer is the same as installing any other extension using Composer. See Install extensions for details.

To summarize the procedure:
  1. Purchase the theme from Magento Marketplace.
  2. Get the theme’s Composer name.
  3. Change to your Magento root directory and enter the command:

    composer require <vendor>/<name>:<version>
    

    For example,

    composer require zero1/theme-fashionista-theme:1.0.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 Magento Admin.
  7. Click Content > Design > Themes.

    The theme displays in the right pane.