Replacing Shopify’s “Add to Cart” With a Link That Looks Identical / Adding Buttons in Custom Liquid
An essential skill for Shopify users. Sometimes your theme doesn't provide a button in certain sections. That's when you can create your own button using the custom liquid field.
You don't want to re-invent the wheel, though, writing the CSS from scratch. Instead, we can piggyback off the existing theme button styles, by using the same CSS classes.
That way, your custom button looks exactly the same as other buttons in your theme, and it stays in sync even when you change the button styles via settings.
In this video, I show you how to find the CSS classes your theme is using, and re-use them in your button using the custom liquid block.
The example I show is replacing "add to cart" with a "contact us" button or "get a quote" button. This is a very common task in Shopify.
👉 RELATED VIDEOS
Shopify Coding 101: https://youtu.be/5z2D7dLmhfk
📢 STAY UPDATED
Subscribe for more tips & tricks that I don't publish on Youtube:
https://ed.codes/newsletter
🙏 SUPPORT THE CHANNEL
Become a member - https://www.youtube.com/@EdCodes/join
🛠 CODE SHOP
Pre-built sections & blocks. Easy copy & paste to install.
https://ed.codes/shop
👍 MY FAVOURITE APPS & THEMES
All listed on my website - https://ed.codes/resources
📚 MY SHOPIFY CODING EBOOK
Learn HTML, CSS and Shopify Liquid from the beginning and specifically for Shopify.
https://ed.codes/shopify-coding-handbook
👨🏼💻 WHO AM I?
👋 My name is Eduard. I'm a web developer specializing in Shopify.
I want to help you with the tech side of your online business with simple and straight-to-the-point videos.
Visit my website: https://ed.codes
⏭ CHAPTERS
00:00 Intro
00:31 Create a new template
01:05 Remove stuff
01:20 Create a simple link
02:07 Inspecting your theme's buttons
03:21 Re-using your theme's CSS
06:09 Summary
#Shopify #ShopifyLiquid #DawnTheme
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
Related AI Lessons
⚡
⚡
⚡
⚡
The AI Wake-Up Call: Why Millions of Workers Are Being Replaced — And How You Can Stay Ahead
Medium · AI
The 2026 Skills Gap is Here: How to Future-Proof Your Career (Without Spending a Fortune)
Medium · AI
The Next Decade of AI: What the World Will Actually Look Like by 2036
Medium · AI
Structure, Not Prophecy
Medium · AI
Chapters (7)
Intro
0:31
Create a new template
1:05
Remove stuff
1:20
Create a simple link
2:07
Inspecting your theme's buttons
3:21
Re-using your theme's CSS
6:09
Summary
🎓
Tutor Explanation
DeepCamp AI