Point - Inline pages

Introduction

Inline pages is a component that allows you to load in content on a page when you click on a button.

How it works

The inline component opens "sub pages" directly underneath the component. Each button loads a different page, meaning you can feed in multiple chapters into one page without the users needing to go anywhere.

"inline pages" component needs to be added to a page template to work.

(Image is from the page template editor, showing a page template containing the inline pages component and where you can find it in the components list)

How to set up

First you need to create the "inline landing page".

Create a new page in "page admin". This page needs to use a template containing the "inline pages" component.

After creating this page, you then need to create the "chapters". (To begin you only need one. You can add more chapters later)

The chapters need to be "nested" as sub-pages.

To create a nested page (subpage), you use this plus to add a subpage.

The chapter pages only support showing content from "WYSIWYG" / editor, meaning you need to use a page template containing this for the chapter pages.

Once you are done with the base setup, it should look something like this

Chapter pages

Each chapter needs to be on its own page. Continue to build and save content onto each of these pages as you would any other page. 

Note: If you use a page template which has any components (except editor / WYSIWYG), they will not be displayed when loaded in. Example: If you use a header carousel, this will not be loaded. You can use any "article" page template as they typically contain the editor. If you have navigation or footer on the page template, that will not cause any trouble.

Note: You must set the correct user group permissions on the chapter pages. This should match the "inline landing page" to avoid any challenges.

Inline landing page

Once your chapters are done, we need to make them load into the "inline landing page".

Inline component can be configured using the cog directly under the component

Here you can fill in headline, control layout and decide what style you wish to use for the buttons.

Right side panel is where you create your buttons (to load the chapters). You can add, clone or remove buttons.

To select a chapter to load, click the drop-down under "subpage". Here you can see all chapters you have created. It will ONLY list pages which are positioned directly under and nested (subpages). If you can not see any items in this list, it is likely the positioning is wrong.

Finalise your settings and click save and the nested pages should be done. After you save, you may need to reload the page for the inline pages to load in.