Solved

Remove price, add to cart, from product page. What is the best way?

ryaneddylutz
Tourist
6 1 2

Hello

Im uncertain as to the best way to remove or comment out all pricing, add to cart, etc, on my shopify store.  Xzib.com

Its an art gallery, so I do not want to show pricing.  

 

Here is the prodcut-template.liquid:

{%- if collection -%}
{% capture product_url %}{{ product.url }}{% endcapture %}
{%- else -%}
{% capture product_url %}{{ '/collections' }}{% endcapture %}
{%- endif -%}
 
<div itemscope itemtype="http://schema.org/Product" data-section-type="product-template">
  <div style="display:none;">
    <meta itemprop="name" content="{{product.title}}" />
    <meta itemprop="description" content="{{ product.description | strip_html | remove: '||' | truncatewords: 20, '' | escape }}" />
    <link itemprop="image" href="{{ product | img_url }}" />
    <div itemprop="brand" itemtype="http://schema.org/Brand" itemscope>
      <meta itemprop="name" content="{{ product.vendor }}" />
    </div>
    <div itemprop="aggregateRating" itemtype="http://schema.org/AggregateRating" itemscope>
      <meta itemprop="reviewCount" content="5" />
      <meta itemprop="ratingValue" content="5" />
    </div>
  </div>
 
 
<style>
 
/* Create two equal columns that floats next to each other */
.custom-page-column-full {
  float: left;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
}
  
  .vendor-name{
  font-size: 36px;
    margin-bottom: 10px !important;
  }
 
.custom-page-column-goback {
  float: left;
  width: 25%;
  padding: 10px;
  box-sizing: border-box;
  position: -webkit-sticky;
  position: sticky;
  top: 20%;
}
  
.custom-page-column-goback-mobile{
  float: left;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  display: none;
}
  
.custom-page-column-product-image {
  float: left;
  width: 75%;
  padding: 10px;
  box-sizing: border-box;
  text-align:center;
}
  
.custom-page-column-description {
  float: left;
  width: 55%;
  padding: 10px;
  box-sizing: border-box;
}
  
.custom-page-column-vendorimage {
  float: left;
  width: 10%;
  padding: 10px;
  box-sizing: border-box;
}
 
/* Clear floats after the columns */
.custom-pagerow:after {
  content: "";
  display: table;
  clear: both;
}
 
.custom-product-title{
  font-size: 18px;
  font-family: "Gabrielle bad";
  color: black;
  margin-bottom: 5%;
}
  
/* .vendor-product-page{
margin-bottom: 5%;
} */
  
.vendor-product-page a{
font-size: 22px;
    line-height: 1.2em;
    font-family: "Gabrielle bad";
  color: black;
}
 
.museum-placecard{
border: 2px solid white; 
  border-radius: 3px; 
  padding: 20px; 
  box-shadow: 6px 3px 10px 0px rgba(255,255,255,0.3); 
  background-color: #f4f6f8; 
  width: 75%; 
  float: right;
  padding-bottom: 20%;
}
  
.museum-placecard-mobile{
  border-radius: 3px; 
  padding: 10px; 
  box-shadow: 6px 3px 10px 0px rgba(255,255,255,0.3); 
  background-color: #f4f6f8; 
  margin-top: 4%;
    display: none;
  text-align: left;
}
 
.mobile-thumbnails{
display: none;
}
  
.museum-placecard-mobile p{
line-height: 18px;
}
 
.museum-placecard p{
margin: 0px;
  line-height: 18px;
}
  
.discp-image-wrapped{
display: none;
}
  
