> ## Documentation Index
> Fetch the complete documentation index at: https://docs.gameball.co/llms.txt
> Use this file to discover all available pages before exploring further.

# How Do I Display Redemption Options at Checkout (Drop-menu)?

> Enhance your customers' checkout experience by offering a way to redeem loyalty rewards with Gameball's Redemption Options Dropdown.

| **Platform** | **Plan**   |
| ------------ | ---------- |
| Shopify      | Pro & Guru |

<Note>
  Checkout app blocks are available for **Shopify Plus** customers only.
</Note>

<Frame>
  <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/checkout-redeem-dropdown-hero.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=19e09f821496cfb48810c6efe39a29c3" alt="Display redemption options at checkout" width="3828" height="2464" data-path="images/product-docs/onsite-components/checkout-redeem-dropdown-hero.png" />
</Frame>

Elevate your customers' checkout experience with Gameball's Redemption Options Dropdown. This feature simplifies the process of redeeming loyalty rewards, enabling customers to explore available options, choose their preferred reward, and apply it seamlessly to their purchase.

**Benefits:**

<CardGroup cols={2}>
  <Card title="Boost Reward Usage" icon="arrow-trend-up">
    Offering multiple redemption options at checkout motivates customers to redeem their points, increasing overall utilization.
  </Card>

  <Card title="Increase Customer Satisfaction" icon="face-smile">
    Giving customers the flexibility to choose rewards that fit their preferences enhances their satisfaction and loyalty.
  </Card>
</CardGroup>

***

## Prerequisites

<Steps>
  <Step title="Shopify Plus">
    This feature is exclusively available to merchants on the **Shopify Plus** plan.
  </Step>

  <Step title="Updated Shopify Theme">
    Your Shopify theme must support app blocks. Without this, the option to add the Gameball block won't appear in the editor. [Learn more](https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/apps).
  </Step>

  <Step title="Enable Gameball Embed Block">
    Go to the **Theme Editor** in your Shopify admin. Select **App Embeds** from the left menu, search for "Gameball," and toggle it on.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/enable-gameball-embed-block.gif?s=7946f4df027c0b43173af2917a38dcc4" alt="Enable Gameball embed block" width="1152" height="648" data-path="images/product-docs/onsite-components/enable-gameball-embed-block.gif" />
    </Frame>
  </Step>

  <Step title="Activate the &#x22;Redeem Points&#x22; Program">
    Ensure that at least one redemption option is available, including flat rate rewards if required.

    <Frame>
      <img src="https://mintcdn.com/gameball/0izDrUbnPHPlIUcS/images/product-docs/onsite-components/activate-redeem-program.png?fit=max&auto=format&n=0izDrUbnPHPlIUcS&q=85&s=6a005001f5430a8a0be87bd0155b0ee0" alt="Activate redeem points program" width="5860" height="2840" data-path="images/product-docs/onsite-components/activate-redeem-program.png" />
    </Frame>
  </Step>

  <Step title="Activate Gameball Program">
    In the Gameball dashboard, make sure the toggle at the top-right is activated. Once this is enabled, you'll be able to add the Gameball block.

    <Frame>
      <img src="https://mintcdn.com/gameball/0izDrUbnPHPlIUcS/images/product-docs/onsite-components/activate-gameball-program.png?fit=max&auto=format&n=0izDrUbnPHPlIUcS&q=85&s=fb418260057f8bc60cf29d45d2f040e4" alt="Activate Gameball program" width="5860" height="3494" data-path="images/product-docs/onsite-components/activate-gameball-program.png" />
    </Frame>
  </Step>
</Steps>

***

## How to Install the Block

<Steps>
  <Step title="Navigate to Onsite">
    In Gameball, navigate to **Onsite**, click **Customize**.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/checkout-redeem-dropdown-customize.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=7aacd461be90281df57195ece360fc7a" alt="Navigate to Onsite customize" width="5524" height="2700" data-path="images/product-docs/onsite-components/checkout-redeem-dropdown-customize.png" />
    </Frame>
  </Step>

  <Step title="Open Theme Editor">
    You'll be redirected to Shopify's Theme Editor.
  </Step>

  <Step title="Add the App Block">
    In the editor, navigate to **Add App Block > Apps** and search for **"Checkout redeem dropdown menu"**.
  </Step>

  <Step title="Save">
    Add the **Checkout redeem dropdown menu** app block to the checkout page and click **Save**.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/checkout-redeem-dropdown-install.gif?s=5bbc4b16ae7f79f920a521128e5a7427" alt="Install checkout redeem dropdown menu block" width="1152" height="648" data-path="images/product-docs/onsite-components/checkout-redeem-dropdown-install.gif" />
    </Frame>
  </Step>
