Trying to hide/remove add to cart button in Porto theme

New Member
6 0 0

I've followed Shopify's guide and tried commenting out the add to cart button and product short description but I can't find the right lines of code to comment out. Can anyone help me find which code to comment out/delete?

 

<!-- /templates/product.liquid -->
<div class="product_layout product_view_{{settings.product_page_type}}">
  {% assign variant_tmp = product.selected_or_first_available_variant | default: product.variants.first %}
  {% assign featured_image = current_variant.featured_image | default: product.featured_image %}
  {% include 'breadcrumb' %}
  {% assign media_col = settings.product_image_size %}
  {% assign main_col = 12 | minus: settings.product_image_size %}
  <div class="product-main">
    <div class="container">
      <div class="box_product_page">
        <div class="row">
          {% if settings.product_sidebar_display != blank and settings.product_page_type == 'default' %}
          <div class="col-lg-9 col-main">
          {% else %}
          <div class="col-lg-12">
          {% endif %}
          {%- assign name_product_page = 'product_view_' | append:settings.product_page_type -%}
          {%- include name_product_page -%}
          </div>
          {% if settings.product_sidebar_display != blank and settings.product_page_type == 'default' %}
          <div class="col-lg-3 sidebar-product col-right">
            <div class="mobile-canvas-overlay close-mobile-canvas"></div>
            <div class="block-main-canvas">
              <div class="canvas-icon d-block d-lg-none"><a href="javascript&colon;void(0)"><i class="fa fa-sliders"></i></a></div>
              <div class="canvas-inner">
                {% if settings.product_sidebar_content != '' %}
                <div class="custom-block custom-block-1">
                  {{settings.product_sidebar_content}}
                </div>
                {% endif %}
                <div class="custom-block">
                  <div class="owl-banner">
                    <div class="data-carousel"
                          data-items="1"
                          data-auto=""
                          data-paging="true"
                          data-nav="false"
                          data-prev=''
                          data-margin="0"
                          data-next='' style="display: none;"></div>
                    <div class="owl-carousel carousel-init owl-carousel-lazy">
                      {%- for i in (1..3) -%}
                      {%- capture banner %}sidebar_banner{{ i }}{% endcapture -%}
                      {%- capture link %}product_sidebar_banner_link_{{ i }}{% endcapture -%}
                      {%- capture sidebar_banner_enable %}sidebar_banner{{ i }}_enable{% endcapture -%}
                      {%- if settings[sidebar_banner_enable] != blank -%}
                      <div class="item">
                        {%- assign promo_src=settings[banner] | img_url: '500x' -%}
                        {%- if promo_src contains 'no-image' -%}
                          {%- assign promo_src='img270x350.png' | asset_url -%}
                        {%- endif -%}
                        {%- if settings[link] != '' -%}
                        <a href="{{ settings[link] }}" class="image-link">
                          {%- endif -%}
                          <img src="{{ promo_src }}" />
                          {%- if settings[link] != '' -%}
                        </a>
                        {%- endif -%}
                      </div>
                      {%- endif -%}
                      {%- endfor -%}
                    </div>
                  </div>
                </div>
                {% if settings.bestseller_product_enable != blank %}
                <div class="block bestseller-product sidebar-cate-toogle">
                  <div class="block-title">
                    {% if settings.language_enable %}
                    <span class="lang1">{{ settings.sidebar_product_title | split: '|' | first }}</span>
                    <span class="lang2">{{ settings.sidebar_product_title | split: '|' | last }}</span>
                    {% else %}
                    {{ settings.sidebar_product_title | split: '|' | first }}
                    {% endif %}
                  </div>
                  <div class="sidebar-content block-content">
                    {% include 'bestseller-product' %}
                  </div>
                </div>
                {% endif %}
              </div>
            </div>
          </div>
          {% endif %}
        </div>
      </div>
    </div>
    <script>
      productsObj.id{{product.id}} = {{product | json}};
      $(document).ready(function() {
        {% if settings.move_product_tab != blank and settings.product_page_type == 'default' %}
        $(".product-shop .middle-product-detail").before($(".product-tabs"));
        $(".product-shop .middle-product-detail").before($(".product-tab-accordion"));
        {% endif %}
      });
      selectCallback = function(variant, selector) {
        if (variant) {
          if (variant.compare_at_price > variant.price) {
            $("#price").html('<del class="price_compare">' + Shopify.formatMoney(variant.compare_at_price, money_format) + "</del>" + '<div class="price">' + Shopify.formatMoney(variant.price, money_format) + "</div>")
          } else {
            $("#price").html('<div class="price">' + Shopify.formatMoney(variant.price, money_format) + "</div>");
          }
          if (variant.available) {
            frontendData.enableCurrency && currenciesCallbackSpecial("#price span.money"),
              $(".product-page-area .product-shop .add-to-cart").removeClass("disabled").removeAttr("disabled").children('span').html(window.inventory_text.add_to_cart),
              variant.inventory_management && variant.inventory_quantity <= 0 ? ($("#selected-variant").html(selector.product.title + " - " + variant.title), $("#backorder").removeClass("hidden")) : $("#backorder").addClass("hidden");
            if (variant.inventory_management!=null) {
              $(".product-inventory span.in-stock").text(window.inventory_text.in_stock);
            } else {
              $(".product-inventory span.in-stock").text(window.inventory_text.many_in_stock);
            }
            $('.product-sku span.sku').text(variant.sku);
          }else{
            $("#backorder").addClass("hidden"), $(".product-page-area .add-to-cart").addClass("disabled").attr("disabled", "disabled").children('span').html(window.inventory_text.sold_out);
            $(".product-inventory span.in-stock").text(window.inventory_text.out_of_stock);
            $('.product-sku span.sku').empty();
          }
          if( swatch_color_type == '1' || swatch_color_type == '2' ) {
            var form = $('#' + selector.domIdPrefix).closest('form');
            for (var i=0,length=variant.options.length; i<length; i++) {
              var radioButton = form.find('.swatch[data-option-index="' + i + '"] :radio[value="' + variant.options[i] +'"]');
              if (radioButton.size()) {
                radioButton.get(0).checked = true;
              }
            }
          }
        }
        if (variant && variant.featured_image) {
          var n = Shopify.Image.removeProtocol(variant.featured_image.src);
          $(".product-image-thumbs .thumb-link").filter('[data-zoom-image="' + n + '"]').trigger("mouseenter");
        }
        variant && variant.sku ? $("#sku").removeClass("hidden").find("span").html(variant.sku) : $("#sku").addClass("hidden").find("span").html("");
      };
      convertToSlug= function(e) {
        return e.toLowerCase().replace(/[^a-z0-9 -]/g, "").replace(/\s+/g, "-").replace(/-+/g, "-");
      };
      jQuery(function($) {
        {% if product.available and product.variants.size >= 1 %}
        var product = {{product | json}};
        var layout = $('.product-page-area');
        if (product.variants.length >= 1) { //multiple variants
          for (var i = 0; i < product.variants.length; i++) {
            var variant = product.variants[i];
            var option = '<option value="' + variant.id + '">' + variant.title + '</option>';
            layout.find('form.product-form > select').append(option);
          }
          new Shopify.OptionSelectors("product-selectors", {
            product: product,
            onVariantSelected: selectCallback,
            enableHistoryState: true
          });

          //start of quickview variant;
          var filePath = asset_url.substring(0, asset_url.lastIndexOf('/'));
          var assetUrl = asset_url.substring(0, asset_url.lastIndexOf('/'));
          var options = "";
          for (var i = 0; i < product.options.length; i++) {
            options += '<div class="swatch clearfix" data-option-index="' + i + '">';
            options += '<div class="header">' + product.options[i] + ':</div>';
            options += '<div class="variant-items">';
            var is_color = false;
            var is_square = 'square';
            if (/Color|Colour/i.test(product.options[i])) {
              is_color = true;
            }
            if (swatch_color_type == '2') {
              is_color = false;
              is_square = '';
            }
            var optionValues = new Array();
            for (var j = 0; j < product.variants.length; j++) {
              var variant = product.variants[j];
              var value = variant.options[i];
              if(variant.featured_image && product_swatch_setting == '2') {
                var img = variant.featured_image.src.lastIndexOf(".");
                var vimg = variant.featured_image.src.slice(0, img) + "_50x50_crop_center" + variant.featured_image.src.slice(img);
              }
              var valueHandle = convertToSlug(value);
              var forText = 'swatch-' + i + '-' + valueHandle;
              if (optionValues.indexOf(value) < 0) {
                //not yet inserted
                options += '<div data-value="' + value + '" class="swatch-element '+is_square+' '+product_swatch_size+' '+(is_color ? "color" : "")+' ' + (is_color ? "color" : "") + valueHandle + (variant.available ? ' available ' : ' soldout ') + '">';

                if (is_color) {
                  options += '<div class="tooltip">' + value + '</div>';
                }
                options += '<input id="' + forText + '" type="radio" name="option-' + i + '" value="' + value + '" ' + (j == 0 ? ' checked ' : '') + (variant.available ? '' : ' disabled') + ' />';

                if (is_color) {
                  if(vimg && product_swatch_setting == '2') {
                    options += '<label for="' + forText + '" class="swatch-image" style="overflow:hidden;"><img src="' + vimg + '" class="variant-image" style="max-width:100%;" /><img class="crossed-out" src="' + assetUrl + 'soldout.png" /></label>';
                  }else{
                    options += '<label for="' + forText + '" style="background-color: ' + valueHandle + '; background-image: url(' + filePath + valueHandle + '.png)"><img class="crossed-out" src="' + assetUrl + 'soldout.png" /></label>';
                  }
                } else {
                  options += '<label for="' + forText + '">' + value + '<img class="crossed-out" src="' + assetUrl + 'soldout.png" /></label>';
                }
                options += '</div>';
                if (variant.available) {
                  $('.product-page-area .swatch[data-option-index="' + i + '"] .' + valueHandle).removeClass('soldout').addClass('available').find(':radio').removeAttr('disabled');
                }
                optionValues.push(value);
              }
            }
            options += '</div>';
            options += '</div>';
          }
          if(swatch_color_type == '1' || swatch_color_type == '2') {
            layout.find('form.product-form .product-options > select').after(options);
            layout.find('.swatch :radio').change(function() {
              var optionIndex = $(this).closest('.swatch').attr('data-option-index');
              var optionValue = $(this).val();
              $(this)
              .closest('form')
              .find('.single-option-selector')
              .eq(optionIndex)
              .val(optionValue)
              .trigger('change');
            });
          }
      
          if (product.available) {
            Shopify.optionsMap = {};
            Shopify.linkOptionSelectors(product);
          }
          //end of quickview variant
        } else { //single variant
          layout.find('form.product-form .product-options > select').remove();
          var variant_field = '<input type="hidden" name="id" value="' + product.variants[0].id + '">';
          layout.find('form.product-form').append(variant_field);
        }
        {% endif %}
      });
    </script>
  </div>
