Kontent.ai loves: Landing pages

Many marketers are still reluctant to abandon traditional CMSs and adopt the headless approach to content. This new series of articles explains in detail how your marketing team can use a headless CMS such as Kontent.ai. Let’s begin with landing pages!

Jozef Falis

Jozef Falis

Updated on Sep 18, 2023

Published on Mar 17, 2021

Headless CMS and landing pages

It might seem Headless CMS has evolved into a constant fight between two groups—developers, who adore it, and marketers, who are not so excited and feel that the headless approach is a source of unnecessary worries. How do they know that the piece they’re working on will look good on their site? And how can they create a landing page that will force their audience to take the intended action? How do they change the font color? However, all these issues are easy to address, and the most significant benefit of Headless CMS—maintaining a consistent customer journey—brings more than just adapting your processes.

As Head of Demand Generation at Kontent.ai, I will show you in this Kontent.ai loves series how a change of approach at work can lead to better marketing results.

First of all, we create content for people and simplify their customer journey. We use several tools that deal with various issues in depth and not just superficially. And structured content (content that’s ready for any interface) is key here because you can display it on any device, which opens up new possibilities in communication. Moreover, moving data between tools is very simple. In this article, we’ll take a look at creating landing pages in Kontent.ai.

Landing pages

When we were redesigning Kontent.ai, it was pretty logical to use our own headless CMS, and so we built the new experience on Kontent.ai. We can now manage everything using one platform. Even though our marketers and developers had to spend some time working on that, bringing all the marketing tools together was worth it.

Components

We started by mapping out what sections were needed when creating landing pages. We defined marketing sections suitable for us to cover the acquisition, remarketing, and retention phases of the customer journey. We ended up with more than 20 components that can take different forms. In total, we have 100 display options, which we defined for our developers. They prepared HTML/CSS/JS according to our requirements so that we could customize the content of individual components as much as possible—from the background color through the number of buttons to the text itself. We named them the Universal Marketing Landing Page (UMLP) elements and then combined them as puzzle pieces in a content type called UMLP. We wanted to have as much freedom as possible when creating landing pages, so we did not compromise on development.

Landing page elements
Universal Marketing Landing Page (UMLP) elements

The content of the elements can be changed on any page where they’re used—with just a few clicks in Kontent.ai. If we don’t want the change to appear in other places where the component is used, we duplicate the component, change its properties as needed, and use the new, duplicated version.

Elements on a landing page
UMLP elements on a landing page

What’s worth noting is that we have the advantage of Headless CMS—since everything is predefined, content managers are not afraid they would break their pages. Our source code is clear, well indexable for Google, and easily reusable on channels other than the web. Also, editors can use the preview functionality that’s available in Kontent.ai, and we’re now working on Web Spotlight implementation that will make editing the website even easier.

Landing page preparation

We’re constantly updating the components, but we can create a new landing page in less than 30 minutes, including defining its layout, filling it with content, correcting placement on the website, and filling in the metadata.

It all starts with choosing the right content type and then adding the individual components. We can easily adjust their order using the drag-and-drop function. After filling the page with content, we immediately see how it looks using the well-defined preview.

Preparing a landing page

Conclusion

With Headless CMS, we can use structured data that we’re able to deliver using the API into any other tool or platform. We can easily translate content, edit it on all platforms from one place, prepare marketing campaigns, or personalize the website. In the following Kontent.ai loves articles, I will show you how to do all these things.

In this first part of the (soon-to-be) series, I wanted to make Headless CMS more “human” for marketers. It might be painful at the very beginning; however, one very quickly begins to see the benefits of this modern approach pushing us to produce more meaningful content that’s consistent across all our channels.

Check out other articles from this series:

Subscribe to the Kontent.ai newsletter

Get the hottest updates while they’re fresh! For more industry insights, follow our LinkedIn profile.