</Steps>

***

## How It Works

<Tabs>
  <Tab title="Guest (Not Logged-In) Customers">
    For customers who are not logged in, the extension will prompt them to sign in to access their points balance and redeem rewards. Without logging in, you won't be able to view or use your points at checkout.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/checkout-redeem-dropdown-guest.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=253af82dfcfc062773f672234b730183" alt="Guest customer redeem dropdown view" width="1020" height="600" data-path="images/product-docs/onsite-components/checkout-redeem-dropdown-guest.png" />
    </Frame>
  </Tab>

  <Tab title="Logged-In Customers">
    When a logged-in customer reaches the checkout page, the extension will automatically display, allowing them to view their points balance and choose a reward in exchange for points.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/checkout-redeem-dropdown-logged-in.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=064aa3273b6b69566c676889ef8af351" alt="Logged-in customer redeem dropdown view" width="1108" height="908" data-path="images/product-docs/onsite-components/checkout-redeem-dropdown-logged-in.png" />
    </Frame>

    After selecting a reward and entering the desired number of points, the customer clicks **'Redeem'**. Gameball will then deduct the points from the customer's balance and automatically generate a discount code, which will be applied to the order.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/checkout-redeem-dropdown-applied.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=128ff38dc448807d9775fb4ba07d6346" alt="Points redeemed via dropdown" width="1046" height="1054" data-path="images/product-docs/onsite-components/checkout-redeem-dropdown-applied.png" />
    </Frame>

    If the discount code cannot be applied due to specific conditions (e.g., minimum order value not met, restrictions on combining discounts, or other advanced rules), an error message will appear, explaining why the coupon cannot be used with the current cart.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/checkout-redeem-dropdown-error.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=078e3eef2c9298e2d985740bfc91d241" alt="Redeem dropdown error message" width="1062" height="1186" data-path="images/product-docs/onsite-components/checkout-redeem-dropdown-error.png" />
    </Frame>
  </Tab>
</Tabs>

***

## Customization

<AccordionGroup>
  <Accordion title="Style Customization" icon="palette">
    The checkout extensions have no style customization options. However, you can customize its position by simply dragging and dropping it to your desired location on the checkout page.
  </Accordion>

  <Accordion title="Content & Translation" icon="language">
    In the Gameball Dashboard, go to **Widget > Content**. Under the **Onsite** tab, edit the text and customize it for supported languages.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/onsite-content-translation.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=465d9dc80a716be565f91505296e5f34" alt="Content and translation settings" width="5860" height="3218" data-path="images/product-docs/onsite-components/onsite-content-translation.png" />
    </Frame>
  </Accordion>
</AccordionGroup>

***

## Important Notes

<Warning>
  The Redemption Options Dropdown will automatically hide if:

  * The rewards program is deactivated.
  * The customer is excluded from the program.
  * The account is not on a supported plan.
  * No redemption rules are configured.
</Warning>

***

## Frequently Asked Questions

<AccordionGroup>
  <Accordion title="What happens if the customer redeems points but doesn't use the coupon?" icon="circle-question">
    If the customer redeems points but does not use the generated coupon immediately, they can access the coupon later through the widget. The coupon will remain available for future use, but it cannot be reverted to points.
  </Accordion>

  <Accordion title="What happens if I downgrade my plan?" icon="circle-question">
    The dropdown will automatically hide if your plan no longer supports the feature.
  </Accordion>
</AccordionGroup>

***

## Related Articles

<CardGroup cols={2}>
  <Card title="Embed Points in Customer Profile" icon="user" href="/product-documentation/onsite-components/general-components/embed-points-in-customer-profile">
    Display customers' points balances in their profiles.
  </Card>

  <Card title="Display Potential Points on Product Pages" icon="tag" href="/product-documentation/onsite-components/general-components/display-potential-points-on-product-pages">
    Show potential points directly on product pages.
  </Card>
</CardGroup>
