Articles on: Design and customizations

Manual Widget Placement

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


This document will help you change the placement of the widget in your theme if it is not automatically placed properly.


We are using the Google Chrome browser in this document.


  1. Go to your shopping cart


  • Choose the element around which you want to place the widget.


  • On the chosen element, right-click and then click inspect element.


Inspect element


  1. 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


  1. Navigate to Bird App Settings > Widget Placement



  1. Enter the Placement CSS selector


  • In case of class enter .cart__footer


  • in case of id enter #cart_footer



  1. Adjust widget position


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



  1. End result for the above configuration


Widget placed correctly

Updated on: 01/22/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!