Each Page can be made out of different ‘Parts’. Each part has its own look and own function and can be used multiple times per page.
The order in which the parts are displayed on the page can be modified manually. This means that the possibilities are literally infinite! After creating your Page you can choose among the following parts and add them to your page!
After creating a page you can add it to the menu. It is also possible to access a page without adding it to your menu. In this case, the page can be found if someone has the right URL (for instance by clicking on a link).
How to add a Page
To create and manage your Pages, go to Dashboard > Stories > Pages.
Create your page by adding some essential information.
- Meta title: For SEO and socials (OpenGraph)
- Dashboard note: Visible only in the Dashboard
- Meta description: For summaries, SEO and socials (OpenGraph)
- Publication date: The publication date is only used for ordering content items among themselves.
- Story type: By adding a story type you convert a regular page into a story. It will then be included in story overviews anywhere on the website where stories are featured.
Page Visibility Settings
Choose one of the following options:
- Yes: Page is visible on the website to all Visitors
- No: Page is not visible on the website to all Visitors, for instance if you are still working on it.
- Advanced: The banner visibility depends on date settings and visitor tags
Advanced Visibility Settings
- Setting a start date and end date can only be done in the Advanced visibility setting. These are optional.
- You can also show a page (or page part) to (or hide from) visitors with specific visitor tags.
- Allow indexing: allow search engines (like the search engine of your website, or Google) to include this page in search results.
Save your Page, and you can now add Parts to your Page
Page Parts
Every page can be created by adding page parts. Each part is designed to manage a specific type of content and present it in the best ways possible.
There are lots of page parts you can add to your page. You will find them in the drop-down box at the bottom of your page. Once added, all page parts are presented in a list. You can drag & drop parts to change the order of the page parts.
In the manual How to find different Parts and add/change Parameters you will find an extensive list of parameters to be used in the parts
Each page part comes with a set of options and their own specific content management tools.
- Dashboard note is your little helper for internal notes. Very convenient when you are using multiple of the same parts.
- Anchor is the name of the part that is displayed on the website in the subnavigation bar of the page. Leave this empty if you don’t want sub navigation for the page, or give each part an anchor name to enable visitors to jump to the exact part of your page.
- FAQ/Collapsed heading is an optional title you can give the part when you want the content to be able to collapse. When collapsed, the content is not shown. Only the FAQ/Collapsed heading is shown with an icon to open it. This is a perfect way to create FAQ’s of multiple parts.
- Parameters are used to tweak the part. Every part can have a different default set of parameters, and there are a lot of extra parameters that can be added. Most common parameters are the padding top and bottom around the part to create some extra space around the content. Background color is also available, but make sure to keep it close to your standard background color to maintain proper contrast levels with your text.
- Visibility of a page part is a very powerful tool. You can schedule visibility in the Advanced section, or make sure the part is only visible to (or hidden from) visitors with a specific Visitor tag.
Available Parts
More information about specific parts:
Hero part
The part that is always at the top of the page is the Hero part. Here you manage the page title (H1) shown on the website. It’s important to always add a title for SEO and accessibility reasons.
A description is also possible (which comes underneath the title).
To add space between the different parts you can add pixels to the parameters "pTop" (padding Top) and "pBottom" (padding Bottom). For instance, 30px to pTop and 30px to pBottom. After saving these parameters you will directly see some space between this part and your next and/or previous part on the page. The default background color is white but you can choose every color you would like, using these HEX color codes.
By adding one or more visitor tags to your part, that particular part will become visible to a selected group of people only.
It is also possible to choose from which date on a part will be shown on the website.
By adding a photo to your Hero part, this media will be shown on top of the page.
If an image is uploaded in the "Hero" part, it will always be placed behind the text. So pay attention to whether the text is still easy to read.
It's also possible to show a background video in the header. It will play without sound and replaces the background image. For this to work you will need:
- a header in the "full width" setting. If you are using headers with "boxed" images, you would need to change this by adding the parameter "variant" to the header and set this to "default".
- a background image. Video does not always load correctly on all webbrowsers, so an image as fallback is necessary.
- a new parameter "video" in the header part. Here you can add any Youtube or Vimeo url.
Media Gallery Part
In the "Media gallery" part you can upload one or more photos at a time. You can then use various layouts. You do so by setting the parameters to the desired setting. This part offers different settings for what needs to be done if there is only one image (single dropdown), but also settings in case of multiple images within the same part (look at the multi dropdown). The look depends on the amount of uploaded images.
Options for a single image
Full width
Boxed
Boxed with text on top
Boxed with text on the right
Options for multiple images
Full width slideshow
Full width grid two columns
Full width grid three columns
Three tiles
Five tiles full details
The background color and padding (above and below) are adjustable in all these variants.
The Title, Description and Credits that you can add for each image are used in some of the above variants. These can be adjusted per image in the "Media" part:
Description part
The Description part is very simple - if you want to place some text on your page, use this part. This can be a short or longer text. If you want to show an introduction to the whole page, or an introduction above or below (for example a media gallery), you can easily add a description part. This can also be used to add a button to your page (here you can read how to create a button anywhere) within a description part.
Video/Audio part
The Video/Audio" part supports Vimeo, Youtube and Soundcloud links. Add the link to the video part.
The Parameters in this part allow you to show a video over the full width, boxed or compact.
Iframe part
Use iFrame to integrate videos, podcast, music playlists or other inspiring content to your page. Read more about iFrames in the website feature manual.
Donations
For more info about the donations part? Check the dedicated manual about donations.
Adding Anchors to a Page
It is possible to add an extra navigation bar on a specific page. This is called an Anchor Menu. Any Page can have its own menu, which will be displayed between the header of the website and the beginning of the page. This is especially useful for long pages. With a Anchor link a visitor can go directly to the desired part of the page (without scrolling manually).
The page menu is shown here in grey under the main menu:
Creating an Anchor link on a Page
Each page is built based on several parts, and each part can have its own link in the page menu.
To create a link in the page menu, first find the correct part in the "Pages" module by opening the page and scrolling down to the parts overview:
Then open (edit pencil) the part you want to add to the page menu, and fill in the name of the menu item you want to show on the website into the anchor field of the part:
Labels are shown as menu items in the page menu once they are filled with content. Menu items are automatically configured to jump to the correct part. If the field "label" remains empty, no anchor link will be created for this part of the page.
Related articles