Позиция фрагмента Afterpay в Shopify

Question

Я установил код фрагмента Afterpay в клиентском магазине Shopify, используя предоставленный код:

<!-- Begin Shopify-Afterpay JavaScript Snippet (v1.0.3) -->
<script type="text/javascript">
// Editable fields:
var afterpay_min = 0.04;            // As per your Afterpay contract.
var afterpay_max = 1000.00;         // As per your Afterpay contract.
var afterpay_cbt_enabled = false;   // As per your Afterpay contract; change to true to display Cross-Border Trade artwork (for AU/NZ).
var afterpay_logo_theme = 'colour'; // Can be 'colour', 'black' or 'white'.

// Overrides:



// Non-editable fields:
var afterpay_shop_currency = "AUD";
var afterpay_cart_currency = "AUD";
var afterpay_shop_money_format = "\u003cspan class=money\u003e${{amount}}\u003c\/span\u003e";
var afterpay_shop_permanent_domain = "preciousapril.myshopify.com";
var afterpay_theme_name = "PA2019";
var afterpay_product = null;
var afterpay_current_variant = null;
var afterpay_cart_total_price = 8485;
var afterpay_js_snippet_version = '1.0.3';
</script>
<script type="text/javascript" src="https://static.afterpay.com/shopify-afterpay-javascript.js"></script>
<!-- End Shopify-Afterpay JavaScript Snippet (v1.0.3) -->

В соответствии с инструкциями он расположен в самом низу шаблона theme.liquid.

Каким-то образом фрагмент настроен для отображения на странице продукта под ценой.

В моем случае он не отображается по цене, и я не могу его переместить: https://preciousapril.com/collections/new-arrivals/products/lucy-mae-floral-bloomer

Любойидеи?

Answer 1

Причина, по которой он не отображается ниже цены, заключается в том, что у него нет информации о CSS-селекторе для вашей цены.В Afterpay JS есть глобальный объект тем, а именно Afterpay.supportedThemes , который он использует для поиска CSS-селектора цены на страницах вашего продукта.Но ваша тема не является одной из них, поэтому она пытается найти нужный селектор и добавить информацию.

Однако, как указано в документации по интеграции Afterpay , вы можете переопределить селектор CSS.Для этого вы должны определить afterpay_product_selector.Согласно вашей теме, это будет

afterpay_product_selector = '.tt-price';

Таким образом, ваш полный код станет

<!-- Begin Shopify-Afterpay JavaScript Snippet (v1.0.3) -->
<script type="text/javascript">
// Editable fields:
var afterpay_min = 0.04;            // As per your Afterpay contract.
var afterpay_max = 1000.00;         // As per your Afterpay contract.
var afterpay_cbt_enabled = false;   // As per your Afterpay contract; change to true to display Cross-Border Trade artwork (for AU/NZ).
var afterpay_logo_theme = 'colour'; // Can be 'colour', 'black' or 'white'.

// Overrides:
var afterpay_product_selector = '.tt-price'; 


// Non-editable fields:
var afterpay_shop_currency = "AUD";
var afterpay_cart_currency = "AUD";
var afterpay_shop_money_format = "\u003cspan class=money\u003e${{amount}}\u003c\/span\u003e";
var afterpay_shop_permanent_domain = "preciousapril.myshopify.com";
var afterpay_theme_name = "PA2019";
var afterpay_product = null;
var afterpay_current_variant = null;
var afterpay_cart_total_price = 8485;
var afterpay_js_snippet_version = '1.0.3';
</script>
<script type="text/javascript" src="https://static.afterpay.com/shopify-afterpay-javascript.js"></script>
<!-- End Shopify-Afterpay JavaScript Snippet (v1.0.3) -->