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

# Setup app blocks for Online Store 2.0 themes

> Configure app blocks for modern Shopify themes

App blocks are the recommended way to add Assortion widgets to your Online Store 2.0 theme. They provide a clean, code-free installation that's easy to manage.

<Info>
  App blocks are currently only supported on product pages. Support for other page types is coming soon.
</Info>

## Step-by-Step Installation

Follow these steps to add app blocks to your theme:

<Steps>
  <Step title="Access your store">
    Log in to your Shopify store admin panel
  </Step>

  <Step title="Navigate to theme editor">
    Go to **Online Store** in your Shopify admin
  </Step>

  <Step title="Customize your theme">
    Click the **Customize** button to open the theme editor
  </Step>

  <Step title="Select product template">
    Navigate to **Products** → **Default product** from the page selector
  </Step>

  <Step title="Find the right section">
    Locate the section where you want to add the app block (e.g., near the add to cart button)
  </Step>

  <Step title="Add the app block">
    Click **Add block** or **Add section** in your chosen location
  </Step>

  <Step title="Select Assortion app">
    In the **APPS** section, choose one of these app blocks:

    * **FBT Bundle** (Frequently Bought Together)
    * **Product Add-ons**
    * **Volume Discount**
  </Step>

  <Step title="Position the block">
    Drag and drop the app block to your desired position
  </Step>

  <Step title="Save your changes">
    Click **Save** and refresh your store pages to see the changes
  </Step>
</Steps>

## Available App Blocks

<CardGroup cols={3}>
  <Card icon="boxes-stacked" title="FBT Bundle">
    Display frequently bought together product recommendations
  </Card>

  <Card icon="plus-circle" title="Product Add-ons">
    Show complementary products as add-ons
  </Card>

  <Card icon="percent" title="Volume Discount">
    Display tiered pricing for bulk purchases
  </Card>
</CardGroup>

## Managing App Blocks

### To Remove an App Block

1. Click on the app block in the theme editor
2. Select **Remove block** from the options
3. Save your changes

### Benefits of App Blocks

<AccordionGroup>
  <Accordion title="No code modifications">
    App blocks don't modify your theme's code, keeping it clean and maintainable
  </Accordion>

  <Accordion title="Easy management">
    Add, remove, or reposition blocks without touching any code
  </Accordion>

  <Accordion title="Automatic cleanup">
    Blocks are automatically removed when the app is uninstalled
  </Accordion>

  <Accordion title="Theme updates friendly">
    Your customizations are preserved when updating your theme
  </Accordion>
</AccordionGroup>

## Compatibility

<Warning>
  App blocks are only available for **Online Store 2.0** themes. If you're using a vintage theme, you'll need to use [alternative installation methods](/getting-started/installing-widgets).
</Warning>

## Need Help?

Having trouble setting up app blocks? Contact our support team at [support@assortion.com](mailto:support@assortion.com) for assistance.