.goBack-heading{
text-align:center; 
  color: white; 
  margin-bottom: 70%;
}
  
  .custom-page-column-product-image-mobile{
  display: none;
  }
  
  @media only screen and (max-width: 600px) {
 
    .custom-page-column-goback{
    display: none;
    }
    
    .custom-page-column-product-image{
    width: 100%;
      padding-top: 0px;
    }
    
    .custom-page-column-goback-mobile .go-back img{
    width: 7%;
    }
    
    .custom-page-column-goback-mobile{
    display: unset;
/*       padding-bottom: 3%; */
      position: sticky;
        top: 0%;
        z-index: 999999;
        background-color: #000;
      padding-bottom: 0px;
      padding-top: 5px
    }
    
    .custom-page-column-goback-mobile h1{
    margin-bottom: 5px;
    }
    
    .custom-page-column-description{
    width: 100%;
    }
    
    .custom-page-column-description iframe{
    width: 100%;
    }
    
    #custom-space-div{
    display: none;
    }
    
    .custom-page-column-vendorimage{
    display: none;
    }
    
    .discp-image-wrapped{
    float: left;
        margin-right: 15px;
        display: unset;
    }
    
    .museum-placecard-mobile{
    display: block;
    }
    
    .mobile-thumbnails{
      display: block !important;
    }
    
    .custom-page-column-product-image{
    display: none;
      float: none;
    }
    
    .custom-page-column-product-image-mobile{
    display: block;
    }
 
  }
  
  @media only screen and (max-width: 700px) and (orientation : landscape) {
    
    #custom-space-div{
    display: none;
    }
    
    .custom-page-column-vendorimage{
    display: none;
    }
    
    .discp-image-wrapped{
    float: left;
        margin-right: 15px;
        display: unset;
    }
    
    .custom-page-column-description{
    width: 100%;
    }
    
    .custom-page-column-description iframe{
    width: 100%;
    }
    
    .custom-page-column-goback .goBack-heading{
    margin-bottom: 10%;
    }
    
    .museum-placecard .vendor-product-page a{
    font-size: 18px;
    }
    
    .custom-product-title{
    font-size: 12px;
    }
    
    .museum-placecard{
    font-size: 60%;
      line-height: 1.5em;
    }
  
  }
  
</style>
 
<div class="custom-pagerow" style="background-color: black;">
   
  <div class="custom-page-column-full product_gallery">
    
    {% comment %}
    <div class="custom-page-column-goback-mobile" >
      
      <div style="text-align:center; color: white;"> 
        <a href="{{product_url}}" class="go-back" style="display: flex; align-content: center;">
            
          <img src="{{ 'colback-arrows.png' | asset_img_url: '40x' }}" style="filter: invert(1); float: left; margin-right: 2%; margin-top: auto; margin-bottom: auto; height: 25px;"> 
          <p style="font-size: 16px; line-height: 1.3em; margin-bottom: 0px; text-align: left; color: white;">go back to {{collection.title}} collection </p>
          
    </a>
      </div>
      
    </div>
    
    {% endcomment %}
    
    <div class="custom-page-column-product-image mobile-thumbnails">
      {% if product.images.size > 1 %}
      <div class="thumbnails">
        {% for image in product.images %}
 
        <a {% if image.src== featured_image.src %} class="active" {% endif %} title="{{ image.alt | escape }}"
           href="{{ image | product_img_url: 'master' }}"
           data-full-size-url="{{ image | product_img_url: 'master' }}" style="width:18%; display: inline-block;">
          {% include 'thumbnail-images', image: image %}
        </a>
 
        {% endfor %}
      </div>
      {% endif %}
    </div>
    
    <div class="custom-page-column-goback" >
      {% comment %}
      <h2 class="goBack-heading"> 
        <a href="{{product_url}}" class="go-back">
            
          <img src="{{ 'colback-arrows.png' | asset_img_url: '40x' }}" style="filter: invert(1); float: left; margin-right: 2%; margin-top: 3%;"> <p style="font-size: 20px; line-height: 1.3em; font-size: 20px; margin-bottom: 0px; text-align: left; ">go back to {{collection.title}} collection </p>
                    
          <div>
 
          </div>
          
    </a>
      </h2>
      {% endcomment %}
      <div>
      {% if product.images.size > 1 %}
      <div class="thumbnails" style="width: 85%; float: right;">
        {% for image in product.images %}
 
        <a {% if image.src== featured_image.src %} class="active" {% endif %} title="{{ image.alt | escape }}"
           href="{{ image | product_img_url: 'master' }}"
           data-full-size-url="{{ image | product_img_url: 'master' }}" style="width:25%; display: inline-block;">
          {% include 'thumbnail-images', image: image %}
        </a>
 
        {% endfor %}
      </div>
      {% endif %}
      </div>
      
      <div class="museum-placecard">
        
        <div class="vendor-product-page"><p class="vendor-name"><a href="/pages/{{ product.vendor | handle  }}">{{ product.vendor }}</a></p></div> 
 
        <h1 class="custom-product-title">{{ product.title }}</h1>
        
        {% assign short_description = product.description | split: '||' %}
        
        {{ short_description[1] }}
      
      </div>
      
    </div>
    
    <div class="custom-page-column-product-image">
      
      <div style="width:100%; margin: 0 auto;">
 
          {% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}
