This page covers the scripts which can be useful for a proficient management of Tabby Payment App and UI components.

The following instruction is applicable for the scenario with already installed snippets.

​
”No Price” Snippet Adding

No price snippet

Use this general Promo snippet without prices and currencies if you have some custom theme and face any issues with the standard snippet showing.

  1. In Shopify Admin panel click “Online Store” -> “Themes”;
  2. At the Themes page click ” … ” -> “Edit code”;
  3. In the navigation menu on your left click the “Snippets” folder and click “tabby-installments.liquid”;
  4. Replace the old code with the following and click “Save”:
    Do not forget to check the variables in the code (such as publicKey and merchantCode)
{%- liquid
  assign locale = localization.language.iso_code
-%}
<div id="TabbyPromo"></div>
<script>
  (function() {
    const script = document.createElement('script');
    script.src = 'https://checkout.tabby.ai/tabby-promo.js';
    script.async = true;
    script.onload = () => {
      const locale = '{{ locale }}';

      new TabbyPromo({
        selector: '#TabbyPromo',
        price: '1',
        locale,
        installmentsCount: '9',
        publicKey: 'yourApiKey', // specify your apiKey it should be a string
        merchantCode: 'yourMerchantCode', // enum: "default", "ksa", "KW"
      }); 
    };
    document.body.appendChild(script);
  })();
</script>
<style>
  #TabbyPromo div:empty, #TabbyDialogContainer div:empty {
    display: block;
  }
</style>
  1. Make sure the promo snippet appears in the required place at the store front.

Was this page helpful?

Shopify Plugin InstallationSalla