How to update the hero section of the landing page

Using the Landing Page Builder, you can customize this section to align with your event’s branding and key details. Here's a guide to help you update your hero section to maximize engagement.

 

1. Upload Banner Image


This is the main visual background of your hero section.

Tip: Choose a high-resolution image that reflects the theme of your event. Make sure the dimensions match the recommended size (e.g., 1920x1080 pixels) to avoid pixelation or distortion.


If your event focuses on a specific location, product, or speaker, the banner image should highlight that visually.

2. Upload Video File

You can opt to upload a video as the hero section background instead of a static image. This can add a dynamic element to your landing page.

Tip: Keep the video file size optimized for fast loading. The ideal length for background videos is 10-30 seconds, looped without sound.

3. Show Full Banner

Enabling this option allows the full banner (image or video) to cover the hero section entirely.


Tip: If you have a visually striking banner or video, this feature helps showcase it without cropping.

4. Optimize Background for Mobile

This ensures that the banner (whether image or video) is displayed correctly on mobile devices.


Tip: Always preview your landing page on mobile to ensure the visuals look good and load quickly. Mobile optimization can significantly improve user experience and reduce bounce rates.

5. Main Heading

The primary heading will be the most prominent text in the hero section. This is usually the event’s name or a compelling tagline.


Tip: Keep it short and impactful. Aim for fewer than 10 words to grab attention instantly.
Example: "Join the Future of AI Innovation!"

6. Subheading (Optional)

This optional field allows you to add additional details under the main heading.


Tip: Use the subheading to add a short description or highlight the key benefits of attending the event.

Example: "October 12-14 | Virtual Conference | Leading AI Experts"

7. Primary Button

This is the main call-to-action (CTA) button, often used to encourage users to register or learn more.


Tip: Make your CTA clear and action-oriented. Examples include "Register Now" or "Get Your Ticket."

8. Secondary Button

The secondary button is optional and can direct users to a secondary action, such as viewing the event schedule.

Tip: Use it for another important action, like "Learn More" or "Explore Speakers."

9. Event Start Date & Time

Enter the event’s official start date and time here. It will be displayed prominently in the hero section.

Tip: Double-check your event time zone and ensure it’s easy to read for a global audience if applicable.

10. Event End Date & Time

Enter the event’s end date and time here.

Tip: Like the start date, ensure the time zone is clear. If your event runs across multiple days, this field helps attendees plan accordingly.

11. Hide Event Time Details

If your event is ongoing or the time details aren’t crucial, you can hide the start and end times from the hero section.

Tip: Use this feature if your event's focus is more on the content rather than the schedule.

12. Enable Countdown Timer

Adding a countdown timer creates urgency and can motivate potential attendees to register quickly.

Tip: Use this feature if you’re close to the event date or have limited spots available. A countdown also adds excitement, reminding visitors how much time they have to sign up.

13. Text After Countdown

Once the countdown timer hits zero, you can display custom text.

Tip: This could be a message like "Event in Progress" or "Registration Closed."

14. Align Content

This feature allows you to align the text and buttons within the hero section (left, center, or right).


Tip: Choose an alignment that matches the design of your banner or video. Center alignment is often the most balanced, but left alignment can work well for a more professional look. 

15. Text Color

Set the color for the heading, subheading, and button text.

Tip: Ensure there’s high contrast between your text and the background image or video. Light text on a dark background or vice versa usually works best.

16. Banner Overlay Color

You can apply a color overlay on top of your banner to improve text visibility.

Tip: A semi-transparent black or white overlay is commonly used to darken or lighten the background, making text pop. Choose a color that complements your branding.

17. Overlay Opacity

Control the transparency of the banner overlay.

Tip: Use a higher opacity (around 70-80%) for busy images to make text more readable, or a lower opacity (20-30%) if your image is already subtle.

18. Enable Social Sharing

Allow users to share your event directly from the landing page by enabling social sharing buttons.

 Tip: This is a quick way to boost visibility. Ensure the sharing buttons include platforms where your target audience is most active (e.g., Facebook, Twitter, LinkedIn).