<div class="product-main-image">
          <a href="#">
          {% include 'responsive-image', image: featured_image %}
          </a>
        </div>
      </div>
      
      <div class="museum-placecard-mobile">
 
        <div class="vendor-product-page"><p class="vendor-name"><a href="/pages/{{ product.vendor | handle  }}">{{ product.vendor }}</a></p></div> 
 
        <h1 class="custom-product-title">{{ product.title }}</h1>
 
        {% assign short_description = product.description | split: '||' %}
 
        {{ short_description[1] }}
 
      </div>
 
    </div>
    
    <div class="custom-page-column-product-image-mobile">
 
      <div style="width:100%; margin: 0 auto;">
 
        {% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}
        <div class="product-main-image">
          <a href="#">
            {% include 'responsive-image-mobile', image: featured_image %}
          </a>
        </div>
      </div>
 
      <div class="museum-placecard-mobile">
 
        <div class="vendor-product-page"><p class="vendor-name"><a href="/pages/{{ product.vendor | handle  }}">{{ product.vendor }}</a></p></div> 
 
        <h1 class="custom-product-title">{{ product.title }}</h1>
 
        {% assign short_description = product.description | split: '||' %}
 
        {{ short_description[1] }}
 
      </div>
 
    </div>
 
  </div>
  
