November 9, 2021

How to integrate Zoorix with a Page Builder?

To integrate Zoorix with page builders such as PageFly or GemPages, you should use add custom html using the page builder editor and add the below one or few of the below snippets:

To place the widget in the middle of the product page, usually below the add to cart button, use the following snippet:

<div data-location="main" data-product-id="{{ product.id }}">
 <span zoorix-widget="all"></span>
</div>


To place the widget in the bottom of the product page, using the following snippet:


<div data-location="bottom" data-product-id="{{ product.id }}">
    <span zoorix-widget="all"></span>
</div>

To place the widget on the top of a full cart page, use the following snippet:

<div data-page="cart" data-location="top">
     <span zoorix-widget="all"></span>
</div>

To place the widget on the bottom of a full cart page, use the following snippet:

<div data-page="cart" data-location="bottom">
     <span zoorix-widget="all"></span>
</div>

Following are links about how to create a custom html snippets using the page builder:

PageFly:

- https://help.pagefly.io/manual/custom-code-editor

- https://help.pagefly.io/manual/html-liquid-element

GemPages

- https://help.gempages.net/articles/custom-code-liquid-element

Zoorix ‑ Upsell & Cross Sell
5.0 (+349 reviews)
Get Started FreeGet Zoorix Free