Feature panels are part of the full width content components that are used to display associated, relevant content in a stylised way spanning the full width of the page. Everything from link cards to quotes to media such as YouTube videos can be added to promote further reading on our website or simply provide more information on the page.

Overview

Feature Panel wireframe
An example of a Feature Panel component

Feature panels are made up of four distinct parts:

  • Reference title – which is what is displayed in the back end of Contensis and the terms you’d search for to find the entry
  • Title – which is displayed on the public-facing website
  • Text – an optional area where you can write a short description of what’s in the feature panel
  • Feature content – which is the main content that is displayed, for example links to other pages, video and images.
A feature panel entry in the back end of Contensis
A feature panel entry in the back end of Contensis

To create and edit a feature panel, editing the reference title, title and text is the same as with any other title and text areas of Contensis.

The 'Feature content' area is where the different types of content can be added by clicking on the green '+' button. It looks like this in the back end of Contensis:

Feature panel with feature content button highlighted

The options for the Feature content area are all simple enough to use - it's a case of filling in the relevant fields. However, below are short explainers of each with images to show what they look like in the back end of Contensis and then on the front end of the website. 

Call out panel

This allows you to bring certain text to the fore. It will display a title, some copy (which should be kept short) and has the option of bullet points. You can link up to two other areas both within our site and externally using the CTA (call to action) options.

A call out panel in the backend of Contensis
A call out panel in the backend of Contensis
A call out panel on the front end of the website
This is what the call out panel looks like on the live site.

Feature card

Feature cards allow you to highlight other areas of the site or an external site and link out to them. It is formed of a title, area for text (which should be kept short) an image which must already be uploaded into the image library (see image guidance) and then where you want to link to using a search function of the existing entries within the website. You can create a new entry at this point if one doesn’t already exist.

Feature cards are displayed as follows within Contensis and, once published, on the live website. 

A feature card entry in Contensis
This is what a Feature card looks like in Contensis.
A feature card on the live website
Here's how the feature card will look on the live website.

Gallery modal

This feature allows you to embed a gallery onto a page. You need to give the panel a relevant title and you can add some optional text to describe it. You will need a feature image which will be the main one displayed on a tile on the web page (recommend the first image of the gallery you want to include) which you will pick from the image gallery.

Finally, you can pick your gallery from the list of galleries already produced, or you can create a new one.

Below is what a Gallery modal looks like in Contensis and on the live website. 

A gallery modal in the backend of Contensis
This is what a Gallery modal looks like within Contensis.
Gallery modal on the live site
Here's what a gallery modal looks like on the live site once you click into it. You can see the display tile in the background behind the pop-up image.

Media embed modal

This allows you to embed media such as a video into the web feature content. You will need a relevant title, image and then the embed code which is simply pasted into the ‘Media iframe embed’ box. You can find out about embedding content here

A feature panel media embed in Contensis
Here's what a media embed will look like within Contensis.
Media embed on the website
This is what the media embed card looks like on the website. The embedded video will pop out and play when this is clicked.

Quote

A quote is a styled piece of text that displays something pertinent to the page. It requires the quote, the source of the quote (e.g. the person who said it) a relevant image and the individual’s role or job title. It’s possible to link to a relevant page or external site, though this is optional.

A quote in Contensis
This is what a quote looks like when entered into Contensis. If the image is a logo, simply toggle the button.
A quote on the live site.
This is how our quote is displayed on the live website.

Infographic card

You can embed either a pre-made infographic, or create a new one using this feature. When creating a new entry, infographics should be uploaded as images. We won't go into that process here, but it's a straightforward upload. When you pick an infographic card, it looks like this in Contensis...

Infographic card within Contensis.
This is what an Infographic card entry looks like within a Feature Panel.
Infographic card on the live site
This is the chosen infographic on the live site = it displays as card within the Feature Panel area.

News article

This simply enables you to link to an existing news article entry, or create a new one. Where it's an existing article, simply hit the '+ Select a news article' button and select the relevant piece. For a guide on creating a new entry, see here

Component in action