</div>
{% assign variant = product.selected_or_first_available_variant %}
<div class="custom-pagerow" style="background-color: black;">
 
  <div class="custom-page-column-full">
      
      <div id="custom-space-div" style="float: left; width: 25%; padding: 10px; box-sizing: border-box;"></div>
      
      <div class="custom-page-column-vendorimage">
        {% assign product_vendor_handle = product.vendor | handle %}
        {% assign vendor_image = product_vendor_handle | append:'.png' %}
      <div><a href="/pages/{{ product.vendor | handle  }}"><img src="{{ vendor_image | file_url }}" style="width: 145px; float: right;"/></a></div>
      </div>
      
      <div class="custom-page-column-description">
        
      <div style="color: white;">
          <a href="/pages/{{ product.vendor | handle  }}"><img src="{{ vendor_image | file_url }}" style="width: 145px;" class="discp-image-wrapped"/></a>
            {{ product.description | remove:'||'}}
        </div>
        
        <div class="product-detail">
          <div class="product-form section">
            {% if product.available %}
            {% form 'product', product, class: 'form', data-product-id: product.id, data-enable-history-state: 'true' %}
            <div class="input-row">
              {% if product.variants.size > 1 %}
 
              <div class="option-selectors">
                {% for option in product.options_with_values %}
                <div class="selector-wrapper cf">
                  <label {% if option.name == 'default' %}class="hidden"{% endif %} for="option-{{ option.name | handle }}" style="inline-block;">
                    {{ option.name }}
                  </label>
 
                  <span class="styled-select" {% if settings.prod_variant_style == 'blocks' %}data-make-box{% endif %}>
                    <select id="option-{{ option.name | handle }}">
                      {% for value in option.values %}
                      <option value="{{ value | escape }}" {% if option.selected_value == value %}selected{% endif %}>
                        {{ value }} <span class="mobile-dropdown-price"> | {{product.variants[forloop.index0].price | money}} </span> 
                      </option>
                      {% endfor %}
                    </select>
                  </span>
                  <span class="h4-style price-area" style="color: white; padding-left: 5%;">
                    {% if variant.compare_at_price > variant.price %}
                    <span class="was-price theme-money">{{ variant.compare_at_price | money }}</span>
                    {% endif %}
                    <span class="price theme-money">{{ variant.price | money }}</span>
                  </span>
                </div>
 
                {% if settings.show_size_chart and option.name == settings.size_chart_variant %}
                <div class="size-chart-container">
                  <a href="{{ pages[settings.size_chart_page].url }}" target="_blank" class="size-chart-link">
                    {{ 'products.product.size_chart' | t }}
                  </a>
                  <div class="size-chart-content hidden">
                    <div class="size-chart">
                      <div class="size-chart__inner user-content">
                        {{ pages[settings.size_chart_page].content }}
                      </div>
                    </div>
                  </div>
                </div>
                {% endif %}
                {% endfor %}
              </div>
 
              <select name="id" class="original-selector">
                {% for variant in product.variants %}
                <option value="{{ variant.id }}" {% if variant == product.selected_or_first_available_variant %} selected="selected"{% endif %} data-stock="{% if variant.inventory_management == 'shopify' and variant.inventory_quantity <= 0 %}out{% endif %}">{{ variant.title | escape }}</option>
                {% endfor %}
              </select>
 
 
              {% else %}
              <input type="hidden" name="id" value="{{ product.selected_or_first_available_variant.id }}" />
 
              {% unless product.has_only_default_variant %}
              <div class="singleopt">
                {% for option in product.options %}
                {% assign opt_idx = 'option' | append: forloop.index %}
                <label>{{ option }}: {{ product.variants.first[opt_idx] }}</label>
 
                {% if settings.show_size_chart and option == settings.size_chart_variant %}
                <div class="size-chart-container">
                  <a href="{{ pages[settings.size_chart_page].url }}" target="_blank" class="size-chart-link">
                    {{ 'products.product.size_chart' | t }}
                  </a>
                  <div class="size-chart-content hidden">
                    <div class="size-chart">
                      <div class="size-chart__inner user-content">
                        {{ pages[settings.size_chart_page].content }}
                      </div>
                    </div>
                  </div>
                </div>
                {% endif %}
                {% endfor %}
              </div>
              
              <span class="h4-style price-area" style="color: white;">
                {% if variant.compare_at_price > variant.price %}
                <span class="was-price theme-money">{{ variant.compare_at_price | money }}</span>
                {% endif %}
                <span class="price theme-money">{{ variant.price | money }}</span>
              </span>
              {% endunless %}
 
              {% endif %}
            </div>
 
            <div class="input-row quantity-submit-row {% if section.settings.enable_payment_button %}has-spb{% endif %}">
              <span class="quantity-submit-row__quantity">
                <label for="quantity">{{ 'products.product.quantity' | t }}</label>
                <input id="quantity" class="select-on-focus input--large" name="quantity" value="1" size="2" />
              </span>
              <span class="quantity-submit-row__submit">
                <input class="button button--large" type="submit" value="{{ 'products.product.add_to_cart' | t }}" />
              </span>
              {% if section.settings.enable_payment_button %}
              {{ form | payment_button }}
              {% endif %}
              
            </div>
            
            {% capture backorder_message %}{{ 'products.product.backorder' | t }}{% endcapture %}
            {% unless backorder_message == blank %}
            {% if product.variants.size == 1 %}
            {% if product.variants.first.inventory_management == 'shopify' and product.variants.first.inventory_quantity < 1 %}
            <div class="backorder">
              <p><span class="selected-variant">{{ product.title }}</span> {{ backorder_message }}</p>
            </div>
            {% endif %}
            {% else %}
            <div class="backorder hidden">
              <p><span class="selected-variant"></span> {{ backorder_message }}</p>
            </div>
            {% endif %}
            {% endunless %}
            {% endform %}
 
            {% else %}
 
            <p><em>{{ 'products.product.product_unavailable' | t }}</em></p>
 
            {% endif %}
          </div>
        </div>
        
      </div>
 
  </div>
 
</div>
</div>
 
{% comment %}
<div itemscope itemtype="http://schema.org/Product" data-section-type="product-template">
  <meta itemprop="name" content="{{ product.title }}" />
  <meta itemprop="url" content="{{ shop.url }}{{ product.url }}" />
  <meta itemprop="image" content="http:{{ product.featured_image.src | product_img_url: 'grande' | remove: 'http:' | remove: 'https:' }}" />
  {% for variant in product.variants %}
  <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
    <meta itemprop="price" content="{{ variant.price | divided_by: 100.00 }}">
    <meta itemprop="priceCurrency" content="{{ shop.currency }}" />
    {% if product.available %}
    <link itemprop="availability" href="http://schema.org/InStock" />
    {% else %}
    <link itemprop="availability" href="https://schema.org/OutOfStock" />
    {% endif %}
  </div>
  {% endfor %}
