Here are the 5 simple steps to integrate Dealeasy widget into Ecomposer product page. The below steps only apply to the following widgets:
- Volume discount (Table)
- Volume discount (Quantity selector)
- Mix & match bundle
- Related bundles
1. Navigate to the respective product page template in Ecomposer builder for which you have created the offer in the Dealeasy app.
2. Choose “Extensions” and then search for “Dealeasy”. You can see the Dealeasy app extension named “Dealeasy Volume Discount Bundle”. Please click on it.
3. You will get a pop up. Click on “Install now”.
4. Now click on “Extensions” again. Under the “Extensions” tab, you will see the installed Dealeasy app element. Simply click and drag it to the desired position on the product page.
5. First click on “Dealeasy Volume Discount Bundle”. Then you will see a menu on the right side. Now click on the widget type and select the widget you want from the drop-down. For this example, I am using “Table widget” for Volume Discount (Table) discount.
Also, once you choose the widget that you want, click on “Publish” and complete the remaining steps to publish the changes to the page.
Once you complete these steps, the widget will be seen in the product page.
The below steps have to be done for the following widgets:
- Cart progress bar
- Gift with product
- BOGO
2. After completing above Step 1 (selecting the appropriate product page template in EComposer), click on “Elements”. Then search for “Code” and drag and drop the “Code” element onto the product page where you want the Dealeasy widget to appear.
3. Click the “Code” block you added, then select the “Custom code” area on the right. This will open a pop-up where you can paste the code.
4. These are the custom codes for the respective widget types. Add the required codes in the custom code section and click on “Save”.
Cart progress bar
<div id="lb-cart-progress-bar"></div>Gift with product
<div id="lb-gift-with-product"></div>BOGO
<div id="lb-bogo-banner"></div>Here, I have used “BOGO” as an example.
5. Click on “Publish” and complete the remaining steps to publish the changes to the page.
Once you complete these steps, the widget will be seen in the product page.
But, if you don’t see the widget in the storefront, follow the below steps.
- Go to the “Customize” section of the app and click on “Edit” of the respective widget that you have chosen. Here, I click on “Edit” of “Volume Discount Table”.
2. Make sure that the “Using theme editor” option is chosen.
If you need further assistance, please contact our customer support for help.