Step 1: Add Script Tags to Your Theme

  1. Open the theme.liquid file in your theme editor.
  2. Inside the <head> tag, add the following script tags to include Paytring’s Quick Checkout library:
<script 
  src="https://cdn.paytring.com/js/quick/shopify/quick-iframe-shopify.v1.0.0.js" 
  defer>
</script>
<script 
  src="https://cdn.paytring.com/js/quick/shopify/quick-shopify.v1.0.0.js?iframe=true&style=pc" 
  defer>
</script>

Step 2: Update Checkout Buttons

  1. Locate all the checkout buttons in your theme files (e.g., product.liquid, cart.liquid, etc.).
  2. For each button:
    • If the button is an <a> tag, remove the href attribute.
    • Add the following attributes to the button:
id="magic-checkout-button" type="button"

Example:

Before:

<a href="/checkout" class="btn-checkout">Checkout</a>

After:

<button id="magic-checkout-button" type="button" class="btn-checkout">Checkout</button>

Notes

  • Ensure that the id attribute is unique for each checkout button to avoid conflicts.
  • The magic-checkout-button ID is required for Paytring’s Quick Checkout to function properly.
  • Test the integration thoroughly to confirm that the checkout process works as expected.