How to add custom CSS or custom JS/Java Script in shopify Theme?

 

Sometimes you need some extra CSS and javascript in your theme. Here in this post, I am going to show you how to add your own CSS or javascript in the Shopify theme.

Step 1: From the Shopify admin panel Click on Online Store ---> Themes

Step 2: Go to the theme editor in which you want to add CSS and javascript then click on Action--->Edit Code

Step 3: In Assets Directory from the left panel, click on Add a new asset. After this, a pop-up will appear, Here you can upload an already created file or you can create a blank file like the below images

Step 4: Now time to call these custom files in the theme. Under Layout directory open theme.liquid file. Before the closing of the head, add these lines of code.

{{ 'custom.scss.css' | asset_url | stylesheet_tag }}

{{ 'custom.js' | asset_url | script_tag }}

Step 5: Click on save.

Try Shopify for free, and explore all the tools and services you need to start, run, and grow your business.