</div>
{% if settings.product_addtocart_sticky != blank %}
<div class="sticky-product hide">
  <div class="container">
    <div class="sticky-image">
      {% assign featured_image = current_variant.featured_image | default: product.featured_image %}
      <img id="image-main" class="visible" data-src="{{ featured_image | product_img_url: '50x50' }}"/>
    </div>
    <div class="sticky-detail">
      <div class="product-name-area">
        <h2 class="product-name">
          {% if settings.language_enable %}
          <span class="lang1">{{ product.title | split: '|' | first }}</span>
          <span class="lang2">{{ product.title | split: '|' | last }}</span>
          {% else %}
          {{ product.title | split: '|' | first }}
          {% endif %}
        </h2>
{% comment %}Start automatically added Judge.me widget{% endcomment %}
  {% include 'judgeme_widgets', widget_type: 'judgeme_preview_badge', concierge_install: true %}
{% comment %}End automatically added Judge.me widget{% endcomment %}

        <div class="price-box"></div>
      </div>
      <div class="ratings">
        <span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>
      </div>
      <p class="availability in-stock"></p>
    </div>
    <div class="add-to-cart-clone">
      {% if product.available %}
      <button type="button" id="product-addtocart-button-clone">
        <i class="icon-cart"></i>
        <span>{{ 'products.product.add_to_cart' | t }}</span>
      </button>
      {% else %}
      <button type="button" id="product-addtocart-button-clone">
        <i class="icon-cart"></i>
        <span>{{ 'products.product.sold_out' | t }}</span>
      </button>
      {% endif %}
    </div>
  </div>
