OS 2.0 Product page banner App Block

Learn how to add the product page banner app block to your OS 2.0 enabled theme

Bart Coppens avatar
Written by Bart Coppens
Updated over a week ago

Online Store 2.0 App Blocks App Block

Shopify's Online Store 2.0 (OS 2.0) themes support App Blocks.
Discount Ninja offers a way to install a number of its building blocks as an app block.

This allows you to position the block in your theme without the need to change the liquid files (code) of your theme.

How to enable the product page banner as an App Block

  1. Open the Online Store section in the Shopify admin and click Themes:

  2. Find the theme you want to customize and click the Customize button for that theme:

  3. The theme editor opens. In the dropdown at the top, select the Products item:

  4. Then select, Default product:

  5. The editor for the default product page opens. Find the location where you would want the product page banner to appear. Usually, this is below the Title block in the Product Information section. Locate this block in the sidebar on the left. Click the Add block button at the bottom of this section:

  6. A block selector opens. Scroll down to the Apps section. Find the Product page banner app block of Discount Ninja and select it:

  7. IMPORTANT - in the theme editor the app displays a placeholder. This placeholder is not displayed on your live shop. To configure when a product page banner should be displayed and to edit the text or style, you need to edit the building blocks of the offers configured in Discount Ninja.

  8. Change the location where the product page banner is rendered by dragging the block up or down in the list using the handle on the right:

  9. If you want to hide the block, use the eye icon to toggle visibility:

  10. To remove the block, select it and click the Remove block button at the bottom of the sidebar on the right:

Changing the text and style of the banner

To configure when a product page banner should be displayed and to edit the text or style, you need to edit the building blocks of the offers configured in Discount Ninja.

Did this answer your question?