<div class="container desktop-colhead colheadsticky">
  <div class="page-header cf">
    {% assign product_collection = product.collections.first %}
{% if product_collection %}
     <h1 class="majortitle"> <a href="{{product_collection.url}}" class="go-back">
        <img src="{{ 'colback-arrows.png' | asset_img_url: '20x' }}">
  {{ 'Go Back To Collection'}}
    </a></h1>
{% endif %}
    
    {% comment %}
    
    {% for collection in product.collections %}
    
     <h1 class="majortitle">{{ collection.title | escape }}</h1>
    
{% endfor %}
    {% endcomment %}
     
  </div>
 
</div>  
  
 
  <div class="container desktop-only">
    <div class="page-header cf">
      <div class="filters">
        {% if section.settings.prod_show_tags and product.tags.size > 0 %}
        <span class="tags">
          <a href="#" data-toggle-target=".tags.nav-row">{{ 'products.product.tags' | t }} <span class="state">+</span></a>
        </span>
        {% endif %}
 
        {% if section.settings.prod_show_type %}
        {% assign product_type_handle = product.type | handle %}
        {% if collections[product_type_handle].handle == product_type_handle %}
        {% assign type_url = collections[product_type_handle].url %}
        {% else %}
        {% assign type_url = product.type | url_for_type %}
        {% endif %}
        <span class="see-more">{{ 'products.product.see_more_of_this_type' | t }} {{ product.type | link_to: type_url }}</span>
        {% endif %}
      </div>
 
      {% if collection %}
      <div class="social-area">
        <span class="nextprev">
          {% if collection.previous_product %}
          <a class="control-prev" href="{{ collection.previous_product }}">{{ 'products.product.previous' | t }}</a>
          {% endif %}
          {% if collection.previous_product and collection.next_product %} / {% endif %}
          {% if collection.next_product %}
          <a class="control-next" href="{{ collection.next_product }}">{{ 'products.product.next' | t }}</a>
          {% endif %}
        </span>
      </div>
      {% endif %}
    </div>
  </div>
 
  {% if section.settings.prod_show_tags and product.tags.size > 0 %}
  <div class="tags nav-row spaced-row hidden desktop-only">
    <ul>
      {% for tag in product.tags %}
      <li><a href="{% if collection %}{{ collection.url }}{% else %}/collections/all{% endif %}/{{ tag | handle }}">{{ tag }}</a></li>
      {% endfor %}
    </ul>
  </div>
  {% endif %}
 
  {% assign variant = product.selected_or_first_available_variant %}
 
  <div class="product-detail spaced-row container cf {% if variant.compare_at_price > variant.price %}variant-status--on-sale{% endif %}">
 
    <div class="gallery gallery-layout-{{ section.settings.prod_gall_thumbs_under }} layout-column-half-left {% if product.images.size > 1 %}has-thumbnails{% endif %}">
      {% assign lightbox_size = 'master' %}
      <div class="main-image">
        {% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}
 
        <a class="shows-lightbox" title="{{ featured_image.alt | escape }}"
          href="{{ featured_image | product_img_url: lightbox_size }}"
          data-full-size-url="{{ featured_image | product_img_url: 'master' }}">
          {% include 'responsive-image', image: featured_image, imgClass: 'cbb-loupe' %}
        </a>
      </div>
 
      {% if product.images.size > 1 %}
      <div class="thumbnails">
        {% for image in product.images %}
        <a {% if forloop.first %} class="active" {% endif %} title="{{ image.alt | escape }}"
          href="{{ image | product_img_url: lightbox_size }}"
          data-full-size-url="{{ image | product_img_url: 'master' }}">
          {% include 'responsive-image', image: image %}
        </a>
        {% endfor %}
      </div>
      {% endif %}
 
      <div class="mobile-slideshow">
        <div class="slideshow" data-slick='{"adaptiveHeight":true}'>
          {% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}
          <div class="slide" data-full-size-url="{{ featured_image | product_img_url: 'master' }}">
            {% include 'responsive-image', image: featured_image, manual_image_load: true, imgClass: 'cbb-loupe'%}
          </div>
          {% for image in product.images %}
          {% unless image contains featured_image %}
          <div class="slide" data-full-size-url="{{ image | product_img_url: 'master' }}">
            {% include 'responsive-image', image: image %} 
          </div>
          {% endunless %}
          {% endfor %}
        </div>
      </div>
    </div>
 
    <div class="detail layout-column-half-right">
      {% include 'product-label' with product %}
      <div class="mobile-colhead">
 {% if settings.prod_show_vendor or settings.prod_show_sku %}
        <div class="lightly-spaced-row mobile-vandor">
           {%- if settings.prod_show_vendor -%}
            {%- comment -%}
            Do we have a collection that has the same name as our product vendor name?
            If we do, let's have the vendor link point to it.
            If not, we will point to the automatic vendor collection.
            {%- endcomment -%}
          <!--HC- Add vendor image-20 Mar'20-->
              {%- assign product_vendor_handle = product.vendor | handle -%}
            {% assign vendor_image = product_vendor_handle | append:'.png' %}
              {%- if collections[product_vendor_handle].handle == product_vendor_handle -%}
                {%- assign vendor_url = collections[product_vendor_handle].url -%}
              {%- else -%}
                {%- assign vendor_url = product.vendor | url_for_vendor -%}
              {%- endif -%}
          <div class="vendor showDesktop"><a href="/pages/{{ product.vendor | handle  }}"><img src="{{ vendor_image | file_url }}" style="max-width: 300px;margin: auto;"/></a></div>
          </div>
          <div class="clear"></div>
            <div class="lightly-spaced-row desktop-vendor" style="display:inline-block;"> 
              <div class="vendor"><a href="/pages/{{ product.vendor | handle  }}">{{ product.vendor }}</a></div>
         
              {%- endif -%}
 
          
          {%- if settings.prod_show_sku -%}
            <div class="sku {% if product.selected_or_first_available_variant.sku == blank %}sku--no-sku{% endif %}">{{ 'products.product.sku' | t }} <span class="sku__value">{{ product.selected_or_first_available_variant.sku }}</span></div>
          {%- endif -%}
       
           </div>
      {% endif %}
      <span>/</span>
        <h1 class="title">{{ product.title }}</h1>
        </div>
      <div class="theme-product-reviews">
        <a href="#shopify-product-reviews"><span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span></a>
      </div>
 
      <h2 class="h4-style price-area">
        {% if variant.compare_at_price > variant.price %}
        <span class="was-price theme-money">{{ variant.compare_at_price | money }}</span>
        {% endif %}
        <span class="price theme-money">{{ variant.price | money }}</span>
      </h2>
 
 
     
 
      <div class="product-form section">
        {% if product.available %}
        {% form 'product', product, class: 'form', data-product-id: product.id, data-enable-history-state: 'true' %}
          <div class="input-row">
            {% if product.variants.size > 1 %}
 
            <div class="option-selectors">
              {% for option in product.options_with_values %}
                <div class="selector-wrapper cf">
                  <label {% if option.name == 'default' %}class="hidden"{% endif %} for="option-{{ option.name | handle }}">
                    {{ option.name }}
                  </label>
 
                  <span class="styled-select" {% if settings.prod_variant_style == 'blocks' %}data-make-box{% endif %}>
                    <select id="option-{{ option.name | handle }}">
                      {% for value in option.values %}
                      <option value="{{ value | escape }}" {% if option.selected_value == value %}selected{% endif %}>
                        {{ value }}
                      </option>
                      {% endfor %}
                    </select>
                  </span>
                </div>
 
                {% if settings.show_size_chart and option.name == settings.size_chart_variant %}
                  <div class="size-chart-container">
                    <a href="{{ pages[settings.size_chart_page].url }}" target="_blank" class="size-chart-link">
                      {{ 'products.product.size_chart' | t }}
                    </a>
                    <div class="size-chart-content hidden">
                      <div class="size-chart">
                        <div class="size-chart__inner user-content">
                          {{ pages[settings.size_chart_page].content }}
                        </div>
                      </div>
                    </div>
                  </div>
                {% endif %}
              {% endfor %}
            </div>
 
            <select name="id" class="original-selector">
              {% for variant in product.variants %}
              <option value="{{ variant.id }}" {% if variant == product.selected_or_first_available_variant %} selected="selected"{% endif %} data-stock="{% if variant.inventory_management == 'shopify' and variant.inventory_quantity <= 0 %}out{% endif %}">{{ variant.title | escape }}</option>
              {% endfor %}
            </select>
 
 
            {% else %}
            <input type="hidden" name="id" value="{{ product.selected_or_first_available_variant.id }}" />
 
            {% unless product.has_only_default_variant %}
              <div class="singleopt">
                {% for option in product.options %}
                  {% assign opt_idx = 'option' | append: forloop.index %}
                  <label>{{ option }}: {{ product.variants.first[opt_idx] }}</label>
 
                  {% if settings.show_size_chart and option == settings.size_chart_variant %}
                    <div class="size-chart-container">
                      <a href="{{ pages[settings.size_chart_page].url }}" target="_blank" class="size-chart-link">
                        {{ 'products.product.size_chart' | t }}
                      </a>
                      <div class="size-chart-content hidden">
                        <div class="size-chart">
                          <div class="size-chart__inner user-content">
                            {{ pages[settings.size_chart_page].content }}
                          </div>
                        </div>
                      </div>
                    </div>
                  {% endif %}
                {% endfor %}
              </div>
            {% endunless %}
 
            {% endif %}
          </div>
 
          <div class="input-row quantity-submit-row {% if section.settings.enable_payment_button %}has-spb{% endif %}">
            <span class="quantity-submit-row__quantity">
              <label for="quantity">{{ 'products.product.quantity' | t }}</label>
              <input id="quantity" class="select-on-focus input--large" name="quantity" value="1" size="2" />
            </span>
            <span class="quantity-submit-row__submit">
              <input class="button button--large" type="submit" value="{{ 'products.product.add_to_cart' | t }}" />
            </span>
            {% if section.settings.enable_payment_button %}
              {{ form | payment_button }}
            {% endif %}
          </div>
 
          {% capture backorder_message %}{{ 'products.product.backorder' | t }}{% endcapture %}
          {% unless backorder_message == blank %}
            {% if product.variants.size == 1 %}
              {% if product.variants.first.inventory_management == 'shopify' and product.variants.first.inventory_quantity < 1 %}
                <div class="backorder">
                  <p><span class="selected-variant">{{ product.title }}</span> {{ backorder_message }}</p>
                </div>
              {% endif %}
            {% else %}
              <div class="backorder hidden">
                <p><span class="selected-variant"></span> {{ backorder_message }}</p>
              </div>
            {% endif %}
          {% endunless %}
        {% endform %}
 
        {% else %}
 
        <p><em>{{ 'products.product.product_unavailable' | t }}</em></p>
 
        {% endif %}
      </div>
 
 
      {% if section.settings.prod_desc_pos == 'beside' %}
      <div class="description user-content">{{ product.description }}</div>
 
      {% comment %} Add code to show under the description on the line below this one, if beside the image {% endcomment %}
      <!-- Underneath the description -->
 
      {% endif %}
 
      <div class="desktop-only">
        {% include 'social-sharing' %}
      </div>
    </div>
 
    {% if section.settings.prod_desc_pos == 'below' %}
    <div class="description user-content padded-row">{{ product.description }}</div>
 
    {% comment %} Add code to show under the description on the line below this one, if full-width underneath the image {% endcomment %}
    <!-- Underneath the description -->
    {% endif %}
 
  </div><!-- /.product-detail -->
 
  <div class="mobile-only product-meta">
    {% if section.settings.prod_show_tags and product.tags.size > 0 %}
    <div class="tags tags-inline product-meta-row">
      <div class="container">
        <label>{{ 'products.product.tags' | t }}</label>
        <ul>
          {% for tag in product.tags %}
          <li><a href="{% if collection %}{{ collection.url }}{% else %}/collections/all{% endif %}/{{ tag | handle }}">{{ tag }}</a></li>
          {% endfor %}
        </ul>
      </div>
    </div>
    {% endif %}
    <div class="product-meta-row">
      <div class="container">
        {% include 'social-sharing' %}
      </div>
    </div>
    <div class="product-meta-row further-nav">
      <div class="container">
        <div class="prev">
          {% if collection.previous_product %}
          <a class="control-prev" href="{{ collection.previous_product }}">{% include 'svg-chevron-left' %}</a>
          {% endif %}
        </div>
 
        <div class="see-more">
          {% if section.settings.prod_show_type %}
          {% assign product_type_handle = product.type | handle %}
          {% if collections[product_type_handle].handle == product_type_handle %}
          {% assign type_url = collections[product_type_handle].url %}
          {% else %}
          {% assign type_url = product.type | url_for_type %}
          {% endif %}
          {{ product.type | link_to: type_url }}
          {% endif %}
        </div>
 
        <div class="next">
          {% if collection.next_product %}
          <a class="control-next" href="{{ collection.next_product }}">{% include 'svg-chevron-right' %}</a>
          {% endif %}
        </div>
      </div>
    </div>
  </div>
 
  <div class="theme-product-reviews-full container">
    <div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>
  </div>
 
  {% if section.settings.show_related_products %}
  {% include 'related-products' %}
  {% endif %}
 
