How to Create Seasonal and Immersive Landing Pages

A landing page is a great way to promote a campaign or event, such as Christmas, Halloween or a summer festival. With a few settings in the CMS, you can make the page feel like a destination in its own right, rather than just another page on your site. 

You don't need a developer, and the changes only affect the page you're working on.

There are two levels to this. The first is changing the layout, background and content of the page. The second is a full brand bundle for a flagship event (see the end of this guide).

Did you know that you can get a free add-on brand bundle created each year, from any branding / assets that you supply assets.  Just message us for more information.

Step 1: Create your page

1. In the content tree, click the three dots on the homepage, or wherever you want the page to sit.
2. Choose Create, then pick a standard page to start from scratch.
3. Or, for an easier start, copy a layout you already like so you're not working from a blank page.

Your page will pick up your main site branding automatically.

Step 2: Add your content first

Before you start on the effects, add the content blocks you need. A typical event page might include:

• Text introducing the event
• Signposts to key information
• A video
• Panels for different parts of the event
• A form for enquiries or bookings

Step 3: Make the top of the page more immersive

The hero area is the first thing guests see, so this is where you'll make the biggest difference.

Add a hero video. Videos are more engaging and are usually worth the trade-off with page speed. If you want the video to autoplay, use Vimeo, as it stays compliant with cookie and consent rules.

Turn on full screen. In the hero settings, switch on the full screen option so the hero fills the screen.

Hide the clutter. In the page settings, hide the utility bar and the promo bar. This makes the top of the page much cleaner. These changes only apply to this page, so the rest of your site stays as it is.

Use a transparent header. Turn on the transparent header option so the hero content becomes the main focus.

Step 4: Add a content panel on top of the hero

With full screen turned on, you can place a content panel over your hero video or image.

1. Open the hero video or hero image.
2. Add a content panel. Content with image works well, as you can use it for a logo, a title and a link.
3. Click Refresh to see how it looks.

Improve the contrast. If the text is hard to read, open the settings on the hero video and add a tint. This lets the background show through more softly and makes your foreground content stand out.

Check the alignment. If the content looks off, open the settings on the content panel and set mobile, desktop and horizontal alignment to the middle, and align the content to the middle.

Hiding your main logo. There isn't an option to hide the logo on a single page, but as a workaround, upload a blank transparent PNG as the logo in the page settings.

Step 5: Add a screen effect

You can add a page-wide effect, such as snow, fireworks or smoke. Add the Screen effect panel, then choose your effect. The None option is there to stop a page inheriting an effect that is switched on elsewhere on your site.

For Christmas, snow is a natural choice. You can make the snowflakes softer and change the speed. We strongly recommend either:

• Setting it to fade on scroll, or
• Adding a 5 to 10 second delay before it fades out

This keeps it from becoming annoying or distracting for guests.

Step 6: Try a fixed background

You can add a fixed background image or video that stays in place across the whole page. It can look great, but it can also feel a bit jarring. If you use a video, you can add a tint, and you may want to edit the video first so that it works well behind your content.

Be careful not to overdo it. A clean hero with a small number of effects usually works best, especially on mobile.

Step 7: Match the look to your event

Once the layout is working, check that the colours suit the event.

Block themes. Open the cog on a block, such as an overlap panel, and choose a different theme. Your available themes will differ from our demo site. If you need new ones, such as a few Christmas variations, just get in touch and we'll set them up. Some clients already have seasonal themes, but a new look for a particular event may need two or three new block themes.

A brand bundle for flagship events. If you have a special event with new branding, creative and artwork, we can set up a whole brand bundle just for that event. This works well for a flagship event that grows and develops each year. Here's how it works:

• Your main site keeps its normal branding.
• We assign the new assets to the event page (or pages), so they get their own fonts, colours and overall look and feel.
• It usually takes us a couple of days to set up, and add-on brands are included at no extra charge.

Tips

• Start with content. Build the page first, then add the effects.
• Keep it simple. One or two effects is plenty. Too many can slow the page down and distract from your message.
• Check contrast. Use a tint on videos and images, and use panels to keep text readable.
• Test on mobile. Most guests will see the page on their phones.
• Delay or fade effects. Snow and similar effects are best when they fade out after a few seconds.
• Ask us early. If you need new block themes or a brand bundle, let us know in good time so everything is ready for launch.

Created by Neil Lewin, Modified on Wed, 7 Oct at 11:07 AM by Neil Lewin