Set up the demo layouts

The Yuva theme comes with a single default home page and product page layout based on the Amaze demo.

If you want to use the layout of another Yuva demo, you can add the free template code below to your theme code editor.

Add template code to your theme

If you have purchased Yuva, follow the steps below to replace your default homepage or product page with one of the demo layouts. No knowledge of code is mandatory - it's a simple copy & paste.

This template json code will place the sections in the same way as the demo store. The demo images are not included in this.

• Duplicate your theme and open the theme code editor.

• Copy the demo layout code from the below- mentioned links and paste it into Templates > index.json or product.json.

• Copy the demo colors code from the below settings_data.json file and paste in into Config>settings_data.json.

Amaze

View the home page json , product page json and setings_data.json

Woofy

View the home page json , product page json and setings_data.json

Classic

View the home page json , product page json and setings_data.json

Bold

View the home page json , product page json and setings_data.json

Elegant

View the home page json , product page json and settings_data.json

Steps to copy the json templates:

In the Shopify admin:

1. Click Actions > Duplicate on your current theme to create a backup theme version. For safety reasons, it's recommended to create a duplicate of your current theme.

   
2. Click Actions> Edit code in the duplicated theme version.

   
3. In the Templates folder, search and click on the index.json (home page) or product.json (product page) file.

   

1. Select the template code as per the required demo and copy code and paste it in the code editor> files opened in step 3. Note: To copy the code, you can use keyboard shortcuts to Select all (ctrl-a or cmd-a) and copy (ctrl-c or cmd-c). To paste the code, you can use keyboard shortcuts for Select all (ctrl-a or cmd-a) and paste (ctrl-v or cmd-v).

2. Click save.

3. All done! The new layouts for your homepage and product pages are completed in your duplicate theme's editor. Once you've customized this copy as per your requirements, you can just hit "Publish" to make this theme copy live on your website.