Skip to main content Skip to footer

Learning Centre

Content Components

The Govstack content management system (CMS) offers several content components that you can use to build the content on your web pages.

Be sure to save and publish your page after conducting all actions with components to allow the changes to show up on your live website.

Add a component

To add a content component to your page, go to the 'Content' tab and select 'Add content' under the 'Main content' option. You can also add components above or below your main content by going to the 'Extra Content' tab and selecting 'Add content' under the 'Above main content' or 'Below main content' options respectively.

You can also add content components under the global 'Pods' option in 'Extra Content'.

Delete a component

To delete a content component, hover over your component in the page's menu and select the trash can 'Delete' icon. Select 'Delete' when the prompt asks if you would like to delete the component.

Edit and re-order a component

To edit a component, select the component within your page's menu to open its slide-out panel. You will now have access to the content and setting options for the component. Select 'Submit' when you are done editing your component.

To re-order components on your page, click and drag the component you would like to move above or below your other components in the page menu. Release the component in your selected area and select 'Save' to finish.

Copy a component

If you are going to use the same component multiple times on a page or on other pages in your website, you can copy the component. This will save all of the settings from the original component and can help speed up the page creation process.

To copy a component, you need to:

  1. Select the 'Copy' icon on the component
  2. Then, on the 'Add content' button, select the 'Clipboard' icon that looks like a suitcase
  3. This will open the clipboard
  4. Select the component from the clipboard to add it to the page

You can then, re-order the component and make any necessary edits.

Types of components

View the different types of content components you can use to build your page.

The 'Accordion/Tab' component allows you to insert and configure accordion foldouts or tabbed content within your page. This lets you organize lots of content in a more clean, manageable and presentable manner. Users may select each accordion heading or tab to expand the content and learn more about each topic.

The 'Banners' component allows you to insert a visual banner on your page with various layouts and features such as image banners, video banners, and banners with a parallax or takeover effect. You may also add headings, text and colour overlays to your banner, along with animation styles.

A 'Call to Action' allows you to insert and configure a call to action area on your page where you can encourage the user to take an action, such as visit another web page, subscribe to a newsletter or complete a form.

A 'Call to Action' is made up of a heading and a button, with an optional subheading and text. You can also adjust the look and style of your call to action with additional colours, background images, text alignment and more.

The 'Data List' component allows you to insert a structured list of information, such as hours of operation, fees and prices, menus and other types of data sets.

You can adjust the look and style of your data list by configuring your list's settings, such as items per row, list width, colours, container style, background images and more.

The 'Embed Code Block' component allows you to insert custom JavaScript or HTML to a page, which can be used to display iFrames, third-party scripts and widgets, such as a Google map, online form, video, and more. 

The 'Events Feed' allows you to insert and configure a list of upcoming events, which are pulled from your 'Events' calendar module.

The 'Gallery' component allows you to add images and videos to your web page in creative and unique layouts. You can create galleries containing only images, only videos, or a combination of both. You can embed internal video files or links directly onto a page and link to a full 'Media' folder to pull all files from that folder into a gallery.

Gallery layouts include grid, slideshow and carousel and can be displayed on-page or via full browser display.

The Grid Layout component allows you to organize content on your page into columns and rows using a newspaper-style grid. The Grid Layout component provides information in an accessible format and is a useful alternative to traditional tables; boosting website usability.

You can customize your layout with the component settings, including width, content colours, background images, spacing, visibility and more.

You can insert images onto your web page after they have been uploaded to your 'Media' folder. Place images onto your page using the Text, Banner or Gallery component, or with the Text/Image component within a Pod.

The Links component allows you to add a list of hyperlinks to your web page. You can link to many different places, including to another page on your website, to an external website, or to a document saved in your Media tab.

You can also adjust the look and style of your links through the settings tab.

The News Feed component allows you to insert and configure a list of recent news items to your page, which are pulled from your News and Alerts module.

The Pods component allows you to insert unique or repeatable sub-components (or 'Pod items') in a single row-based grid layout with equal-width columns on your page. You can insert multiple items per row (from one to eight) within the pod.

Within a pod, you can insert sub-components, such as:

A pod settings and sub-component settings allow you to adjust the look and style of the pod.

The Sitemap component allows you to insert a single-column sitemap listing onto your web page. Choose which page will begin the sitemap from your website's available pages and your sitemap will contain that page and any descending pages from it. Users can select page links on the sitemap to navigate straight to that page.

The Spacer Column component allows you to insert and define a column of specified width on your page to achieve your desired look and feel when that content is presented on a desktop or tablet.

The Split Component component allows you to create a two column grid on your page, similar to the Grid Layout, but you may only insert two sub-components within a Split Component.

With Split Components you can also define the order of content components on desktop and mobile views.

Split Components carries more sub-component options than Grid Layouts, including:

The Subpage Listing component allows you to insert a directory of links to another area of your website, including a parent page and all of its descending pages. Pages are presented in a list with clickable page names and each page's Summary is presented below the page name. 

If you insert more than one parent page in your Subpage Listing, the listings for each parent page will appear in a tabbed order. You can also attach a visual icon to each Subpage Listing.

The Text component enables you to insert basic text onto your page, along with headings, links, tables, images and content embeds.

The Windows component allows you to insert and configure a grid-based layout for the purpose of creating a visual collage made up of image- or video-based calls to action.

For each window, you may include text (headings, sub-headings, body text or buttons) overtop of images or videos. The Windows component offers multiple types of layouts, allowing you to make one or two windows more prevalent or bigger than the others, or to make each window equal size.