Skip to content
English - Canada
Contact us
  • There are no suggestions because the search field is empty.

Setting Up Page Interrupters (Content Blocks) on PLPs | Reactiv Support Center

Copyright (c) 2023, Intercom, Inc. ([email protected]) with Reserved Font Name "Inter". This Font Software is licensed under the SIL Open Font License, Version 1.1.Copyright (c) 2023, Intercom, Inc. ([email protected]) with Reserved Font Name "Inter". This Font Software is licensed under the SIL Open Font License, Version 1.1. Table of contents Setting Up Page Interrupters (Content Blocks) on PLPs

Setting Up Page Interrupters (Content Blocks) on PLPs

Written by Reactiv App
Updated over 6 months agoReactiv App Table of contents

Purpose:

In this guide, you’ll learn how to set up a visual content block—called a Page Interrupter—on your product listing pages (PLPs) in Reactiv. This content block lets you display an eye-catching image, title, and optional description to highlight promotions, brand messaging, or important updates right in the shopping experience.

Navigate to the Content Block Settings

  1. Log in to your Shopify admin dashboard.
    ​

  2. In the left-hand sidebar, scroll to the Sales Channels section.
    ​

  3. Click Reactiv – Mobile App Builder, then select App Studio.
    ​

  4. Click the menu icon beside your store logo, then choose Product Listing.
    ​

  5. In the left-hand menu under your logo, select Settings.
    ​

  6. Scroll down to the Content block section.
    ​

Log in to your Shopify admin dashboard.
​

In the left-hand sidebar, scroll to the Sales Channels section.
​

Click Reactiv – Mobile App Builder, then select App Studio.
​

Click the menu icon beside your store logo, then choose Product Listing.
​

In the left-hand menu under your logo, select Settings.
​

Scroll down to the Content block section.
​

You’ll now see the configuration panel for the Page Interrupter.

What is a Page Interrupter?

The Content block is a customizable visual section that appears within your product listing page. It’s designed to break up the page layout with a branded, promotional, or informative message—helping you capture shopper attention without disrupting their browsing.

Key Features:

  • Toggle to enable or disable the block at any time.
    ​

  • Add an optional Title (up to 50 characters).
    ​

  • Add optional Supporting text (up to 50 characters).
    ​

  • Upload a custom image in a 16:9 aspect ratio. The image automatically scales to fill the area.
    ​

Toggle to enable or disable the block at any time.
​

Add an optional Title (up to 50 characters).
​

Add optional Supporting text (up to 50 characters).
​

Upload a custom image in a 16:9 aspect ratio. The image automatically scales to fill the area.
​

How to Set Up a Content Block

  1. Toggle on the Content block at the top of the section.
    ​

  2. Enter a Title (optional):
    This will appear as the main heading in your content block. Keep it clear and compelling.
    ​
    ​ Example: “New Collection Just Dropped!”
    ​

  3. Enter Supporting text (optional):
    This is a short subheading that adds context or encourages action.
    ​
    ​ Example: “Check out the latest arrivals before they’re gone.”
    ​

  4. Upload your image:
    Click the Upload button and select a 16:9 image. This image will fill the content block space and serve as the visual centerpiece.
    ​

    • Recommended dimensions: 1600 × 900 pixels or similar.
      ​

    • Ensure the image aligns with your branding and fits the text you’ve entered.
      ​

  5. Preview the result:
    Your uploaded content will appear in the live preview panel so you can see how it looks before saving.
    ​

Toggle on the Content block at the top of the section.
​

Enter a Title (optional):
This will appear as the main heading in your content block. Keep it clear and compelling.
​
​ Example: “New Collection Just Dropped!”
​

Enter Supporting text (optional):
This is a short subheading that adds context or encourages action.
​
​ Example: “Check out the latest arrivals before they’re gone.”
​

Upload your image:
Click the Upload button and select a 16:9 image. This image will fill the content block space and serve as the visual centerpiece.
​

  • Recommended dimensions: 1600 × 900 pixels or similar.
    ​

    • Recommended dimensions: 1600 × 900 pixels or similar.
    ​

  • Ensure the image aligns with your branding and fits the text you’ve entered.
    ​

    • Ensure the image aligns with your branding and fits the text you’ve entered.
    ​

    Preview the result:
    Your uploaded content will appear in the live preview panel so you can see how it looks before saving.
    ​

    Best Practices for Page Interrupters

    📸 Use high-quality visuals

    Choose bold, branded imagery that aligns with your store’s aesthetic and goals.

    🧠 Focus the message

    Keep the title and supporting text brief and to the point. Think headline + hook.

    🎯 Tie into your promotions

    Use this section to promote seasonal sales, new arrivals, app downloads, or special offers.

    🛠️ Keep it updated

    Refresh the image and message regularly to reflect current campaigns or announcements.

    Did this answer your question?😞😐😃