Adding Afterpay message in ajax cart

Highlighted

Hi!

I'm trying to integrate the Afterpay messaging into the Ajax cart. 

It's pretty straight forward for a product page and cart page when the page reloads, but I can't get it to load into the ajax-cart.

Is there a way to reinitialize the Afterpay code or some other method to get it to calculate? 

0 Likes
Highlighted

So for anyone that's interested, the use of the basic Shopify install for Afterpay doesn't have the functionality to use Javascript to dynamically add the messaging to various places (i.e. the Ajax Cart). So you have to include this file:

 

 

  <script async src="https://js.afterpay.com/afterpay-1.x.js"></script>

 

 

 instead of

 

 

<script async type="text/javascript" src="https://static.afterpay.com/shopify-afterpay-javascript.js"></script>

 

 

and then you can use 

 

 

window.addEventListener('Afterpay.ready', function() {
      Afterpay.createPlacements({
        targetSelector: '.placement-card .product-price-basic',
        attributes: {
          amountSelector: '.placement-card .product-price-basic',
        }
      });
    });

 

 

 and more specifically calling "Afterpay.createPlacements" with the attributes when opening or updating the AJAX cart.

I had to tweak the above for multiple targets and triggers. 

 

You can view more details and configurations here.

 

0 Likes