The Hero section is the top area of your event web page. It is the first section visitors see and typically includes your main image, event title, and registration button. This section sets the visual tone of your event and highlights the most important information at a glance.

You can customize the image, layout, and headline displayed in this section.

The Hero Image is the main visual displayed at the top of your page. It represents your event and creates the first impression for visitors.

Depending on the selected layout and the visitor’s screen size, the image may be automatically cropped or resized to fit different devices.

To upload or replace the image, select Hero Image in the Hero Options section.

Diobox offers three layout options for the Hero section. To change the layout, select Hero Template in the Hero Options section.

For best results, upload an image at least 1920 x 1080. PNG or JPG, up to 5 MB.

Wide

Displays the event image and event details side by side in a fixed height section. The rest of the page content appears directly below.

Full Screen

Shows a full screen image with the event title and registration button positioned near the bottom. Additional event details appear further down the page.

Full Screen with Overlay

Displays a full screen image with a dark overlay. The event details and registration button are centered on top of the image for stronger contrast and readability.

The Page Header is the title shown within the Hero section.

By default, Diobox uses the event name you entered when creating the event. You can edit the Page Header without changing the actual event name stored in your event settings.

To update the title, select Page Header in the Hero Options section.