How to add [In Store Only] Button to certain products

Healthfarm
Tourist
3 0 1

Hi there, I'm using DAWN theme and  I have a few products that are only available in-store (Large items etc), but not all of them.

 

I would like to add a badge to those items, like the [SALE] buttons.

 

How can I do this?

Replies 5 (5)

suyash1
Shopify Partner
9077 1129 1479

@Healthfarm -

- you can add custom tag to these products like "store" , you will need to do this manually

- then edit code on product template to check if this tag is present in product, if yes then show badge

 

this will need code editing.

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI

Niraj_singh
Shopify Partner
232 39 47

Hello @Healthfarm 

need to add a tag on products on which you want to show only button.
for example added tag is "available-in-store" than go to product template section and use below code to identify show button or not 

{% assign productTags = product.tags | join:',' %}

{% if productTags contains 'available-in-store' %}
BUTTON CODE GOES HERE
{% endif %}

 



banned

Duggan13901
Visitor
3 0 0

In this tutorial, I will discuss the important aspect of WooCommerce shop page customization that results in a better-customized user experience. As always, I assume that you have a working WooCommerce store with optimized settings (preferably on Cloudways. If not, sign up for your free trial). If you don’t, you can go through the WooCommerce tutorial I have created for your help.

banned

Cedcommerce
Shopify Expert
718 76 112

Hello @Healthfarm,

 

Follow these steps to add a Sale button to specific items.

 

  • To add a custom tag to those products which are available In-Store only. 
  • You can choose any tag like “instore_badge” or anything else of your choice.
  • Add a custom code for adding a badge.
  • Go to your Shopify admin > online store > themes > click on Action of Dawn theme > click on Edit code
  • In the snippet folder, you can find the “card_product.liquid” file that contains code for displaying a badge.
  • To find the code you need to search for the keyword “badge” using ctrl+f
  • Once you find the code you need to put this code for displaying the “In Store” badge.
  • Once it is done you can see the “In Store”  badges on the specific products. 
  • Refer to the below screenshots.



Cedcommerce_0-1656502811215.png

 

image.png



 

 

Cedcommerce_1-1656502811377.png

 

image.png



Hope it is helpful. Lets us know if you have any questions.

 

All the best, 

Team CedCommerce

CedCommerce || Shopify Expert
- Let us know if our reply is helpful for you. Like it.
- Was your question answered? Mark it as an accepted solution.
- For further discussion contact: Email ID- apps@cedcommerce.com
- Whatsapp:- Join Here
Healthfarm
Tourist
3 0 1

Hi there, thank you for your reply but I cannot see the image as it is too small.

 

So I opened "card_product.liquid” file and searched the [badge] and this is what appeared.

 

<div class="card__badge {{ settings.badge_position }}">
{%- if card_product.available == false -%}
<span class="badge badge--bottom-left color-{{ settings.sold_out_badge_color_scheme }}">{{ 'products.product.sold_out' | t }}</span>
{%- elsif card_product.compare_at_price > card_product.price and card_product.available -%}
<span class="badge badge--bottom-left color-{{ settings.sale_badge_color_scheme }}">{{ 'products.product.on_sale' | t }}</span>
{%- endif -%}

 

What code should I put so I can make the [In-store Only] button appear?

 

Thank you