How do Zones & Panels work?

Introduction

Imagine being able to change your website’s messaging instantly, whether you're promoting a limited-time discount or highlighting seasonal offers. With Zones & Panels in Shopblocks Marketing, you have unparalleled control over the content displayed on your website. Let’s explore how these features work and the benefits they provide.

 

What Are Zones & Panels?

Think of Zones as flexible placeholders, like stages in a theatre, waiting to host different content. Panels are the actors that bring those stages to life. Together, they allow you to display dynamic content based on specific conditions, such as the time of year or the page your visitors are viewing.

Setting Up Zones & Panels


1. Install the Shopblocks Marketing Plugin

First, install the free Shopblocks Marketing plugin. Once installed, navigate to the Merchandising area and click on Zones to begin.


2. Understanding Zones


Let’s create our first Zone.

  • Click on New Zone.


  • Name your Zone. In this example, we’ll call it Header Promo Zone.


  • Save the Zone and head back to your dashboard.



3. Adding Zones to Your Website

Before setting up Panels, you’ll decide where on your site this Zone will be displayed. Here’s how:

  • Go to BlockLab, edit your website’s Header layout, and add the Zone block where you want it to appear (e.g. at the top of your page).

    GIF Recording 2024-10-04 at 4.07.28 pm

  • Publish the layout. Keep in mind, at this point, the Zone will not display any content until you assign it a Panel.

4. Creating Panels

Now that your Zone is ready, it’s time to create Panels, which are the content pieces that appear within the Zones. Here's how:

For our first Panel, we’ll create a Summer Offer using BlockLab by adding a text block with the promotional message.

  • First, create a New Panel.




  • Name and Save the new Panel.




  • Click on BlockLab.



  • Design your Panel.
  • Publish this design. It won’t go live yet because you still need to assign it to a Zone.

5. Assigning Panels to Zones

With your Panel created, return to the Zones & Panels dashboard. You can now attach the Panels to the Zone you set up.

  • Head to the Header Promo Zone.
  • Select the Summer Offer Panel.




  • If you wish, you can add an expiry date and/or decide if you would like to show the Zone across the whole website or just on specific pages.

  • The rules you set for each Panel allow you to determine when and where content appears. This means you can create multiple Panels for a single Zone, each with its own expiration date, allowing for a highly dynamic and responsive content strategy!
  • Make sure both (The Zone and the Panel/s) are active, and click Save.



With Zones & Panels, you can efficiently manage dynamic content on your website. Whether you’re announcing a limited-time offer or setting up time-sensitive content like a countdown timer, this feature allows for maximum flexibility and control.

Feel free to experiment with different Zones and Panels to keep your site’s messaging fresh and relevant!