For the complete documentation index, see llms.txt. This page is also available as Markdown.

Add the app block

Use the App Block to place the option widget exactly where you want it in your product template, instead of letting the app position it automatically.

The App Block is an optional second part of the theme integration:

  • App Embed controls whether the app runs on your storefront.

  • App Block controls where the widget appears.

You can simply drag the App Block to your preferred position in the product template, just like any other theme block.

App embed vs app block

Piece
Required?
What it does

App embed

Yes

Loads the app on your storefront. Without it, the app won’t work. It also places the widget automatically based on the position selected in Settings → General.

App block

No

Lets you place the widget inside a specific section of your theme. The widget appears exactly where the block is placed, giving you direct control over its position without using a CSS selector.

When to use the App Block

Use the App Block when:

  • Automatic placement puts the widget in an inconvenient location, and none of the built-in positions work.

  • You want to place the widget between two specific blocks — for example, below the variant picker but above a trust badge.

  • You want to display the options on a Featured product section on your homepage or another page.

  • You prefer not to maintain a CSS selector in the app settings.

Stick with automatic placement if one of the built-in positions already places the widget where you want it. See Widget placement.

Add it to your product template

1

Open the Theme Customize editor

On the app’s dashboard, select Add app block on the Active app blocks card. This opens the product template with the app block ready to add.

You can also find the same shortcut under Widget placement in Settings > General.

Alternatively, open the theme editor from Shopify: Online Store > Themes > Customize, then use the template dropdown to select Products > Default product.

The Active app blocks card on the dashboard with the Add app block button
The dashboard counts your app blocks and links straight to adding one.
2

Add the App block

In the left sidebar, find the product information section — its name varies by theme, often Product information or Product — and select Add block. Under the Apps tab, choose Globo Product Options.

The theme editor sidebar with Add block open and the app listed under the Apps tab
Add block in the product information section, then choose the app under the Apps tab.
3

Drag it to the expected position

The block appears in the section's block list. Drag it up or down until it sits where you want the widget. The preview redraws as you move it, so you can judge the position directly.

The app block being dragged within a section's block list in the theme editor
Drag the block up or down until the widget sits where you want it.
4

Save, then check

Select Save in the theme editor. Open a product page on your storefront to see the widget in its new position.

Options on a home page or a regular page

Options can also appear inside a Featured product section outside the product template.

In the theme editor, open the page where you want the options to appear. If there isn’t a Featured product section, add one. Then select Add block > Globo Product Options inside the section.

The block’s Product setting is automatically populated from the section, but make sure it points to the product you expect. Then select Save.

Notes

  • The product template and Featured product sections are the appropriate places to use the block. The block needs a product in context to determine which option sets apply.

  • Adding a block does not disable automatic placement. If the widget appears twice, remove the block or change Widget placement so the automatic placement no longer applies.

  • App blocks are saved with the theme, just like the app embed. A new theme does not include blocks from another theme.

  • App blocks require an Online Store 2.0 theme. If you’re using an older theme, use automatic placement with a custom CSS selector instead.

Last updated

Was this helpful?