sezzle / sezzle-merchant-resources

How Sezzle Works

How Sezzle Works is a dedicated page that merchants can add to their website to further promote Sezzle. Follow the below instructions to implement.

Note: Whenever the below instructions are updated, make sure to update the merchants docs as well

Merchant Integration

Shopify Process

To set up the page on Shopify, follow the steps below.

1. Log in to your Shopify Store
2. Navigate to "Online Store" "Themes"
3. On the theme you want to edit, select "Actions" and then "Edit Code"
4. Under the "Templates" folder, click "Add New Template", select template for "Page", template type "liquid", and name the page "Sezzle", then click Create Template
5. Select the theme that best fits your store from the tabs listed.
6. Copy the code and paste it under {{page.content}} on the Shopify page.
7. Save
8. Navigate to "Pages"
9. Add a new page, and give it a title - we recommend something like "How Sezzle Works" or "How to use Sezzle"
10. Under "Theme Template" (in the bottom-right), select "sezzle"
11. Save and view the page

You can now add the page to your navigation:

1. Go to "Online Store" "Navigation"
2. Select the menu where you would like the Sezzle link to appear (ex: Main menu)
3. Click "Add menu item"
4. Enter the text you wish to appear (ex: How Sezzle Works)
5. Click the second box, select "Pages" then the page you just created
6. Click Add
7. Click Save Menu

Other Platforms

To set up the page on any other platform, please work with your web developer and/or follow the steps below.

1. Create a new page in your theme
2. Copy and paste the code into your website's page
3. Click save and/or publish!

Code Snippet

Add your merchant_uuid, adjust theme and language as per your website's requirements.

• merchant_uuid is your merchant ID which is of the format: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx
• theme can either be light or dark.
• language can either be en , fr or es.

Insert the following code into your HTML file:

<div id="how-sezzle-works"></div>
  <script>
      const config = {
          merchant_uuid: "",
          theme: "",
          language: ""
      }
      const node = document.getElementById("how-sezzle-works");
      const iframe = document.createElement('iframe');
      iframe.src = "http://localhost:3000/index.html";
      iframe.height = '2000px';
      iframe.width = '100%';
      iframe.style.border = 'none';
      iframe.onload = function () {
          iframe.contentWindow.postMessage({
              key: "about_sezzle_config",
              ...config
          }, "*")
      };
      node.appendChild(iframe);
  </script>