Build landing pages
Landing pages or home pages are typically made of parts of existing content and show what your website or app is about. In this tutorial, you’ll learn how to approach building a landing page in Kontent.ai and what steps to take so you quickly land up with a successful landing page.
Table of contents
Key points – Landing pages made easy, fast, and multichannel
- Easy: Building a landing page is like assembling a jigsaw puzzle. You link various pieces of content to make a new whole.
- Fast: Once you create one landing page, you can use the groundwork for any number of other landing pages.
- Multichannel: When you build landing pages using structured content in Kontent.ai, you can serve them to any device via any channel.
Linking content in a nutshell
Video about linking content together in Kontent.ai
Play video on https://www.youtube.com/watch?v=uW-uvPkLRDE
With structured content, you have separate content items for product pages, articles, authors, and so on. Your landing page will consist mostly of excerpts from these various pieces of content.
To build a landing page, you need a content type that serves as a blueprint for the landing page. You use this type to create a landing page content item and link to it all the existing content you want on the landing page. And you connect it all together with single-use pieces of content, such as a welcome message or a hero image.
You'll need your developers in the beginning
When you build your first landing page, you need your developers to adjust your app accordingly. It's best to talk to them as early as possible. They may have valuable technical insight.
The good news is, you go through this once, and then you can create more landing pages on your own.
Think through your landing page structure
The first step is to think through the content you want to use on your landing page. The result of this activity should include:
- Content types of existing content you want to reuse
- Examples: featured articles, your partners' logos, and names, products, illustration images
- Types of single-use content you'll use only on the landing page
- Examples: welcome messages, CTAs, tiles with your portfolio highlights
Single-use and reusable content
When reusing existing content, we recommend linking content items. Content items can be used in multiple places, each item has its own workflow life, and can be published separately.
The single-use content that's only in one place doesn't need to have its own separate life. For this content, use rich text with components. A component exists only within one content item and shares its workflow.
Create landing page content type
When you're clear on what content you want where it's time to put your ideas into action. Create a new content type and define its structure according to your content mapping.
Landing page built in Kontent.ai with single-use content for the welcome message and reused linked items with CTAs, partner logos, and other content
For example, to build a page similar to the one in the picture above, you’d have one rich text element for the main welcome message in the hero area. You’d also add a linked items element for call-to-action buttons.
Then, you’d have an asset element for the hero image, a linked items element for your most important products, and so on.
Specify allowed content types
When you prepare the content type, it's useful to limit what type of content can be used where.
For example, the rich text for the hero area may need to use the Call to Action or Image types for linked items or components. On the other hand, you may not want to allow the Author or Product details content types.
Define visual options
When you’re building the content type for the landing page, you may need to create additional content types for structural units like the CTAs or image components.
Consider the use cases of your components – you may want to add display options like alignment or size for image components, CTAs may have different colors, and so on.
An image component with alignment and size options
Put together the landing page
Congratulations, you have the content model ready, all that remains is to create the landing page!
- Create a content item of your landing page content type.
- Write texts to introduce and connect the sections on the landing page.
- Add single-use components like CTAs or images.
- Set the display options in the components you defined when building the content type.
- Link the content you have already to the landing page.
This is how we link existing items to build a landing page for our Kontent.ai website.
Learn in more detail about the options you have when structuring content.
Preview and publish your work
After you’re done filling in the elements of your new landing page, it’s time to preview it. At the top of the content item, you see the preview button that opens the page preview. If you don’t see the button, contact your developers – they’ll set it up for you.
When you’re happy with your landing page, publish it and enjoy your day!