How do I control the widget's placement (e.g., move it from the cart to the checkout page)?

You can control where the Bird Pickup & Delivery widget appears on your store, but your options depend on your Shopify plan and theme setup.

Checkout Page Placement (Shopify Plus Only)

Important: Checkout page placement is only available for Shopify Plus merchants. Due to Shopify's platform limitations.

Steps for Shopify Plus Users:

1. Go to your Bird app settings
2. Navigate to Widget Placement > Checkout Placement
3. Enable the checkout placement option
4. The widget will now appear on your checkout page instead of the cart

Related: For detailed Shopify Plus integration steps, see our Shopify Plus checkout integration guide.

Cart Page Placement (All Plans)

If you don't have Shopify Plus, you can customize widget placement on your cart page:

Automatic Theme-Based Placement

1. Go to Bird Settings > Widget Placement > Cart Placement
2. Select your theme from the dropdown menu
3. The widget will automatically position itself based on your theme's layout

Manual CSS Placement (Advanced)

For precise control over widget positioning:

1. Go to Bird Settings > Widget Placement
2. Scroll to Manual Widget Placement
3. Enter the CSS selector of the element where you want to place the widget

• Example: .cart__checkout-button to place above the checkout button

4. Select your preferred placement from the dropdown:

• Before the element: Places widget before the selected element
• Inside element (first): Places widget as the first child element
• Inside element (last): Places widget as the last child element
• After the element: Places widget after the selected element

Manual Code Integration

If CSS placement doesn't work with your theme:

1. Access your theme's code editor
2. Open your cart liquid file (usually cart.liquid or cart-drawer.liquid)
3. Add <div id="birdchime-slots-box"></div> where you want the widget to appear

Updated on: 10/29/2025