</div>
<script type="text/javascript">
  var p_scrolled = false;
  $(window).scroll(function() {
    var addcart_pos = $('.add-to-cart-box .add-to-cart').offset().top;
    if(addcart_pos<$(window).scrollTop() && !p_scrolled) {
      if($('.sticky-header').length > 0) {
        $('.sticky-product').addClass('has-sticky-header');
      }
      p_scrolled = true;
      $('.middle-product-detail .detail-price > *').each(function(){
        $(this).parent().append($(this).clone());
        var tmp = $(this).detach();
        $('.sticky-product .price-box').append(tmp);
      });
      $(".sticky-product").removeClass("hide");
      $(".actions .button-wrapper-content button").off("DOMSubtreeModified").on("DOMSubtreeModified",function(){
        $("#product-addtocart-button-clone span").html($(this).text());
      });
    }
    if(addcart_pos>=$(window).scrollTop() && p_scrolled) {
      p_scrolled = false;
      $('.middle-product-detail .detail-price > *').remove();
      $('.sticky-product .price-box > *').each(function(){
        var tmp = $(this).detach();
        $('.middle-product-detail .detail-price').append(tmp);
      });
      $(".sticky-product").addClass("hide");
    }
    isStickyMobile();
  });
  function isStickyMobile() {
    if($('.header-container.sticky-header').css('position') == 'fixed') {
      $(".sticky-product").css('top', $('.header-container.sticky-header').outerHeight());
    }
    else {
      $(".sticky-product").css('top', $('.sticky-header .header-wrapper').outerHeight());
    }
  }
  isStickyMobile();
  $(window).resize(function(){
    isStickyMobile();
  });
  $("#product-addtocart-button-clone").click(function() {
    $(".product-options-bottom .btn-cart.add-to-cart").trigger("click");
  });
