Top view of someone holding an phone next to laptop

RainDrops Blog: Web Design & Dev Insights

How to easily duplicate a section to another template on Shopify 2.0

Author: Ronen Hirsch - qwiqode.com

Do you have a section on one page that you want to display on another page? Of course, you could simply just create the section on the new page and re-enter all of the content and settings again... OR you could do it much quicker!

How to easily duplicate a section to another template on Shopify 2.0

Do you have a section on one page that you want to display on another page? Of course, you could simply just create the section on the new page and re-enter all of the content and settings again...

OR you could do it much quicker! This technique is especially useful for those of you who have purchased sections from qwiqode.com because our sections are PACKED with settings that control every aspect of content, functionality and styling. We hope this helps you!

This article refers to sites built on Shopify 2.0.
If you have a site on Shopify 1.0 (built before Summer 2021), then read our tutorial here

This is for any type of section on any theme but it’s especially useful for duplicating qwiqode’s Shopify sections, since they're so packed with a ton of features and settings!

Watch the video:

It’s recommended to watch the video, but here’s a brief overview. 

1. Identify the section

In the Theme Editor, navigate to the page where you have the section that you want to copy and note the name of it (i.e. "QQ Text Section").

The name of the section

2. Add the section to the new page

While still in the Theme Editor, navigate to the page that you want to duplicate the section over to. 

Over on the left, click on "Add Section" and select the same section you noted in the previous step. 

Click "Save" on the right side.

Add Section button

4. Find the names of the templates

* This step should be done twice - once for the original page and once for the new page where you want the section to be duplicated to.

Go to the page, product, blog post, etc. in the Shopify Admin. On the right side of the page, you'll see the "Theme template" selector. Take note of the name that is selector.

3. Find your template files

Go to "Edit Code" by clicking the icon of the "three dots" located in the top left of the Theme Editor - next to the name of theme. In the list of files on the left, you'll see a folder called "Templates". Search for the files with the name that you noted in the previous step and click on each one (the original and target) to open them in the editor on the right.

The prefix of the template file name should be identified by the type of page, where ‘xxxxx’ is the template name:

  • Content page: page.xxxxx.liquid
  • Product: product.xxxxx.liquid
  • Collection: collection.xxxxx.liquid
  • Blog post: article.xxxxx.liquid

Template files

4. Copy/paste your section settings

In the original file (where your section already exists), search for the "group" of data values by searching for the the name of the section that should appear beside the "type" value (I.e. “QQ-TextBlock-section”).

Minimize the groups called "blocks", "block_order" and "settings" by clicking on the arrow to the left.

Once the three are minimized, highlight and select all three and copy them by hitting Ctrl-C (Windows) or Cmd-C (Mac).

Find the data in the JSON file

Go to the "target" file and search for the group as you did in the original file in the previous step. 

Minimize and highlight the three groups and delete them. Then, immediately paste the ones you copied in the original file.

Click on "Save".

5. The section has been duplicated!

Head back to the Theme Editor and refresh the "target" page. Your duplicated section should appear there now.

That's it! That wasn't so bad, was it? 

 

*** Originally posted on https://qwiqode.com

More to read

Image for 4 Reasons to Rebuild or Redesign Your Shopify Website

4 Reasons to Rebuild or Redesign Your Shopify Website

Are you wondering when the best time to rebuild your online shop is? Well, if you are looking to completely redesign your site, you will want to start sooner rather than later. After all, the last thing you want is to be improving your store when peak retail season hits.

Continue reading
Image for Landing pages: Acquiring new users and increasing sales with one simple page

Landing pages: Acquiring new users and increasing sales with one simple page

Creating effective landing pages is essential for the success of an ad campaign.

Continue reading
Image for Upgrade Shopify to Version 2.0: Benefits, Features, and Migration Tips

Upgrade Shopify to Version 2.0: Benefits, Features, and Migration Tips

There are many reasons to upgrade Shopify to version 2.0. Discover the benefits, features, and migration tips in this guide.

Continue reading

Let's keep in touch

Signup to our mailing list to receive
valuable updates.

* We won't spam you or give your email to anyone.

Signup for Shopify Free Trial Try for Free