</div>
{% endcomment %}
 
{% schema %}
  {
    "name": "Product pages",
    "settings": [
      {
        "type": "checkbox",
        "id": "prod_show_tags",
        "label": "Show tags"
      },
      {
        "type": "checkbox",
        "id": "prod_show_type",
        "label": "Show 'See more (type)'"
      },
      {
        "type": "radio",
        "id": "prod_gall_thumbs_under",
        "label": "Thumbnail position",
        "options": [
          {
            "value": "beside",
            "label": "Beside main image"
          },
          {
            "value": "under",
            "label": "Underneath main image"
          }
        ],
        "default": "beside"
      },
      {
        "type": "select",
        "id": "prod_desc_pos",
        "label": "Description position",
        "options": [
          {
            "value": "beside",
            "label": "Beside main image, under price"
          },
          {
            "value": "below",
            "label": "Underneath image and price"
          }
        ]
      },
      {
        "type": "checkbox",
        "id": "enable_payment_button",
        "label": "Show dynamic checkout button",
        "info": "Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. [Learn more](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "default": true
      },
      {
        "type": "header",
        "content": "Related products"
      },
      {
        "type": "paragraph",
        "content": "Show other products from the same collection, underneath the product details"
      },
      {
        "type": "checkbox",
        "id": "show_related_products",
        "label": "Show",
        "default": false
      }
]
  }
{% endschema %}
 
