Adding custom Javascript code to Broadcast

Keep in mind that Invisible Themes will not be able to assist with themes that have been heavily customized. We can only support the theme as it was originally coded. We recommend hiring a developer to make code changes.

1

Open the Code Editor

From the theme editor (customize theme) click "Theme actions" and then "Edit code" to get to the theme editor.

2

Open the Javascript file

On the left side, from the Assets folder, open theme.js:

Be sure the file you open is theme.js and not theme.liquid or theme.scss.liquid. 

3

Add your code to the very bottom of the file

On the right code area, scroll to the very bottom of the file (it's a very long 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: 

Keyboard shortcuts: Mac use Command-DownArrow to reach the bottom of the file quickly or on Windows use the End key.

Save the file after adding your code snippet:

Note that this javascript file does not execute in the head of the file.  It is loaded with the body content for a raster render speed.  To add scripts to the head, add your code in the assets/head.js file. 

It's very important to add the code to the bottom of the file rather than modifying the original source code. This will help when you update your theme to a newer version and most importantly preserves the original code in case the code you add does not work or you need to remove it in the future. Always add the code on a new line and do not mix with any other 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:


Disclaimer:
Modify the code at your own risk. Invisible Themes will 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.

Still need help? Contact Us Contact Us