Making a Product Temporarily Unavailable

LisaWommack
Excursionist
34 2 23

Hello,

I need to be able to mark certain products as "contact me" or "temporarily out of stock" and disable the ability to add them to the cart. I have some paintings in art exhibitions and I'd like to give visitors to the site a chance to put down a deposit in case it doesn't sell in the show without prematurely showing it is sold when I change availability to 0. I'd like to do this without adding another app. Any ideas?

Replies 4 (4)

Liam
Shopify Staff
2731 294 744

Hi LisaWommack,

 

There's a couple ways to replace the buy button on select product pages with a contact link by editing the code of your theme instead of using an app. One approach would be to add a product tag to these certain products and then edit the product theme file to add a condition that will display a specific message in place of the buy button when a product contains that tag. 

 

Where exactly you make this edit depends on the theme that you're using, for example on the Dawn theme, the code that displays the buy button is in the `main-product.liquid` section, and looks something like:

 

{%- when 'buy_buttons' -%}
  {%- render 'buy-buttons' ... -%}

 

You'd want to create a new condition based on the product tag you've added, eg:

 

{%- when 'buy_buttons' -%}
  {% if product.tags contains 'special' %}
    <p>Temporarily unavailable <a href="mailto:liam@shopify.com">email me</a> for details</p>
  {% else %}
    {%- render 'buy-buttons' ... -%}
  {% endif %}

Then a product that has the "special" tag will display the custom message instead of the buy button:

 

Also, you might also want to change the product inventory settings to "Continue selling when out of stock" if you want to set availability to 0 without it being marked as "Sold out" on the product page. 

 

Remember to duplicate your theme and make edits to an unpublished version of your theme to prevent any changes or errors on your live store. 

 

Hope this helps!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

LisaWommack
Excursionist
34 2 23

Thanks so much, Liam. This is super helpful. I'd like to try it before I accept it as a solution. It may be this weekend, but I'll definitely update on the progress. I appreciate you!

LisaWommack
Excursionist
34 2 23

Hi Liam,

I'm just now working on this. I'm using the Studio theme and the only place render buy_button shows up in a search is in Snippets: buy_button.liquid.

{% comment %}
Renders product buy-buttons.
Accepts:
- product: {Object} product object.
- block: {Object} passing the block information.
- product_form_id: {String} product form id.
- section_id: {String} id of section to which this snippet belongs.
- show_pickup_availability:: {Boolean} for the pickup availability. If true the pickup availability is rendered, false - not rendered (optional).

Usage:
{% render 'buy-buttons', block: block, product: product, product_form_id: product_form_id, show_pickup_availability: true %}
{% endcomment %}

 

I tried adding the suggested code and it produced the wavy red lines underneath, so I'm guessing I haven't put it on the right line. I feel like it should go in this area but not sure: 

<div class="product-form__buttons">
{%- liquid
assign check_against_inventory = true
if product.selected_or_first_available_variant.inventory_management != 'shopify' or product.selected_or_first_available_variant.inventory_policy == 'continue'
assign check_against_inventory = false
endif
if product.selected_or_first_available_variant.quantity_rule.min > product.selected_or_first_available_variant.inventory_quantity and check_against_inventory
assign quantity_rule_soldout = true
endif
-%}

Any direction you can provide would be greatly appreciated!

LisaWommack
Excursionist
34 2 23

Hello All. I'm still looking for answers on this if anyone has a suggestion.

 

Thanks -