> ## 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 Embed Customers' Points in their Profile?

> Display your customers' points balances in their profiles using our no-code embed feature, enhancing engagement and reward redemptions.

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

<Frame>
  <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/embed-points-profile-hero.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=7b92ee047ce5075307ce6f05fab1698b" alt="Embed customers points in their profile" width="3566" height="2262" data-path="images/product-docs/onsite-components/embed-points-profile-hero.png" />
</Frame>

Boost your customer loyalty program and increase reward redemptions by seamlessly displaying points balances within your customers' accounts. With Gameball, you can integrate point balances directly into your store's theme without writing a single line of code, keeping your customers informed and motivated to redeem their rewards.

***

## Prerequisites

<Steps>
  <Step title="Classic Customer Accounts">
    Ensure you're using Shopify's Classic customer accounts. The new customer accounts don't support third-party apps yet. However, when you are adding the "Account Balance" embedded block, it is only supported by the old account creation method (classic account). This is due to a limitation from Shopify, as they don't allow third-party apps like Gameball to edit the page with the new method.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/embed-points-classic-accounts.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=a172b2cd417e3451c3fb3dfb7d21e34a" alt="Classic customer accounts setting" width="1486" height="908" data-path="images/product-docs/onsite-components/embed-points-classic-accounts.png" />
    </Frame>
  </Step>

  <Step title="Updated Shopify Theme">
    Your theme must support app blocks. Without this, the Gameball block will not be visible 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-profile.gif?s=6b614ec6bae51e76e2dac6e711117c73" alt="Enable Gameball embed block" width="1152" height="648" data-path="images/product-docs/onsite-components/enable-gameball-embed-block-profile.gif" />
    </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/embed-points-customize.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=9892a260c0cbb938b617fbdc7a2977ca" alt="Navigate to Onsite customize" width="5524" height="2498" data-path="images/product-docs/onsite-components/embed-points-customize.png" />
    </Frame>
  </Step>

  <Step title="Open Theme Editor">
    You'll be redirected to Shopify's theme editor. If not, double-check the prerequisites.
  </Step>

  <Step title="Sign In">
    Sign in to your store through the theme editor to access the customer account template.
  </Step>

  <Step title="Add the App Block">
    In the left sidebar under **Template**, select **Add section > Apps**, and search for **"Points Balance"**.
  </Step>

  <Step title="Save">
    Select the **Points Balance** app block and click **Save**.

    <Frame>
      <img src="https://mintcdn.com/gameball/aJ_BSQbSOF-R8lP1/images/product-docs/onsite-components/embed-points-install.png?fit=max&auto=format&n=aJ_BSQbSOF-R8lP1&q=85&s=a1ab45069dc0f6d82d7430f78d72beb1" alt="Install points balance block" width="5860" height="2968" data-path="images/product-docs/onsite-components/embed-points-install.png" />
    </Frame>
  </Step>
</Steps>

***

## Customization

<AccordionGroup>
  <Accordion title="Style Customization" icon="palette">
    1. In the Shopify theme editor, click on the **Points Balance app block**.
    2. Customize the icon, text, colors, buttons, and overall style using the right-hand sidebar.
    3. Adjust the block's position in the template from the left sidebar.
    4. Click **Save**.
  </Accordion>

  <Accordion title="Content & Translation" icon="language">
    1. In the Gameball dashboard, go to **Widget > Content**.
    2. In the **Onsite** tab, edit the displayed text as needed and click **Save**.

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

***

## Important Notes

<Warning>
  The block will automatically hide from your store if:

  * The Gameball program is deactivated.
  * The customer is excluded from the program.
  * Your account is on a plan that doesn't support this feature.
</Warning>

***

## Common Questions

<AccordionGroup>
  <Accordion title="Can I display the Points Balance block elsewhere on my website?" icon="circle-question">
    Currently, the block can only be embedded on the customer account page.
  </Accordion>

  <Accordion title="Does this block work with Shopify's New Customer Accounts?" icon="circle-question">
    Gameball supports the "New customer account creation" in the following way: When a user logs in using Email/OTP and Gameball identifies their Shopify account, they are created as a member in Gameball (instead of a guest). This change resolves issues such as users not receiving rewards from birthdays, social campaigns, streaks, and similar benefits.

    However, if you are adding the "Account Balance" embedded block, it is only supported by the old account creation method. This is due to a limitation from Shopify, as they don't allow third-party apps like Gameball to edit the page with the new method.
  </Accordion>

  <Accordion title="Why am I seeing an error message after clicking &#x22;Customize&#x22;?" icon="circle-question">
    If you encounter a "There is a problem loading the page" message, review the prerequisites to ensure all conditions are met. If the issue persists, contact us at [support@gameball.co](mailto:support@gameball.co).
  </Accordion>

  <Accordion title="What happens if I downgrade to the Free plan?" icon="circle-question">
    The Points Balance block will automatically hide if your plan doesn't support this feature.
  </Accordion>
</AccordionGroup>
