Articles on: Design and customizations

Manual Widget Placement

This is somewhat technical. Feel free to ask us for help if you get stuck

If the widget is not automatically placed properly in your theme, this document will help you change the placement.
We are using Google chrome browser in this document.


Go to you shopping cart
Choose the element around which you want to place the widget.
On the chosen element, do a right click and then click inspect element.

Inspect element


Copy CSS Selector
Hover over the target element. It should be highlighted as shown below.
Now you can copy the class of that element and use that as a CSS selector as shown below

Copy the CSS selector



Go to widget placement setting in our app.
Click on Settings in left navigation
Then click on widget placement
Widget placement settings


Enter the Placement CSS selector
In case of class enter .cart__footer
in case of id enter #cart_footer

Enter CSS Selector

Adjust widget position
Optionally you can use this option to adjust the placement relative to the target element configured above.

Position relative to the target element

End result for the above configuration


Widget placed correctly

Updated on: 12/04/2023

Was this article helpful?

Share your feedback

Cancel

Thank you!