Tips: Updating from Pipeline 1.x
We've put some tips together to help you with updating from the first generation of Pipeline to the latest version which includes many new features like product tabs, product stickers, size chart pop-up and much more. Since Pipeline 1.x is not a "sectioned" theme, the update is much more manual. After you've updated to a sectioned version of Pipeline (as of Pipeline 2), the updates are easier. With the first generation of Pipeline, Shopify stored your logos and homepage images in a local assets folder. When Shopify introduced sectioned themes, they moved these images to a shared or cloud folder. All future updates can reference these shared or cloud assets. Since you're updating from a first generation of Pipeline, you'll need to download your assets folder and then upload images from there to the cloud version. Shopify has made this fairly simple actually. Here are our tips on how to do this:
Before you update preparation -Download your current theme
This can be your first step. It allows you to backup your current theme and gives you access to your local assets folder.
From your " Actions" drop-down, choose "Download theme file"
Choose "Send email"
You'll receive a .ZIP version of your theme which includes your assets. Unzip the attachment that arrives in your email. Your folders should look like this (Mac):
Download the new version of Pipeline
In this step, you'll be downloading the latest version of Pipeline from Shopify. Follow their instructions for this procedure:
The newly added theme will sit in a section below your main live theme. This helps you differentiate your published theme theme from non-published themes. The big one on top with the preview image of your homepage is the live/published theme (your current and older version of Pipeline) and the ones below are non-published themes. Rename the newly added theme, it's grouped with the non-published themes:
You can now start customizing the " Pipeline New" theme while your live website is still running the older version of Pipeline.
How to Customize
The following steps will help bring over your General Settings like fonts, colors, cart and social media accounts:
This procedure is optional. If you choose not to do it, you can set these up again manually. If you've put time and effort into these settings, I would recommend following these steps as it will migrate them over for you.
Step 1 - Copy your settings from your current live theme
The following link will take you to your settings_data.json file in the Code Editor. This file holds your colors, fonts and other general settings. Copy all the code from this file:
https://shopify.com/admin/themes/current?key=config/settings_data.json
(Select all is Command-A on Mac or Control-A in Win and then Copy is Command-C on Mac or Control-C in Win)
Step 2 - Paste your settings to the new theme
Next, paste the settings code to the same file in the new theme:
Open the Code Editor (Edit code) for the " new" theme, Pipeline New:
Important - Be sure you're working out of the new theme and not the one above which is your published/live theme.
Next, in the Code Editor - Type in " data" in the filter search box on the top left side:
You'll see in the " Config" folder, "settings_data.json". Click on that filename to view the code on the right-side.
Now replace all the code in this file from the code in Step 1.
(Select all is Command-A on Mac or Control-A in Win. Then Paste which is Command-V on Mac or Control-V in Win)
Save the file.
If you preview the theme at this point, you'll notice the homepage is blank and missing all your modules. That is fine, we will need to rebuild these which is the next step.
Restoring your logos and homepage images
If you skipped the above step, you'll need to update all your General Settings manually. These next steps will help you recover your logo files and homepage images.
Step 1 - Upload your logos and homepage images
Click on this link to open your Shopify File Manager:
https://shopify.com/admin/settings/files
Choose Upload files on the top right:
Browse to the folder of your unzipped files from the old theme which was sent to you by email:
Choose/open the assets folder:
select your logo file and any of your other homepage images, they will all be here in the assets folder:
(You can select multiple files by holding down the Command key while single-click on the files you want. In Windows it's the Control key held down)
Step 2 - Update your header logo
Return to the main Online Store, themes page:
Choose the Pipeline New theme and Edit Code again:
(again, make sure you're choosing Edit code for the new theme and not the one above which is you live/published theme)
While in your Code Editor, choose "Customize theme" under the title of Pipeline New theme.
You'll now see the new homepage sections settings:
Next, we'll upload your site logo. Choose the " Header" section:
Choose " Select image"
Find your logo and click the Select button at the bottom.
Then Save.
Step 3 - Main Menu Navigation
In this step we'll add your main navigation back to the site.
While still in the Header settings, click on the " Menu" drop-down:
Choose your main menu navigation (usually called Main Menu):
Save your settings.
Step 4 - Add homepage sections
Return back to the Sections settings:
Next, choose the " Add section" option:
You'll now be able to add sections to your homepage from here:
You can use your live theme (older version of Pipeline) as a reference point to see what modules you've used and how they were setup. All the homepage images should be stored in that assets folder. You can return to the File Manager and upload any missing images.
Experiment with the new section modules and settings as there are likely many new features and sections that have been added to Pipeline since 1.x
Settings for your Collections, Product pages, Blogs and Articles, Pages
Only your homepage modules will have to be recreated. All your product pages, collections, blogs, pages will be in your new theme. Each of these page types have new settings and features. To configure them, while in the Theme Editor (Pipeline New theme -> Edit code -> Customize theme) navigate to them and you'll see the left section settings change.
Be sure you're choosing Edit code and then Customize theme on the new theme, Pipeline New:
Here's an example on how to view your Blog listing settings (Blog page) and your Blog post settings (Article):
To update Collection settings, navigate to any collection within the Theme Editor and you'll see:
Sample Collection page settings:
For Product page settings, navigate to any product on your site (still in the Theme Editor) and you'll see:
Example settings for your Product page:
Final Notes
Any code customizations you've done to your old/live them will need to be done manually to the new theme. Some apps will require these customizations so refer back to their installation instructions to integrate with the new theme. Keep using Pipeline New theme -> Edit code -> Customize theme to make modifications and add/remove sections. Once you have the new theme looking good (there is a Preview feature), you can publish it from the themes list in the Actions menu:
