Bird Pickup & Delivery Bird Pickup & Delivery
Articles in FAQs
On this page
FAQs

How do I control the widget's placement?

B
Written by Bird Pickup & Delivery
Updated October 7, 2026

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 page
  3. Select a checkout profile, then click Install widget now
  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.

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 page
  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 Settings > Developer (Developer Settings)
  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 Widget position dropdown:
    • Before the element: Places widget before the selected element
    • Inside the element as first element: Places widget as the first child element
    • Inside the element as last element: 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

Was this article helpful?