How to add javascript files to shopify

New Member
3 0 0

Hi, I am very new to shopify, I want to use javascript to do some manipulations with the elements(say product image) of my website.For that I need to add javascript, i searched around and I think I got some idea how to do it, Please correct me if i am wrong:

- First I have to upload my jquery-1.4.3.min.js to my theme>assets.

2- Call the references in the HEAD section of my theme, Say

{{ 'jquery-1.4.3.min.js' | asset_url | script_tag }}

3- In the BODY section of my Theme include the code to do the manupulations(like change the image of a clicked product), e.g  say


 <div id="navigation">
<input type="hidden" name="demo2" />
<script type="text/javascript">
//some code

So any help would be highly appreciated>i would love to see some demo code or video tutorials for addressing this problem.Also if incase i want to distribute this feature as an widget then what steps do i have to follow.I know this is a very lame question to get things done quickly i would need all the help i can get.


Shopify Staff (Retired)
Shopify Staff (Retired)
130 0 18

Yes steps 1 and 2 are correct! For step 3 I would suggest placing any javascript/jQuery code either in a separate file, i.e scripts.js.liquid, otherwise just before the closing </body>.

New Member
2 0 0

Thank you so much! I added my 

{{ 'nav-bar.js' | asset_url | script_tag }}
right before the closing body tag and it worked!