Accepted Solutions (2)
ryaneddylutz
Tourist
6 1 2

This is an accepted solution.

hey thank you very much

I dont have that theme.scss.   but I do have styles.scss.liquid.  When I paste, it removes the button, but still leaves the "drop down" box.  How Do I remove that?  


I also have a "cart" button Im wanting to remove site wide.  

Is there a quick solution for these 2 issues?

View solution in original post

Hardik29418
Shopify Partner
2859 407 1073

This is an accepted solution.

.option-selectors {

display: none !important;

}

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email

View solution in original post

Replies 5 (5)

Hardik29418
Shopify Partner
2859 407 1073

Please place this code at the end of theme.scss

.price-area, .quantity-submit-row {
display: none;
}

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email
ryaneddylutz
Tourist
6 1 2

This is an accepted solution.

hey thank you very much

I dont have that theme.scss.   but I do have styles.scss.liquid.  When I paste, it removes the button, but still leaves the "drop down" box.  How Do I remove that?  


I also have a "cart" button Im wanting to remove site wide.  

Is there a quick solution for these 2 issues?

Hardik29418
Shopify Partner
2859 407 1073

This is an accepted solution.

.option-selectors {

display: none !important;

}

- Need a Shopify developer? Chat on WhatsApp or EMAIL ME!


- Your Coffee Tip would do Magic code ❤️
- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Email
ryaneddylutz
Tourist
6 1 2

awesome, thanks for your knowledgable quick responses.  ITs really appreciated.  I wish all developers were as quick and accurate!!  😀

ryaneddylutz
Tourist
6 1 2

Do you know how to remove the "cart" button in the header?