Free Shopify Scripts, Shopify Coding, and Dropshipping Tutorials

This site is a collection of guides for highly requested and searched features that you can do with Shopify, but there isn't a lot of documentation on. I love hearing comments and feedback on the current guides, how they can be made better, and what new ideas you would love to see.

I started learning to code while working at Shopify and I have been practicing a ton while working on a number of projects.

I plan to blog about HTML, CSS, JS, and Ruby on Rails. If there are any guides you would like to see, please reach out on the About page.

Happy Coding!

- Dylan Hunt


by: Dylan Hunt | Published: April 20, 2020 13:18

I have had a lot of comments for people looking to have this guide work specifically for the Venture theme, so I am going to try to be as specific as possible and hopefully this can help more people achieve this on their own.

If you have a product such as a swimwuit that has 10 colors, you may want to keep it as one product, but to make your collection page look more 'full', so here is how you can turn that one product into 10 different ones on the collection page, but have the product page stay the same as one product with many variants on the Venture theme.

1. Open the Collection.liquid template and copy the code below to place instead of what is there. There are two spots you will need to modify if you use anything different for the option name. On line 30 and line 36, make sure you use Color as the option name, and you'll be all set. If nothing is showing, change line 37 to index1 instead of index0, but this should not be an issue.

2. Make a new snippet called product-card-variant.liquid and paste the code below into it. This is what will display when you have a product that has multiple color variants.

You should be all set now.

Comment below if you're struggling.

Read More >>


by: Dylan Hunt | Published: February 23, 2020 16:05

I found this really really hard to find online, but was able to find a way to create a dataLayer with the variables I want to use in Google Tag manager for conversion tracking.

Below is the code you would enter in the additional content & scripts of then settings>checkout area of Shopify. This will allow you to create variables in google tag manager, that you can then use in the conversion tracking pixels.

Once you have added this, you will go to variables in Google Tag Manager and add a new variable. For Order value, I created one called OrderValue and then chose Data Layer Variable as the variable type, and entered ecomm__orderValue as the name, and kept the version at Version 2.

Once you add this, you can do the same for the order number, item quantity, and customer email. You can also add any additional lines that you want to the code above and capture more data if your pixel needs it.

Once the variables are created, add a new tag, and choose checkout conversion as the item to track, and then you can find these variables and enter them for the order value and so on.

Let me know if this worked for you or if anything was confusing and needed tweaking.

Read More >>


by: Dylan Hunt | Published: November 28, 2019 22:49

Hey guys, This script will allow you to offer a free gift that will be added to the checkout automatically if the user loads the checkout and their cart is over the minimum threshold. the minimum below is $100, which is written in cents and is 10000. The variantId is where you would enter your variant ID. Put this code directly above the closing tag in the checkout.liquid to have it work and add the item once.


This will ensure that if your cart is over $100 then the free item will be added.

Read More >>


by: Dylan Hunt | Published: October 10, 2019 18:24

I have had a lot of comments for people looking to have this guide work specifically for the Impulse theme, so I am going to try to be as specific as possible and hopefully this can help more people achieve this on their own.

If you have a product such as a swimwuit that has 10 colors, you may want to keep it as one product, but to make your collection page look more 'full', so here is how you can turn that one product into 10 different ones on the collection page, but have the product page stay the same as one product with many variants on the Supply theme.

1. Find the product-grid-item.liquid snippet and open it. This is the loop that is used to display all products in the collection.

2. Replace the product-grid-item with the code below.

You should be all set now.

Comment below if you're struggling.

Read More >>


by: Dylan Hunt | Published: June 06, 2019 14:34

I have had a lot of comments for people looking to have this guide work specifically for the Supply theme, so I am going to try to be as specific as possible and hopefully this can help more people achieve this on their own.

If you have a product such as a swimwuit that has 10 colors, you may want to keep it as one product, but to make your collection page look more 'full', so here is how you can turn that one product into 10 different ones on the collection page, but have the product page stay the same as one product with many variants on the Supply theme.

1. Find the product-grid-item.liquid snippet and open it. This is the loop that is used to display all products in the collection.

2. Replace the product-grid-item with the code below.

You should be all set now.

Comment below if you're struggling.

Read More >>


by: Dylan Hunt | Published: May 06, 2019 12:04

I have had a lot of comments for people looking to have this guide work specifically for the Brooklyn theme, so I am going to try to be as specific as possible and hopefully this can help more people achieve this on their own.

If you have a product such as a swimwuit that has 10 colors, you may want to keep it as one product, but to make your collection page look more 'full', so here is how you can turn that one product into 10 different ones on the collection page, but have the product page stay the same as one product with many variants on the Brooklyn theme.

1. make a new snippet and call it product-grid-item-variant.liquid. This is the loop that is used to display all products in the collection, and we are modifying it to work with our multi variant products.

2. make a new snippet and call it product-grid-collage-variant.liquid. This loop is different than the one above because of the new feature to allow the Brooklyn theme to show a collage or a grid for products.

3. Find the Collection-template.liquid section and modify it by copying this code and pasting it instead.

You should be all set now.

Comment below if you're struggling.

Read More >>


Need help implementing any of these guides?

Contact Me