Difference between revisions of "Melbourne ecommerce theme - Adding Afterpay snippets"

From Spiffy Stores Knowledge Base

Line 1: Line 1:
 
==1.  Product page==
 
==1.  Product page==
Paste the code provided below above this line in your product.liquid file...
+
Copy the code provided below and paste it BEFORE this line in your product.liquid file...
 
<pre>{% if settings.yotpo_reviews and settings.yotpo_appkey != blank %}{% include "yotpo_stars" %}{% endif %}</pre>
 
<pre>{% if settings.yotpo_reviews and settings.yotpo_appkey != blank %}{% include "yotpo_stars" %}{% endif %}</pre>
  
Line 14: Line 14:
 
{% endif %}
 
{% endif %}
 
</pre>
 
</pre>
 +
 +
Once you have saved the file, preview your product page to ensure it's displaying correctly.
  
 
==2.  Cart Page==
 
==2.  Cart Page==
Paste the code provided below above this line in your cart.liquid file...
+
Copy the code provided below and paste it BEFORE this line in your cart.liquid file...
<pre>{% include 'payment_methods' %}{% endif %}</pre>
+
<pre>{% include 'payment_methods' %}</pre>
  
 
You may need to alter the minimum and maximum amounts in accordance with Afterpay's requirements.
 
You may need to alter the minimum and maximum amounts in accordance with Afterpay's requirements.
Line 30: Line 32:
 
   {% endif %}{% endif %}
 
   {% endif %}{% endif %}
 
</pre>
 
</pre>
 +
 +
Once you have saved the file, preview your cart page to ensure it's displaying correctly.
 +
 +
==3.  Payment methods in your footer==
 +
Copy the code provided below and paste it AFTER this line in your cart.liquid file...
 +
<pre>{% endfor %}</pre>
 +
 +
<pre>
 +
<li>
 +
  <img width="50" src="/global/payment_types/afterpay.svg" alt="AfterPay" />
 +
</li>
 +
</pre>
 +
 +
Once you have saved the file, preview your store to ensure it's displaying correctly.

Revision as of 12:12, 1 August 2018

1. Product page

Copy the code provided below and paste it BEFORE this line in your product.liquid file...

{% if settings.yotpo_reviews and settings.yotpo_appkey != blank %}{% include "yotpo_stars" %}{% endif %}

You may need to alter the minimum product price in accordance with Afterpay's requirements.

{% if product.price_min < 1000 %}
  <div style="margin-top:15px; margin-bottom:15px;">
    <p><img src="{{ 'afterpay/ap-01.jpg' | global_asset_url }}" style="width: 100px;"><a href="https://static.secure-afterpay.com.au/banner-large.png" id="afterpay-popup" class="image-link"> More info</a>.</p>
    <p>Make 4 interest-free payments of <strong><span id="afterpay-price">{{ product.price | divided_by: 4 | money }}</strong> fortnightly and receive your order now.</p>
    <p style="font-color: #CCC; font-size: 11px;">*Minimum order amount of $100, and a maximum of $1000 applies. <a href="https://www.afterpay.com/en-AU/terms-of-service" id="afterpay-terms-popup" class="" target="_blank"> Afterpay Terms</a></p>
   </div>
{% endif %}

Once you have saved the file, preview your product page to ensure it's displaying correctly.

2. Cart Page

Copy the code provided below and paste it BEFORE this line in your cart.liquid file...

{% include 'payment_methods' %}

You may need to alter the minimum and maximum amounts in accordance with Afterpay's requirements.

{% if cart.total_price > 100 %}{% if cart.total_price < 1000 %}
    <div style="display: block; margin-top:15px; margin-bottom:15px;">
      <p><img src="{{ 'afterpay/ap-01.jpg' | global_asset_url }}" style="width: 100px;"><a href="https://static.secure-afterpay.com.au/banner-large.png" id="afterpay-popup" class="image-link"> More info</a></p>
      <p>Make 4 interest-free payments of <strong><span id="afterpay-price">{{ cart.total_price | divided_by: 4 | money }}</strong> fortnightly and receive your order now.</p>
      <p style="font-color: #CCC; font-size: 11px;">*Minimum order amount of $100, and a maximum of $1000 applies.<a href="https://www.afterpay.com/en-AU/terms-of-service" id="afterpay-terms-popup" class="" target="_blank"> Afterpay Terms</a></p>
    </div>
  {% endif %}{% endif %}

Once you have saved the file, preview your cart page to ensure it's displaying correctly.

3. Payment methods in your footer

Copy the code provided below and paste it AFTER this line in your cart.liquid file...

{% endfor %}
<li>
  <img width="50" src="/global/payment_types/afterpay.svg" alt="AfterPay" />
</li>

Once you have saved the file, preview your store to ensure it's displaying correctly.