"product only available in-store" option

New Member
2 0 0

Hey, 

 

I'm trying to figure out if it's possible to display items online without the option to buy. Some products are not allowed to be sold online, but I still want to display them with the description "only available in-store".

 

There are tutorials out there on how to do it, but it seems with my theme I can't seem to figure it out. Example: https://www.youtube.com/watch?v=tK7HWM5UPKo&t=37s

 

I am attaching my product page code, perhaps someone is willing to take a look at it? 

 

                    {% endif %}
                
                    {% if section.settings.display_availability %}
                    <div class="product-inventory">
                        {% if section.settings.text_availability != blank %}
                        {% if settings.enable_multilang %}
                        <label class="lang1">
                            {{ section.settings.text_availability | split: '|' | first }}
                        </label>
                        <label class="lang2">
                            {{ section.settings.text_availability | split: '|' | last }}
                        </label>
                        {% else %}
                        <label>
                            {{ section.settings.text_availability | split: '|' | first }}
                        </label>
                        {% endif %}
                        {% endif %}
                        <span>
                        {% if current_variant.inventory_management %}
                        {% assign first_inventory = current_variant.inventory_quantity %}
                        {% if first_inventory > 0 %}
                        {{ 'products.product.in_stock' | t }}
                        {% else %}
                        {{ 'products.product.out_of_stock' | t }}
                        {% endif %}
                        {% else %}
                        {{ 'products.product.many_in_stock' | t }}
                        {% endif %}
                        </span>
                    </div>
                    {% endif %}    

                    {% if section.settings.display_product_type %}
                    <div class="product-type">
                        {% if section.settings.text_product_type != blank %}
                        {% if settings.enable_multilang %}
                        <label class="lang1">
                            {{ section.settings.text_product_type | split: '|' | first }}
                        </label>
                        <label class="lang2">
                            {{ section.settings.text_product_type | split: '|' | last }}
                        </label>
                        {% else %}
                        <label>
                            {{ section.settings.text_product_type | split: '|' | first }}
                        </label>              
                        {% endif %}
                        {% endif %}
                        <span>{{ product.type }}</span>
                    </div>
                    {% endif %}
                  {% comment %}
                    {% if section.settings.display_product_color %}
                    <div class="product-barcode">
                      {% if section.settings.text_product_color != blank %}
                      {% if settings.enable_multilang %}
                      <label class="lang1">
                        {{ section.settings.text_product_color | split: '|' | first }}
                      </label>
                      <label class="lang2">
                        {{ section.settings.text_product_color | split: '|' | last }}
                      </label>
                      {% else %}
                      <label>
                        {{ section.settings.text_product_color | split: '|' | first }}
                      </label>              
                      {% endif %}
                      {% endif %}
                      <span>{{ current_variant.barcode }}</span>
                    </div>
                    {% endif %}
                  {% endcomment %}
                </div>
                {% endif %}
                
                {% if product.description contains '[countdown]' %}            
                {% assign count_down_first = product.description | split:'[/countdown]' | first %}
                {% assign count_down_final = count_down_first | split:'[countdown]' | last %}
                
                {% if section.settings.countdown == 'countdown_1' %}
                <div class="countdown">
                    {% include 'multilang' with section.settings.text_countdown %}
                    <div class="countdown-item" data-countdown-normal data-countdown-value="{{ count_down_final }}"></div>
                </div>
                
                {% else %}
                {% include 'countdown-progressbar' %}
                {% endif %}
                
                {% endif %}
                
                <div class="prices">
                    {% if product.compare_at_price > product.price %}
                    <span class="compare-price">
                        {{ product.compare_at_price_max | money }}
                    </span>
                    <span class="price on-sale" itemprop="price">
                        {{ product.price | money }}
                    </span>
                    {% else %}
                    <span class="price" itemprop="price">
                        {{ product.price | money }}
                    </span>
                    {% endif %}
                </div>
                
                {% if product.description contains '[countdown]' %}
                {% assign des = product.description | split:'[/countdown]' | last %}
                {% if des contains '[custom tab]'%}
                {% assign des = des | split:'[custom tab]' | first | split:'<iframe' | first %}
                {% endif %}
                {% else %}
                {% assign des = product.description %}
                {% if des contains '[custom tab]'%}
                {% assign des = des | split:'[custom tab]' | first | split:'<iframe' | first %}
                {% endif %}
                {% endif %}
                
                {% if section.settings.show_desc == 'short' %}

                {% if product.metafields.c_f['Short Description'] %}
                {% assign des = product.metafields.c_f['Short Description'] %}
                {% endif %}

                {% if settings.enable_multilang and des contains '[lang2]' %}
                <div class="short-description">
                    <div class="lang1">
                        {{ des | split: '[lang2]' | first | strip_html | replace: '&nbsp;', ' ' | truncate: 120 }}
                    </div>
                    <div class="lang2">
                        {{ des | split: '[lang2]' | last | strip_html | replace: '&nbsp;', ' ' | truncate: 120 }}
                    </div>
                </div>
                {% else %}
                <div class="short-description">
                    {{ des | split: '[lang2]' | first | strip_html | replace: '&nbsp;', ' ' | truncate: 120 }}
                </div>
                {% endif %}

                {% elsif section.settings.show_desc == 'full' %}
                {% if settings.enable_multilang and des contains '[lang2]' %}
                <div class="short-description">
                    <div class="lang1">
                        {{ des | split: '[lang2]' | first }}
                    </div>                
                    <div class="lang2">
                        {{ des | split: '[lang2]' | last }}
                    </div>
                </div>
                {% else %}
                <div class="short-description">
                    {{ des | split: '[lang2]' | first }}
                </div>                
                {% endif %}
                {% endif %}        
                
                {% form 'product', product, id: "add-to-cart-form", novalidate: 'novalidate' %}
                    
                {% if product.available %} 
                <div id="product-variants">
                    {% if variantCount > 1 %} 
                    <select id="product-selectors" name="id" style="display: none;">
                        {% for variant in product.variants %}
                        {% if variant.available %}
                        <option data-imge="{% if variant.image.size != blank %}{{ variant.image.src | product_img_url: 'compact' }}{% else  %}{{ product.featured_image.src | product_img_url: 'compact' }}{% endif %}" {% if variant == current_variant %} selected="selected" {% endif %} value="{{ variant.id }}">
                            {{ variant.title }}
                        </option>
                        {% else %}
                        <option disabled="disabled">{{ variant.title }} - {{ 'products.product.sold_out' | t }}</option>
                        {% endif %}
                        {% endfor %}
                    </select>
                    
                    {% if settings.use_color_swatch %}
                    {% for option in product.options %}
                    {% include 'swatch' with option %}
                    {% endfor %}
                    {% endif %}
                    
                    {% else %}
                    <input type="hidden" name="id" value="{{ product.variants[0].id }}" />
                    {% endif %}
                </div>
                {% endif %}
                
                {% if current_variant.available %}
                <div class="quantity">
                    <label for="quantity" {% if settings.enable_multilang %}data-translate="cart.label.quantity"{%endif%}>
                        {{ 'cart.label.quantity' | t }}: 
                    </label>
                    <div class="qty-group">
                        <a href="#" data-minus-qtt class="minus button"></a>
                        <input type="text" data-qtt-id="quantity__{{ product.id }}" name="quantity" value="1">
                        <a href="#" data-plus-qtt class="plus button"></a>
                    </div>
                </div>
                {% endif %}
                
                {% if section.settings.display_subtotal and current_variant.available %} 
                <div class="total-price">
                    <label {% if settings.enable_multilang %}data-translate="cart.general.subtotal"{%endif%}>
                        {{ 'cart.general.subtotal' | t }}:
                    </label>
                    <span class="total-money">
                        {{ current_variant.price | money }}
                    </span>
                </div>
                {% endif %}
                
                <div class="groups-btn">
                    {% if current_variant.available %}
                    <input data-btn-addToCart type="submit" name="add" class="btn" {% if settings.enable_multilang %}data-translate="products.product.add_to_cart"{%endif%} id="product-add-to-cart" value="{{ 'products.product.add_to_cart' | t }}">          
                    {% else %} 
                    <input type="submit" name="add" class="btn" {% if settings.enable_multilang %}data-translate="products.product.unavailable"{%endif%} id="product-add-to-cart" disabled value="{{ 'products.product.unavailable' | t }}">          
                    {% endif %}

 

