-
Redesign Customers Login Page on Shopify
Today we are taking the standard sign in/sign up page for customers who create an account, and customizing it to have a more modern style and animation! Before: After: Code: https://github.com/ndrishinski/blogs/commit/58b80e1ea9a4e9a36276dcd3ac17e68ba87d7330 Prefer Video? Enjoy, otherwise read on! Edit main-login.liquid In this tutorial I am working from the Dawn starter theme. Under the sections directory, open…
-
Redesign Shopify Collection Product Cards
A collection page is a staple of every e-commerce store. In this guide, we are going to try and spruce things up a bit from the vanilla, default product card that makes up the collection page. I am working from the Dawn theme, but you should be able to apply this code to any theme…
-
Creating a Dropdown Navbar in Shopify with HTML/CSS
Creating a custom navbar in your Shopify theme is easier than you’d think! In this intro I’m going to show you how to create a simple, mobile responsive header for your Shopify theme as a starting point for any custom features you would like to build out. Github Code: https://github.com/ndrishinski/blogs/tree/master/dropdown-navbar Prefer Video? Enjoy, otherwise read…
-
Creating a Pre-Launch Shopify Landing Page
It’s not uncommon to want a landing page setup on a store’s domain before the store is fully flushed out and ready to launch. Maybe you’re waiting on theme development or the product isn’t ready to ship. Whatever the reason may be, today I’ll show you a “hacky” way to show a single landing page…
-
2 Ways to Add Custom Fonts to Shopify Theme
Custom fonts are a great way to add character and customization to your Shopify theme. Adding a custom font is also easier than you think. In this example, we are going to use a Google Font here. Prefer Video? Enjoy otherwise read on! Option 1: Adding Font Using an External CDN Choose a Font: First,…
-
Add a Form to Product Page in Shopify
I have received a request more than once to show a form instead of an add to cart button on a product page. You may wonder why someone would do this! Sometimes merchants have products that they do not keep in inventory locally or require purchases in bulk. Whatever the merchant reason, we can easily…
-
Custom Promo Code Text on Collection Lists
Today we are making it easy to show promo code discounts on all of the collection pages around a theme. We want to make an easy interface in the theme customizer for non-technical merchants to update which products and collections should show the promo code. We also want this announcement text to cross out the…
-
Build a Product Modal Using the Shopify Section Rendering API
Loading the Elevenlabs Text to Speech AudioNative Player… Continuing our exploration of Shopify’s Section Rendering API (see previous blog here), today we are building a simple popup modal that shows product details utilizing this API. This simple example is a starting point for building some great, dynamic content utilizing this technology. Let’s get started. Check…
-
How Dawn Theme Uses Section Rendering API for Cart Refresh
If a Shopify Theme developer ever wonders how to approach an API or feature build out, the Dawn theme is the best place to start. One standout aspect is its adept utilization of the section rendering API to streamline the cart-refreshing process. With a breakdown of this mechanism, we delve into the intricate workings of…