Adding custom CSS 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 Broadcast CSS file

On the left side, from the Assets folder, open 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.

Example after code added:

Save the file after adding your code:

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:

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.