Set up Web Spotlight for your project
Table of contents
Why use Web Spotlight
What are the main benefits you'll get when using Web Spotlight?
- Seeing the hierarchy of a website in a page tree
- Creating new pages from the page tree
- Previewing of changes in Kontent.ai
- Live-editing pages from the preview
Overall, Web Spotlight brings ease to the authoring experience for website creators. As Kontent.ai is still the engine behind Web Spotlight, you can use all of its headless CMS advantages:
- Reusing content across all channels
- Reusing content in different places
- API-first content with multiple SDKs available
Content creators don't need to learn the hierarchy of your project. They'll see a page tree, choose a page in it, make a few changes, and see their new page in a matter of seconds. Find more about the Web Spotlight.
Get Web Spotlight
Web Spotlight is an additional feature of the Kontent.ai platform purchased separately per subscription. To set up a project as a website, purchase Web Spotlight and then contact us using Chat with support at the bottom right (or click the button below) so we can activate it for you.
Activate Web Spotlight
Once you have Web Spotlight activated for your subscription, you can enable it for individual projects.
Open the project you want to set up as a website and in Project settings, select Web Spotlight under the environment settings menu on the right. There, click Activate Web Spotlight. Shortly after you click the button, you'll see Web Spotlight in the app menu. Click it to start setting up Web Spotlight in your project.
Any project manager that has access to the project's default language can activate Web Spotlight for the project.
The initial setup creates new content types and items in your project. It doesn't affect any of your existing content.
Converting existing projects to Web Spotlight
If you have an already existing and working project, you can adjust it to use Web Spotlight. We have a tutorial focusing on this specific scenario.
What happens after activation?
Once set up, Web Spotlight creates several things in your project:
- Homepage content type and content item – core parts of Web Spotlight, which you can edit but not delete.
- Subpages content type element – a core part of Web Spotlight, which you need to use in your model to create a single page tree.
- Page content type – an optional part of Web Spotlight, which you can use for creating pages.
What if you deactivate Web Spotlight?
Your content stays as-is, including the items and types created during activation. Nothing will be changed nor deleted from your project.
Homepage in Web Spotlight
Homepage in Web Spotlight defines the root of your website. Generally, this means the top-level navigation and what's shown for the root of your website.
Web Spotlight creates a content type and content item, both named Homepage. Together they create the core structure of your website that you build upon to create a hierarchy known as page tree.
Homepage defines the following elements:
- Title – Specifies the name of the homepage.
- Subpages – Specifies your website's home subpages, for example, the top-level navigation. By default, this element is limited to pages.
- Content – Specifies a content item to use for the root of your website.
You can extend your homepage with other content elements if needed. While Web Spotlight is active, the Homepage type and item cannot be deleted.
Subpages in Web Spotlight
The Subpages element is a means of creating your website hierarchy, commonly known as page tree. You can use subpages with the predefined pages or add them to your own content types.
Page in Web Spotlight
A page in Web Spotlight defines a page within your website. Pages represent the locations in your page tree. They are connected to items with specific content such as articles or blog posts.
Page defines the following elements:
- Title – Specifies the name of the page.
- URL – Specifies the URL slug of the page. By default, auto-generated from Title.
- Show in navigation – Determines whether the page should be visible in the page tree.
- Subpages – Specifies the subpages of the current page, for example, several pages within a section of your website. By default, this element is limited to Page items.
- Content – Specifies a content item to use for this page.
- Continue to our Hello Web Spotlight tutorial to learn the basics of displaying your content with Web Spotlight.
- To make the most out of Web Spotlight, make sure to set up preview for your website and implement smart links. These two steps let you quickly edit content directly in Kontent.ai.
- Create, edit, and preview your web pages in Web Spotlight.
- Check out Andy Thompson's blog post and pick the right setup for your page tree to match your website navigation perfectly.