Setting Up the Attrac App Block

Using the Attrac App Block is optional for placing your campaign. By default, you can position an Attrac campaign (announcement bar or embedded banner) using the campaign settings. You can choose to place the announcement bar at the top or bottom of the page, or position the embedded banner above or below the add-to-cart button. For a custom position, however, one option is to add an Attrac App Block to your theme. You can add as many Attrac App Blocks as needed, with each block corresponding to one Attrac campaign.

For other options to display the campaign in a custom position in the theme, refer to: 

How to place a bar or banner campaign in a custom position?

How to add an Attrac App Block to your theme

From the theme editor, follow these steps to add an Attrac App Block to your theme:

1. Add a new section in the theme's Header, Template, or Footer
2. Choose Attrac Campaign as the type of app block

3. Click the app block to open the settings to link it to an Attrac campaign

4. Locate the campaign code tag in the campaign settings by going to: Attrac dashboard > Edit > Style & Behavior > Position
5. Change the campaign position to 'Custom' to reveal the campaign code tag

6. Copy the campaign code tag
7. Save the campaign before exiting
8. In the app block settings, paste the campaign code tag
9. Save the app block to display the app block in the preview and theme

How to make the announcement bar app block full-width

When using the Attrac App Block to place a bar campaign in a custom position within your theme, the default behavior is to match the theme's margins. To make the announcement bar full-width, follow these steps:

1. Click the "Apps" section containing the Attrac App Block to display its settings

2. Disable the setting "Make section margins the same as theme"