As a theme developer, you can customize themes for Shoplazza merchants. These customizations might range from small tweaks to complete redesigns.
In this tutorial, you'll use Shoplazza CLI to customize a merchant's theme and then share your progress with them.
After you've finished this tutorial, you'll have accomplished the following:
- Gained access to the merchant's store
- Set up your local development environment
- Downloaded a copy of the merchant's theme
- Made a change and previewed it
- Shared your changes with the merchant
- Published your changes
- The URL of the store that you want to work on, such as
The requirements to install and run Shoplazza CLI depend on your computer:
To work on a merchant's theme, you should request access to their store. Working on a theme in a merchant's store lets you test it with the merchant's products and other resources.
You can also access themes using other accounts and credentials. Learn more
If you haven't done so already, install Shoplazza CLI. Shoplazza CLI is a command-line tool that helps you to build Shoplazza themes. It lets you preview, test, and share changes to themes while developing locally. Follow the instructions below to install Shoplazza CLI on macOS, Windows, or Linux.
npm install -g shoplazza-cli
If you don't have a theme locally, then you need to download a copy of the theme code to work on it locally.
- Run the following command to retrieve a list of all of the themes in the store.
shoplazza theme pull
- Select a theme from the list. Its contents are downloaded to the current folder or the specified folder.
If you haven't done so already, you're prompted to log in to Shoplazza when you run the
pullcommand. Make sure that you log in using the account that was granted access to the store. If you're already logged in with an account that doesn't have appropriate access, then you can log out using
After you've downloaded the merchant's theme, you can make any necessary changes to the theme code. For example, you can adjust the theme's CSS to change its appearance.
Refer to Next steps to explore additional feature tutorials.
After you make a change to the theme, you can run shoplazza theme serve to interact with the theme in a browser. Shoplazza CLI uploads the theme as a development theme on the store that you're connected to.
The command returns a URL that hot reloads local changes to CSS and sections, allowing you to preview changes in real-time using the store's data. This preview is only available in Google Chrome.
- In a terminal, navigate to your working directory.
- Serve your theme by using the following command:
shoplazza theme serve
- Generate a preview link and a link to the theme editor for the development theme.
To share your changes with the merchant, you need to upload your changes to the theme to the merchant's store. You're prompted to select the theme that you want to update.
shoplazza theme push
After the merchant approves the changes, you can publish the theme to make it live in the merchant's store. If you haven't yet pushed your changes to the store, then you need to do so before you publish the theme.
- Enter the following command:
shoplazza theme publish
- Select the theme that you want to publish from the list.
Yesto confirm that you want to publish the specified theme.
The theme is published and is now the active theme for the store.
Updated 2 months ago