-
Shopify Section Banner Animations with GSAP
Ever wondered how you can make a custom section eye popping with custom animations? Enter GSAP (GreenSock Animation Platform), a JavaScript library renowned for its simplicity in creating captivating animations. Harnessing GSAP’s power, Shopify merchants can transform mundane banners into dynamic showcases of creativity. In this example, we use it to create a fun and…
-
Highlight Search Terms | Liquid Highlight Filter
Today I wanted to show you one of the easiest additions you can make to your theme to improve the customer experience on your store. When a customer types in to your predictive search bar, you can add a Shopify Liquid filter to your results which will bold the exact text they entered. You can…
-
Announcement Banner: Free Shipping Progress Bar
As a part 2 of the previous blog, I thought we could enhance the customer experience further with a progress bar at the top of the store indicating the proximity to the free shipping threshold. Prefer Video? If you prefer following along on video enjoy below, otherwise read on. Creating a global threshold setting To…
-
Learn Shopify Dev: Free Shipping Cart Notice with Web Components
Offering free shipping can be a game-changer for delighting customers and boosting sales. Showing proximity to free shipping can be an effective tool for incentivizing customers to add an extra item or two. Today, we’re diving into the realm of Shopify’s cart slideout and harnessing web components to seamlessly integrate a dynamic free shipping notice…
-
Deep Dive into Shopify Image Tag | No more blurry images
Welcome to the world of Shopify’s dynamic image rendering courtesy of the image_tag. Visual appeal is paramount, and Shopify’s image tag & filters provides a powerful way to more easily implement and optimize your theme images. In this blog, we’ll dive into the nuances of the Shopify image_tag filter, exploring how to strike the perfect…
-
Adding Christmas Animations with the Canvas HTML Tag in Shopify
In the fast-paced world of online shopping, grabbing the attention of visitors is key to success. Keeping your store visually appealing and up-to-date with seasonal promotions and styles is a powerful way to engage customers. In this tutorial, we’ll guide you through the process of turning a section background into a captivating winter wonderland, complete…
-
Creating a Shopify Collection Custom Section Using Metafields
Creating a unique and informative section for each collection page on your Shopify store can significantly enhance the user experience. In this guide, we’ll walk through the process of building a custom section called ‘custom-collection-info’ that will dynamically showcase essential information at the bottom of every collection page. Before you begin, make sure you have…
-
🌐 Elevate Your Shopify 404 Page: A Quick How-To Guide
Have you ever been frustrated with the dull and uninteresting 404 pages that appear when links go dead or users type in an invalid URL? Today, we’re going to transform that experience by adding a unique and charming 404 page to your Shopify store. More often than not, dead links are an unavoidable reality, and…
-
Shopify Product Page Dropdown by Tags part 2
I previously wrote a blog about my exploration of a task required of a Shopify merchant here. The only shortcoming I had to overcome was the “hard coded” value of the grouping in the liquid file. I found a way to overcome this issue, see the code here: The key here is checking for the…
-
Shopify Product Page Dropdown by Tags part 1
I was recently tasked with adding a dropdown on the PDP of a Shopify store that links to similar products. My first hope was to have the dropdown use the collections product list, but alas, this didn’t satisfy the merchant’s demands. It needed to be more flexible, reliable, and controlled by a non-developer store owner…
