📘

Pay Monthly

For Pay Monthly specific messaging, see the Pay Monthly section below.

Configuration

Complete the steps below to position the Afterpay Product Page assets on your Shopify website.

Step One

Click the ‘Copy to Clipboard’ button below.

Step Two

Login to Shopify Admin

Step Three

Sales Channels > Online Store > Themes

Step Four

Navigate to the current theme, actions > edit code.

Step Five

Under the ‘Layout’ folder, click on ‘theme.liquid’.

Step Six

Scroll to the bottom of the theme.liquid file.

Step Seven

Paste the copied text (Step 1), at the bottom of the theme.liquid file.

Step Eight

Click Save, and navigate to the website to review the product and cart pages for Afterpay assets.

🇺🇸 🇦🇺   U.S / AU Merchant Example

Pay Monthly

If you are, or want to be a Pay Monthly user, this section describes the special steps you need to take for messaging.

📘

Afterpay On-Site Messaging

At present, Pay Monthly specific messaging is only available to Shopify merchants through Shopify Snippet. It is not available through the Afterpay On-Site Messaging app.

New Merchant with No Messaging

If you are new to Pay Monthly and so far have not done any messaging, do the following:

1. Substitute the following code snippet for the snippet given in Step One above. Copy to your clipboard.

<!-- Begin Shopify-Afterpay JavaScript Snippet (v1.1.5) -->
{% if cart.currency.iso_code == shop.currency %}
<script type="text/javascript">
// Overrides:
var afterpay_apr_loans_available = true;

// Non-editable fields:
var afterpay_js_language = {{ localization.language.iso_code | slice: 0, 2 | json }};
var afterpay_js_country = {{ localization.country.iso_code | json }};
var afterpay_shop_currency = {{ shop.currency | json }};
var afterpay_cart_currency = {{ cart.currency.iso_code | json }};
var afterpay_shop_money_format = {{ shop.money_format | json }};
var afterpay_shop_permanent_domain = {{ shop.permanent_domain | json }};
var afterpay_theme_name = {{ theme.name | json }};
var afterpay_product = {{ product | json }};
var afterpay_current_variant = {{ product.selected_or_first_available_variant | json }};
var afterpay_cart_total_price = {{ cart.total_price | json }};
var afterpay_js_snippet_version = '1.1.5';
</script>
<script type="text/javascript" src="https://static.afterpay.com/shopify-afterpay-javascript.js"></script>
{% else %}
<!-- Afterpay disabled: {{ cart.currency.iso_code }} != {{ shop.currency }} -->
{% endif %}
<!-- End Shopify-Afterpay JavaScript Snippet (v1.1.5) -->

2. Follow all the remaining steps in the procedure, from Step Two to the final Step Eight inclusive.

Existing Merchant who uses Shopify Snippet

Your task is to add an override to the theme.liquid file:

1. Follow all the steps above, until you get to Step Seven.

2. Locate the theme.liquid file.

3. Add the following override above the Non-editable fields: var afterpay_apr_loans_available = true

4. Follow Step Eight as normal.

Existing Merchant who uses Afterpay On-Site Messaging

At present, Pay Monthly specific messaging is only available to Shopify merchants through Shopify Snippet. It is not available through Afterpay On-Site Messaging app. Your only option is to delete Afterpay On-Site Messaging or pause messaging setup.

You could add Shopify Snippet instead. To do this follow the instructions for a New Merchant with No Messaging above.

Add an Afterpay Banner to Shopify

To add an Afterpay Banner to your Shopify page, follow the instructions here