Quicklinks

In this guide we will cover:

• What are Quicklinks?

• The four styles of Quicklinks

• How to create a Quicklink (on websites built from 2024 onwards)

• How to display Quicklinks on a General Page  (on websites built from 2024 onwards)

• How to create a Quicklink (on websites built prior to 2019)
• How to display Quicklinks on a General Page (on websites built prior to 2019)

What are Quicklinks?

Quicklinks are used to help a user continue their journey, or to help keep them on the website. They quickly link a visitor who may have reached the bottom of a page to related content on the website to continue browsing.

Quicklinks are created within their own module within the CMS and then can be selected to display on a page. 

Once you have created a Quicklink within the General section of the CMS, we will set a selection of Quicklinks to display on a Page, and also set one of four display styles.

In the example below from the Accommodation Landing page of this website, you will see two Quicklinks at the bottom of the Page for Packages and About directing to pages displaying more information on the businesses accommodation offerings. 

The four styles of Quicklinks

Let's look at the styles of Quicklinks available, that you will set within a General Page, once you have published your Quicklinks: 

1. Default: This displays a background image, with a Title set over the top of the image. On hover the Heading will ascend to reveal a Description CTA button. All parts of the Quicklink when clicked will direct the user to the page of the URL that has been set. The Default option displays up to 3 Quicklinks in one row. Adding a fourth Quicklink will start a new row with this Quicklinks aligned to be centered to the first row, and additional Quicklinks added will be aligned to the first row. 
   Recommended Image size: 450px x 550px.
   
   
2. Cover: This displays a stand-alone image that takes up 40 per cent of the Quicklink, with a Title, Description and CTA button that takes up the other 60 per cent of the space, in row format. The image displays a magnifying effect on hover, with all parts of the Quicklink when clicked will direct the user to the URL that has been set. The Cover option displays the first Quicklink with an image on the left-hand side, and a second Quicklink with an image on the right-hand side, with all subsequent Quicklinks alternating in this order.   
   Recommended Image size: 700px x 450px. 
   
   
   
3. Icon: This displays a small image at the top of the Quicklink, with a Title, Description and CTA button that takes up the bottom 60 per cent of the space, in a column format. The Image and CTA button when clicked will direct the user to the page of the URL that has been set. The Icon option displays up to 4 Quicklinks in one row. Adding a fifth Quicklink will start a new row with the fifth Quicklinks aligned to be centered to the first row. The addition of more Quicklinks will be centre aligned to the first row.   
   Recommended Image size: 64px x 64px. 
   
   
   
4. Tile: This displays a large image that takes up the top 50 percent of the space, with a Title, Description and CTA button taking up the bottom 50 percent. All parts of the Quicklink when clicked will direct the user to the URL of the page that has been set. The Tile option displays up to 3 Quicklinks in one row. Adding a fourth Quicklink will start a new row with the fourth Quicklink aligned to be centered to the first row. Any additional Quicklinks added will centre align all additional Quicklinks to the first row. 
   Recommended Image size: 420px x 250px. 
   

How to create a Quicklink (on websites built from 2024 onwards)

1. Let's look at what Quicklinks have already been created within the CMS. Login to the CMS using your Username and Password, the navigate to the General section of the website, then select Quicklinks. You'll see that there is already a long list of Quicklinks that have been created.  
   
