Understanding Panel Positions in Composer 2

How Do I Create New Panel Positions in Composer 2?

🔍 Overview

Showoff websites are built using panels and sections. Panels are structural areas that usually appear at the top or bottom of a page—such as the header, hero, footer, and sponsor sections. Each panel sits in a predefined panel position, which ensures content is displayed correctly and consistently across the website.

In Composer 2, several standard panel positions are available, each serving a specific purpose. These panel positions are typically created for you during the initial website build, so no action is required unless you want to rename them or make further adjustments.

Panel Positions in Composer 2

Here’s an overview of the standard panel positions and their purpose:

• Header: The topmost section of the website containing navigation, event or show logo, date, location, and call-to-action buttons. It ensures visitors can quickly access key information.

• Hero: Appears below the header on the homepage or welcome page. Designed to highlight key messages or promotions using various hero styles.

• Page Title: Used on subpages below the header. Can be customised with background styles and title placement for a consistent look across subpages.

• Footer: Appears at the bottom of the website, containing secondary navigation, legal links, contact info, and other essential details.

• Default: A flexible content area that can be placed anywhere between the header and footer. Commonly used for sponsors, newsletters, maps, banners, or other custom content.

• Sticky: A floating panel visible as visitors scroll, often used for social media links or floating CTAs. Can be positioned on the left or right of the screen.

• Popup: An overlay panel for messages, promotions, or announcements. Includes an exit button for user control.

• Popup Exit: Triggered when a user moves their cursor toward the exit area. Commonly used for exit-intent messaging to capture attention before leaving the site.

⚙️ How to Create or Edit Panel Positions

1. Go to Panels

2. Select Edit Panel Position

3. Click Add Panel Position

4. Enter a label

5. Select the appropriate panel position from the dropdown list

🔄 Reordering Panel Positions

Once panel positions are created:

• You can drag and drop them in the backend to change their order.

🎨 Changing Panel Positioning on the Frontend

To adjust how panels appear on the website frontend:

1. Go to Settings

2. Select Design and Appearance

3. Open Layout

📌 Summary

• Panel positions control where content appears on your website

• Standard positions are usually set up during the initial build

• You can create, rename, or reorder panel positions as needed

• Frontend layout changes are managed under Design and Appearance