Where to add Javascript code changes in Pipeline

1

Verify which version of Pipeline your shop is running

This is an important step. Depending on which version of Pipeline you'll be adding code to a certain file. Older versions of Pipeline will use a different file for the CSS than newer versions of Pipeline.

Check your version of Pipeline before starting:
Which version of Pipeline am I using?

Once you know which version of Pipeline your shop is running, then continue to Step 2.

2

Open the Code Editor

Choose Edit code from the Theme actions button when using the Theme Editor:

3

Open the correct Javascript file

In Step 1 we checked which version of Pipeline your shop is running. Be sure you know the version as this is key for where to add your code. 

OPTION 1 - Pipeline 4 and higher

If you're theme version is Pipeline 4 or higher, use this option. 

On the right side, click on the  Assets folder. Next, open theme.js:

Proceed to Step 4 after opening theme.js 

OR

OPTION 2 - Earlier versions of Pipeline

If your theme version is Pipeline 3.1 or earlier, this this option

On the right side, click on the  Assets folder. Next, open shop.js.liquid:

4

All versions - Add your code to the very bottom of the file

Add the code snippet to the very bottom of the file on a new line after all other code. Make a couple blank lines before pasting the code snippet. 

Example:

Save the file after adding your code.

Make a duplicate (backup) of your theme first

Pro tip: Always make a duplicate of your theme before performing code changes. 

Example - Live published theme:

OR

For draft unpublished themes, use the actions link for that theme:

Choose duplicate:

Note:
Modify the code at your own risk. Groupthought does not provide any warranty or support for code changes. Please work with a developer or Shopify Expert to ensure proper customization. We strongly recommend that you make duplicate of your theme before adding or changing any code in your theme.