Help! Afterpay Product Page

Excursionist
23 0 3

Hi all,

I have recently added code to my theme.liquid to display afterpay on my product pages.
Everything looks great, but I have a tiny issue... 

The afterpay sign has gone in-between the slashed price and the new sales price. I have provided screen shots of how it is now and how i'd like it to be.
If anyone can help, that'd be greatly appreciated. 

after.jpgThis is how I would like it to be.now.jpgThis is how it currently looks.


Code used for displaying afterpay on product page...

<!-- 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 = '#product-price-selector';
// var afterpay_cart_integration_enabled = true;
// var afterpay_cart_static_selector = '#cart-subtotal-selector';

// Non-editable fields:
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.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) -->

0 Likes
Excursionist
23 0 3

Here is my website HTML if that helps. 
www.luxless.co.nz

0 Likes
Shopify Partner
236 57 66

Hi @OldDogNZ,

 

I may be able to help you with this. Will you post the entire contents of your product template file - the one where you inserted the changes?

 

Thank you.

Brian | Shopify Partner | Ecommerce Consultant
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution  
 - Need further assistance? Visit www.BrianAtWork.com

0 Likes
Excursionist
23 0 3

Hi @BrianAtWork 

I didn't actually insert the code into the product template file. I added it to my theme.liquid.

I will post my product template for you though. 

{% include 'product-template',
description_style: section.settings.description_style,
image_position: section.settings.image_position,
image_container_width: section.settings.image_size,
section_id: product.id,
social: section.settings.social_enable,
thumbnail_position: section.settings.thumbnail_position
%}

{% if settings.enable_product_reviews and settings.reviews_layout == 'full' %}
<hr id="Reviews-{{ product.id }}" class="hr--large">
<div class="index-section index-section--small product-reviews product-reviews--full">
<div class="page-width">
<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>
</div>
</div>
{% endif %}

{% schema %}
{
"name": "Product pages",
"settings": [
{
"type": "select",
"id": "image_position",
"label": "Images position",
"default": "right",
"options": [
{
"value": "left",
"label": "Left"
},
{
"value": "right",
"label": "Right"
}
]
},
{
"type": "select",
"id": "image_size",
"label": "Image size",
"default": "medium",
"options": [
{
"value": "small",
"label": "Small"
},
{
"value": "medium",
"label": "Medium"
},
{
"value": "large",
"label": "Large"
}
]
},
{
"type": "select",
"id": "thumbnail_position",
"label": "Thumbnail position",
"default": "beside",
"options": [
{
"value": "beside",
"label": "Next to image"
},
{
"value": "below",
"label": "Below image"
}
]
},
{
"type": "select",
"id": "description_style",
"label": "Description position",
"default": "default",
"options": [
{
"value": "default",
"label": "Next to images"
},
{
"value": "full",
"label": "Below images"
}
]
},
{
"type": "checkbox",
"id": "social_enable",
"label": "Enable social sharing",
"default": true
}
]
}
{% endschema %}

0 Likes
Highlighted
Excursionist
23 0 3

Bump

0 Likes
Shopify Partner
236 57 66

Hi @OldDogNZ, I have received your private message and am sending you a reply now.

Brian | Shopify Partner | Ecommerce Consultant
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution  
 - Need further assistance? Visit www.BrianAtWork.com

0 Likes