Yuva Knowledge base
  • Sections
    • 💡How to set up the swatches
    • ✨Recommended image sizes
    • ✨How to show social media icons in the footer
    • ✨How to hide the product description from the product page
    • ✨How to display sticky add to cart bar on the product page
    • ✨How to show different content on different pages/collections
    • ✨How to show size guide on PDP
    • ✨How to add custom badges
    • ✨How to setup the product variations
    • ✨Upgrade a theme
    • ✨Microdata schema
  • How to setup the presets
    • Set up the demo layouts
  • Amaze home page json
  • Amaze product page json
  • Amaze settings data json
  • Woofy home page json
  • Woofy product page json
  • Woofy settings data json
  • Classic home page json
  • Classic product page json
  • Classic settings data json
  • Bold home page json
  • Bold product page json
  • Bold settings data json
  • Elegant home page json
  • Elegant product page json
  • Elegant settings data json
Powered by GitBook
On this page
  • Add template code to your theme
  • Steps to copy the json templates:
  1. How to setup the presets

Set up the demo layouts

PreviousHow to setup the presetsNextAmaze home page json

Last updated 25 days ago

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.

View the , and

View the , and

View the , and

View the , and

View the , and

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. Click save.

  2. 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.

Select the 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).

template code
home page json
product page json
setings_data.json
home page json
product page json
setings_data.json
home page json
product page json
setings_data.json
home page json
product page json
setings_data.json
home page json
product page json
settings_data.json