Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Customize add to cart button on product page to launch a Jotform?


jffp

Question

1 answer to this question

Recommended Posts

  • 0
Posted (edited)

I was able to get it working with an upsell code somone made.  I changed the code where it says ***This is where you insert your custom url*** to redirect to a hidden page that I embedded on the product page>advanced>code injection. That way it will only show for the product you choose.

Form code injected at footer of product page additional info

 

<!-- Redirect to Upsell Page after clicking on Add To Cart Button -->

<!-- Author: Dmitry Kiselyov @_dmitrykiselyov -->

<script>

// /upsell-page is the default URL. To change it, replace /upsell-page with the required URL.

var upsellPageUrl = "/***This is where you insert your custom url***

////////////////////////////////

function redirectToUpsellPageHandler(wrapper){var addToCartButton=wrapper.querySelector(".sqs-add-to-cart-button"),productVariants=wrapper.querySelector(".product-variants");function isVariantInStock(){return productVariants.getAttribute("data-variant-in-stock")}function onClick(){(productVariants&&isVariantInStock()||!productVariants)&&setTimeout((function(){document.location.href=upsellPageUrl}),1200)}addToCartButton&&addToCartButton.addEventListener("click",onClick)}function redirectToUpsellPage(){var productPage=document.querySelector(".collection-type-products.view-item #productDetails, .collection-type-products.view-item .ProductItem-details"),productBlocks;productPage&&redirectToUpsellPageHandler(productPage),[].slice.call(document.querySelectorAll(".sqs-block-product")).forEach(redirectToUpsellPageHandler)}document.addEventListener("DOMContentLoaded",redirectToUpsellPage),window.addEventListener("mercury:load",redirectToUpsellPage);

</script>

<!-- end Redirect to Upsell Page after clicking on Add To Cart Button -->

 

I ended up going with the default product form from squarespace as there was no way to associate the jotform with an order and no way to manually add info to account. I set up a basic on the product page and advanced order form at the bottom of papers page in the shop. You can check out how I implemented the jotform here, www.jonathanfrancisfineprints.com

Edited by jffp
Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...