> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://easybundles-help.skailama.app/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# [New] Adding bundle Upsell Widgets or Buttons  to Product Pages

${youtube}[](jSBHg3i8Bo8)is article details the mechanics of enabling, configuring, and publishing a bundle upsell widget on product pages. It defines the logic for widget display types, UI customizations, page targeting, and exact on-page placement.

**1. Widget Enablement**
* **Action:** Navigate to the **publish section** and locate the **product page widget**.
* **Logic:** IF the user switches the toggle to ON, THEN the widget becomes active for configuration and will preview its appearance.

**2. Display Type Selection** The system requires the selection of a visual format for the widget.
* **Option A:** **Offer block** (A larger container allowing rich customization).
* **Option B:** **Offer button** (A simple button element).

**3. Widget Customization** IF the **offer block** display type is selected, THEN the following UI elements can be customized:
* Offer block title
* Offer block description
* CTA (Call to Action) button text/styling
* Image

**4. Page Targeting Constraints** The system determines which pages display the widget based on specific targeting rules. The user must select one of the following conditions:
* **Condition A:** Show on product pages of **all products in the bundle**.
* **Condition B:** Show on **specific product pages**.
* **Condition C:** Show on **specific collections**.

**5. On-Page Placement Location** The system dictates where the widget renders on the selected product pages.
* **Default Logic:** IF no custom placement is defined, THEN the widget renders directly under the **add to cart** button.
* **Custom Logic:** IF a custom location is required, THEN the user must click **place offer block**.
    * *Trigger:* Clicking **place offer block** launches the store's theme editor.
    * *Action:* The user manually defines the block location within the theme editor architecture.

**6. Publishing and Activation**
* **Step 1:** Click **save** to store the configuration.
* **Step 2:** Verify that the widget renders correctly on the live/preview product pages.
* **Step 3:** Click **confirm**.
* **Logic:** IF the user clicks **confirm**, THEN the bundle state changes to "live" and is visible to store customers.

### Constraints & Edge Cases
* **Activation Prerequisite:** The widget and bundle are strictly inactive on the live storefront until the user completes the entire sequence of **save** -> verify -> **confirm**. Bypassing the **confirm** button will result in the bundle remaining hidden from customers.
* **Custom Placement Dependency:** The app cannot automatically place the widget in non-default locations. IF a placement other than "under the add to cart button" is desired, the user *must* interact with the external theme editor via the **place offer block** button.
* **Display Type Limitations:** The transcript specifies that titles, descriptions, and images can be added when configuring the **offer block**. IF the **offer button** is selected, these rich formatting options may be hidden or unsupported.