Or go to our Shopify Theme Detector directly
How To Add jQuery To Shopify
Last modified: April 15, 2023
jQuery is a helpful tool when it comes to running websites. It allows you to add more functionality to your website by writing less in the coding, therefore allowing your site to load faster. There are plenty of arguments online about the advantages and disadvantages of the use of jQuery in website development. Many developers use jQuery because it makes life easier.
If you need to add jQuery to your Shopify store, then you should follow these steps.
| # | Name | Image | |
|---|---|---|---|
|
Get a Free Custom Shopify Store | ||
| 1 |
|
Widgetic (Audio Players)
|
|
| 2 |
|
Widgetic (Accordion Gallery)
|
|
| 3 |
|
Owids: 10+ widgets
|
|
| 4 |
|
FAQ Page & Help Center Widgets
|
|
| 5 |
|
Tolstoy Video Marketing Widget
|
|
| 6 |
|
Shipping Rates Widget
|
|
| 7 |
|
Storista ‑ Instagram widget
|
|
| 8 |
|
Widgetic (Before and After)
|
|
| 9 |
|
Rating‑Widget: 5‑Star Reviews
|
|
| 10 |
|
Shopy Widgets
|
|
|
Show More
|
|||
Step 1 – Login
Using your Shopify credentials, log into your Shopify dashboard.
Step 2 – Online Store
Click on the ‘Online Store’ options and then click on the ‘Themes’ option. From there you want to find the theme you want to edit and click on the ‘…’ button and then find the option for ‘Edit HTML/CSS’ and click that.
Step 3 – Add Link To jQuery
Find the file that reads theme.liquid within the ‘Layouts’ option. Click to open this file within the online code editor. Then scroll through the file until you get to the tag. Before this, add the following code:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
Step 4 – Save
Once you’ve done this you can save the file and exit Shopify. jQuery has now been added to your theme files.
Final Word
If you’re looking to develop your Shopify skills, read our blog. Lots of great themes, apps and advice for you.
PageFly Landing Page Builder 
Shopify 
SEMrush 
Website Maintenance 
UpPromote