Add text above or below Add to Cart Button

Store Design
, , , , ,
1

Hello,

I’ve been searching on here and speaking with Shopify Experts for the last week, and I can’t seem to figure this out.

I’m not skilled with code in any way, and just recently started learning how to insert simple code onto my page.

I’m using the Workshop 2.0 theme, and would like to add a text box to every product page, either above or below the “Add to Cart” button, preferably in green text, italics, and about 20px size.

I would like my text to say “Ships in 1-2 Business Days!”

If possible, I would like to be able to customize this for individual products, such as ones that have a lead time. If a metafield is required for this that is fine, I just need to know how to create one and edit it.

Any help is appreciated, as I’ve spent a week trying to figure this out on my own with no luck.

2

Hi. You can achieve it by using metafield.

Please follow these steps

  1. Go to Settings => Custom data and add a product metafield definition like that

JustinNg_0-1696000850572.png
JustinNg_0-1696000850572.png1920×970 91.9 KB

  1. Go to Online Store => Themes => Click Edit code on theme you want to customize

  2. Find code snippet of the “Add to cart” button and paste this code below or above it. Don’t forget to click Save

{% if product.metafields.custom.custom_text %}
    

{{ product.metafields.custom.custom_text }}

{% endif %}

JustinNg_1-1696001181951.png
JustinNg_1-1696001181951.png1920×970 166 KB

  1. Go to product you want to display this text, add your text in Metafields box at the bottom of page

JustinNg_2-1696001271724.png
JustinNg_2-1696001271724.png1905×970 86.7 KB

Please let me know if you still need help.

3

Hello there,

Thank you, this has helped me get the ball rolling on this. However, I can’t seem to find exactly where to insert the code. I do not have a “main-product.liquid” Section. I can’t seem to find the “Add to Cart” snippet anywhere.

4

Thanks for posting this JustinNg, the instructions are good and actually do work. The only thing is the text displays below the buy button instead of below the add to cart button. If there is a way to display it below the add to cart button instead, would be curious to know. Thanks!