Product page extra add to cart button

[jeffreym]

How can I add an extra 'add to cart button' to my product page. I would like it to go straight to cart not a link to the product page. 
URL: Hygiadental.com

PW: Melek

[Dan-From-Ryviu]

Hi @jeffreym 

Please create a Custom liquid section then add this code to Liquid. 

<div>
<button type="button" class="button button--primary atc-second">Add to cart</button>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
  var atcSecondButton = document.querySelector('.atc-second');
  if (atcSecondButton) {
    atcSecondButton.addEventListener('click', function() {
      var productFormSubmitButton = document.querySelector('.product-form__submit');
      if (productFormSubmitButton) {
        productFormSubmitButton.click();
      }
    });
  }
});
</script>

[jeffreym]

Hi thank you, This has added an add to cart button though I would also like it to activate the add to cart function. What the link is doing is taking me back to the top of the product page.

[Dan-From-Ryviu]

You can do that by adding this value to link of button

#MainContent

[jeffreym]

can you put it in for me as supposed to be? Nothing is happening on my end

[Dan-From-Ryviu]

Sorry, I did not explain clearly. I mean, please add the link I mentioned to button you got on your product page 

[K-Mahesh]

Hello @jeffreym 
You can add code by following these steps

1. Go to Online Store -> Theme ->  Open Customize.
2. Open your Product template.
3. Add new section from custom.liquid 

4. Paste the below code from custom.liquid section 

<div class="center">
 <button id="ProductSubmitButton-template--17256408449124__main" type="submit" name="add" form="product-form-template--17256408449124__main" class="button button--primary" aria-haspopup="dialog">
  <span>Add to cart</span>
  <div class="loading__spinner hidden">
   <svg aria-hidden="true" focusable="false" class="spinner" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
    <circle class="path" fill="none" stroke-width="6" cx="33" cy="33" r="30"></circle>
  </svg>
  </div>
 </button>
</duv>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[jeffreym]

Hi thankyou, This has added an add to cart button though I would also like it to activate the add to cart function. What the link is doing is taking me back to the top of the product page.