2. To edit an existing Quicklink, simply select the name of the Quicklink in the TITLE column to open it, or to create a new Quicklink, select the + New button at the top of the page. You will need to edit or fill in fields for:
   
   • CMS Name: This is the name of the Quicklink that will appear in the Quicklinks List. This displays only within the CMS for you to see.
   • Title: This is the name of the Quicklink that will appear as the title on the front end e.g.: Packages, or About, in the example above.
   • Image: This is a single image that you will select from File Manager. As each of the four styles of Quicklink prefers a different image size, with these detailed below, it is a good idea to have in mind the style of Quicklink you would like to display on a page ahead of creating a Quicklink. 
   • Image Alt Text: A great way to support search by adding in a brief description of what appears in the image. Alt text (alternative text) describes an image on a page, helps visually impaired people understand what the image shows so it is good for accessibility, helps search engine bots understand image contents, and appears on a page when the image fails to load.
   • Destination page: Select from a drop-down menu where a user will be directed to an internal page should they click on the Quicklink e.g.: Packages (landing page). 
     
     OR
   • External URL: Should you wish to direct a user offsite, or to a page that does not appear in the Destination Page drop-down list, enter the full URL to direct the user to this page.
   • Button text: If you are setting a Destination Page or External URL, it is recommended to set some brief but descriptive text for the CTA button e.g.: Read More. 
   • Description: Add in a brief amount of text to help introduce the page content that sits behind the page you are directing people to. This field is limited to 250 characters, including spaces, so it should be kept under 100 characters. It is not compulsory to add a Description.
   • Save: When all fields have been completed, select the Save button at the top of the page and you will be directed back to the list of all Quicklinks where your Quicklink will show that it has been saved as a draft or with a status of HIDDEN (orange)
   • Publish: Scroll to the bottom of the page to locate your Quicklink and select the checkbox next to the name of your newly created Quicklink. Select the Publish button at the top of the page, and your Quicklink is now available to select on a Page. It will now show in the Quicklinks list with a green status of PUBLISHED.
     

How to display Quicklinks on a General Page (on websites built from 2024 onwards)

1. Navigate to the General menu, then select Pages. Now select a Page that you would like to add Quicklinks to.

2. Select the Quicklinks tab. Here you will need to complete fields for:
   
   

   • Heading: Add brief text to this free text field to introduce the Highlight content e.g.: Explore Further, Read More. It is not compulsory to add a Heading. 
   • Description: This is a free text field that allows you to set the text, limited to 250 characters, that displays underneath the Heading. It is a good way to add context as to what the Quicklink is focusing on. This only displays on the Tile, Icon, and Featured Highlight Styles. It is not compulsory to add an Introduction.  
   • Choose Quicklink Style: This is a single select option.
   • Choose Quicklinks: It is recommended to select, by checking the tick box next to the title of a Quicklink, a maximum of 3 or 4 Quicklinks to display on a page. These will be displayed at the bottom of the page underneath the primary page content with your set Title and Description. You are able to set a rank or number for the order that you would like your Quicklinks to appear in on the front end. 
     
     

3. Once you have selected the Quicklinks you want to display on a page within the Quicklinks tab, you will then need to select the Modules tab within the Page you are working on and add a rank next to the Quicklinks field. Adding the rank of 1, as in the example below, means that your selected Highlights will display after the Heading, Introduction and any additional content added in the Rich Text Editor (within the Content tab) on the Page on the front end.

4. Once you have finished editing all Page content, select Save at the top of the Page, then review your edits on the front end.

How to create a Quicklink (on websites built prior to 2019)

To add a Quicklink to a page (e.g. Home), we must first fill in Quicklink information on the page we'd like to be featured as a Quicklink on the homepage (e.g.: On the Home page, you'd like to have a Quicklink to your accommodation page)

1. To do this, go to the Pages Module, and click into your Accommodation page (the page you'd like to featured as a Quicklink on the Home page)
   
2. Go across the tabs at the top to the 'Quicklink Details/info' tab
3. Fill in the fields for the Quicklink and then click save

How to add Quicklinks to a General Page (on websites built prior to 2019)

1. Open the CMS and go to General Pages to open the page on which you want to add Quicklinks

2. Select the 'Choose Quicklinks' tab

    

3. Tick the Quicklink (e.g. accommodation) so it shows on the frontend

   Note that on some websites, there is a module tab - this allows you to activate different modules on this page (e.g. The contact page will have the contact form module activated). If Quicklinks are listed in the module, you must make sure you add a number next to it and click save (the number represents the ranking, if you have multiple modules activated).

   

You can also refer to our video on the Pages Settings Tab (it is showing the version deployed for websites built between 2019 and 2023, so you might notice some slight differences in your CMS if your website was built in 2023 or after).