</script>
{% endif %}
{% if settings.full_width_product_tab != blank and settings.move_down_product_tab_related == blank and settings.product_page_type == 'default' %}
<div class="product-view">
  <div class="product-collateral">
    <div class="container">
      <div class="product-description rte" itemprop="description">
        {% section 'product-page-tab-custom' %}
      </div>
    </div>
  </div>
</div>
{% endif %}
  {% include 'judgeme_widgets', widget_type: 'judgeme_review_widget', concierge_install: true %}
{% if settings.related_product_display %}
{% if settings.full_width_background_related != blank %}
<div class="full-width products-related product_type_{{ settings.style_product_view }}">
  <div class="container">
    <div class="box_product_related">
      {% if settings.related_product_type == "tags" %}
      {% include 'related-products-by-tags' %}
      {% else %}
      {% include 'related-products' %}
      {% endif %}
    </div>
    <style>
      .main-container .main-wrapper {
        padding-top: 0;
        padding-bottom: 0;
      }
      .main-container {
        padding-bottom: 0;
      }
    </style>
  </div>
</div>
{% endif %}
{% endif %}
{% if settings.full_width_product_tab != blank and settings.move_down_product_tab_related != blank and settings.product_page_type == 'default' %}
<div class="product-view">
  <div class="product-collateral">
    <div class="container">
      <div class="product-description rte" itemprop="description">
        {% section 'product-page-tab-custom' %}
      </div>
    </div>
  </div>
</div>
  
  
{% endif %}
  
  
<script type="text/javascript">
  jQuery(function($) {
    $('.canvas-icon, .close-mobile-canvas').click(function(event) {
      if(!$('body').hasClass('mobile-canvas-shown')) {
        $('body').addClass('mobile-canvas-shown', function() {
          setTimeout(function(){
            $(document).one("click",function(e) {
              var target = e.target;
              if (!$(target).is('.block-main-canvas .block') && !$(target).parents().is('.block-main-canvas .canvas-inner')) {
                $('body').removeClass('mobile-canvas-shown');
              }
            });
          }, 111);
        });
      } else {
        $('body').removeClass('mobile-canvas-shown');
      }
    });
    $(document).on("click", ".spr-badge-caption" , function() {
      $('html, body').animate({
        scrollTop: $(".product-tabs, .panel-review-tab").offset().top
      }, 1000);
      $('.reviews_tab > a').trigger('click');
      if($('.panel-review-tab .panel-title > a').attr('aria-expanded') != 'true') {
        $('.panel-review-tab .panel-title > a').trigger('click');
      }
    });
  });
</script>
<style>
  @media(max-width: 991px){
    .canvas-inner {padding-top: 20px;}
  }
</style>
</div>
0 Likes
Shopify Expert
2505 420 529

Hi @sgr 

On this code not add to cart button code. may be you can find in {% include 'bestseller-product' %} snippet.

Or check in section->product-template.liquid

Note: find name="add" its your add to cart button 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
1 Like