Samples of Custom Code for Shopify Product Pages

Samples of Custom Code for Shopify Product Pages

{% if product.tags contains 'TAG' %}

[PARTIAL.LY SHOPIFY SCRIPT FROM INTEGRATION TOOL GOES HERE]

{% endif %}

{% assign hasPaymentPlan = false %}
{% assign paymentPlanOffer = false %}
        
{% if product.tags contains 'TAG1' %}
{% assign paymentPlanOffer = 'OFFER1' %}
{% assign hasPaymentPlan = true %}

{% elsif product.tags contains 'TAG2' %}
{% assign paymentPlanOffer = 'OFFER2' %}
{% assign hasPaymentPlan = true %}

{% endif %}

{% if hasPaymentPlan %}

<div id="partiallyProductButtonContainer"></div>
<script>
document.partiallyButtonConfig = {
     offer: '{{paymentPlanOffer}}',
     returnUrl: '{{shop.url}}/cart',
     returnConfirmedUrl: '{{shop.url}}/cart/clear',

     cssButton: true,
     cssButtonText: 'Purchase with',

     cssButtonShowLogo: true,
     cssButtonLogoType: 'full',
     cssButtonLogoPlacement: 'after',

     renderSelector: '#partiallyProductButtonContainer',

    shopifyProduct: {{product | json}},
    shopifyVariant: {{product.selected_or_first_available_variant | json}}
   };
   (function() {
     var script = document.createElement('script');
     script.type = 'text/javascript';
     script.src = 'https://partial.ly/js/partially-checkout-button.js';
     script.async = true;
     document.head.appendChild(script);
   })();
</script>
 
{% endif %}

*You must replace the offer line within the Partial.ly script with:

offer: '{{paymentPlanOffer}}',

{% unless product.tags contains 'TAG' %}

[PARTIAL.LY SHOPIFY SCRIPT FROM INTEGRATION TOOL GOES HERE]

{% endunless %}

{% assign hasPaymentPlan = false %}
{% assign paymentPlanOffer = false %}
        
{% if product.tags contains 'TAG1' %}
{% assign paymentPlanOffer = 'OFFER1' %}
{% assign hasPaymentPlan = true %}

{% elsif product.tags contains 'TAG2' %}
{% assign paymentPlanOffer = 'OFFER2' %}
{% assign hasPaymentPlan = true %}

{% endif %}

{% if hasPaymentPlan %}

<div id="partiallyProductButtonContainer"></div>
<script>
document.partiallyButtonConfig = {
     offer: '{{paymentPlanOffer}}',
     returnUrl: '{{shop.url}}/cart',
     returnConfirmedUrl: '{{shop.url}}/cart/clear',

     cssButton: true,
     cssButtonText: 'Purchase with',

     cssButtonShowLogo: true,
     cssButtonLogoType: 'full',
     cssButtonLogoPlacement: 'after',

     renderSelector: '#partiallyProductButtonContainer',

    shopifyProduct: {{product | json}},
    shopifyVariant: {{product.selected_or_first_available_variant | json}}
   };
   (function() {
     var script = document.createElement('script');
     script.type = 'text/javascript';
     script.src = 'https://partial.ly/js/partially-checkout-button.js';
     script.async = true;
     document.head.appendChild(script);
   })();
</script>

{% else %}

<div id="partiallyProductButtonContainer"></div>
<script>
document.partiallyButtonConfig = {
     offer: 'OFFER-ID-FOR-EVERYTHING-ELSE',
     returnUrl: '{{shop.url}}/cart',
     returnConfirmedUrl: '{{shop.url}}/cart/clear',

     cssButton: true,
     cssButtonText: 'Purchase with',

     cssButtonShowLogo: true,
     cssButtonLogoType: 'full',
     cssButtonLogoPlacement: 'after',

     renderSelector: '#partiallyProductButtonContainer',

    shopifyProduct: {{product | json}},
    shopifyVariant: {{product.selected_or_first_available_variant | json}}
   };
   (function() {
     var script = document.createElement('script');
     script.type = 'text/javascript';
     script.src = 'https://partial.ly/js/partially-checkout-button.js';
     script.async = true;
     document.head.appendChild(script);
   })();
</script>
 
{% endif %}


*You must replace the offer line within the first Partial.ly script with:

offer: '{{paymentPlanOffer}}',

{% if product.selected_or_first_available_variant.price > 10000 %}

[PARTIAL.LY SHOPIFY SCRIPT FROM INTEGRATION TOOL GOES HERE]

{% endif %}

{% if product.selected_or_first_available_variant.price >= 40000 
    and product.selected_or_first_available_variant.price 

{% if product.selected_or_first_available_variant.price >= 40000 
    and product.tags contains 'TAG' %}

[PARTIAL.LY SHOPIFY SCRIPT FROM INTEGRATION TOOL GOES HERE]

{% endif %}


<div id="partiallyProductButtonContainer"></div>
<script src="https://partial.ly/js/partially-checkout-button.js"></script>           
<script>
var basePartiallyConfig = {
     returnUrl: '{{shop.url}}/cart',
     returnConfirmedUrl: '{{shop.url}}/cart/clear',

     cssButton: true,
     cssButtonText: 'BUTTON-TEXT',
     cssButtonShowLogo: true,
     cssButtonLogoType: 'glyph',
     cssButtonLogoPlacement: 'after',
     cssButtonCustomBg: '#6623e9',
  
     renderSelector: '#partiallyProductButtonContainer',
    shopifyProduct: {{product | json}},
    shopifyVariant: {{product.selected_or_first_available_variant | json}}
   };
basePartiallyConfig.offer = 'OFFER-ID-1';
var button1 = new PartiallyButton(basePartiallyConfig);
button1.init();
</script>
            
                       
<div id="partiallyProductButtonContainer2"></div>
<script src="https://partial.ly/js/partially-checkout-button.js"></script>           
<script>
var basePartiallyConfig = {
     returnUrl: '{{shop.url}}/cart',
     returnConfirmedUrl: '{{shop.url}}/cart/clear',

     cssButton: true,
     cssButtonText: 'BUTTON-TEXT',
     cssButtonShowLogo: true,
     cssButtonLogoType: 'glyph',
     cssButtonLogoPlacement: 'after',
     cssButtonCustomBg: '#6623e9',
  
     renderSelector: '#partiallyProductButtonContainer2',
    shopifyProduct: {{product | json}},
    shopifyVariant: {{product.selected_or_first_available_variant | json}}
   };
basePartiallyConfig.offer = 'OFFER-ID-2';
basePartiallyConfig.renderSelector = '#partiallyProductButtonContainer2';
var button2 = new PartiallyButton(basePartiallyConfig);
button2.init();
</script> 

Contact our support team at support@partial.ly.

If you need code for your cart page, please see the following article: Samples of Custom Code for Shopify Cart Page