0 Likes
Shopify Staff
Shopify Staff
208 17 28

Hello, @xlyzero!

 

My name is Tira, and I work at Shopify.

 

That is a very interesting question and concept! 

 

I appreciate that you did some research to try removing the button on the product page, to prevent customers from making a purchase. That YouTube video does look a bit outdated, as it is showing an older admin version. No worry though, we do have a tutorial on how to replace the add to cart button that you can follow.

 

If you're using a Shopify-theme, you can take a look at this help doc: Replace "Add to Cart" button. If you scroll down to the "Hide the add to cart button" section of the document, you'll see the instructions to hide the code for the Add to Cart button. 

 

In your product's description, you can then put your messaging, "Only available in-store" to inform customers that they can't purchase it online.

 

Let me know if that helps! 

Tira | Social Care @ 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 the Shopify Help Center or the Shopify Blog

0 Likes
New Member
2 0 0

Hey @Tira,

 

Thanks for sharing the guide with me. 

 

I followed the guide exactly but when I am trying to save the new template; I get an "unknown syntax 'schema'" error. 

The tags {% schema %} & {% endschema %} seem to be invalid, however, they were originally already in the code. 

 

Any way to troubleshoot this? 

0 Likes
Shopify Staff
Shopify Staff
208 17 28

You're welcome, @xlyzero!

 

Were you trying to save a new template to replace the "Add to Cart" button with a link? I'm not exactly sure why this error would occur. What theme are you using?

 

If you're using a third-party theme, you can reach out to the theme developer directly to ask for assistance on how to hide the "Add to Cart" button, as the guide above may not be 100% accurate for themes that aren't made from Shopify. If it is a Shopify theme, please let me know and I would be happy to take a further look into your store with our design team to help. For Shopify themes, you can view our design policy here.

 

Let me know if that makes sense!

 

Tira | Social Care @ 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 the Shopify Help Center or the Shopify Blog

0 Likes
New Member
1 0 0

Hi Tira,

 

Trying to accomplish the same thing here - however, when I get to the step in the "Replace Add to Cart Button" doc that tells me to click on "product-template.liquid" in the Sections directory, I don't see "product-template.liquid" anywhere in the list.  Do you know why that is/how we can work around that? I am using the Shopify "Story" theme.

0 Likes
Shopify Staff
Shopify Staff
208 17 28

Hi, @amena.

 

It looks like the Story theme is one of the paid themes from our Theme Store. Since it is a theme developed by a third-party developer, Groupthought, I recommend reaching out to them directly to ask for assistance with replacing your Add to Cart button on your theme. As they developed the theme, they will have more insight and knowledge and will be able to provide you with guidance and resources on how to implement this feature into your theme. The help doc is typically used for our free themes which are made by Shopify. Paid themes may come without the same sections as our free themes.

 

You can contact them on their contact page here: Groupthought Contact Page.

 

Let me know if that helps!

Tira | Social Care @ 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 the Shopify Help Center or the Shopify Blog

1 Like