Quicklinks

When and how to use Quicklinks Content Blocks

When to use Quicklinks

• Quicklinks are used to insert boxed information and/or pictures with links to further information on other pages (on your site or an external site)
• Quicklinks can include text, pictures and links
• They are a neat and visually pleasing way to create links to other pages on your website or external sites

How to add Quicklinks

• Once you have followed the instructions on Adding Content Blocks , locate your new Quicklink by going to appropriate page in page management and clicking on the "Widgets" icon. 
• Once you have found the required content block click on the to enter the settings page, to add content
• If you would like your row of Quicklinks to have a heading, then you can add this in the Heading field.
• To add your first Quicklink, select to add the first heading, and Quicklink content. 
• If you need to expand the editor page, you can click and drag the bottom corner to increase the size.
• Complete the fields;
  • Heading: Enter the heading to be shown on the Quicklink.
  • Content: Enter the content for the Quicklink, as you would when using the Content Editor.
    This can be brief, with an intention to use the Quicklink as a button to a relevant page, or it can be more detailed. If you prefer, you can leave the content area blank.
  • Upload your image to be displayed on your Quicklink.
  • If you require a button and link, enter the text you would like to appear on your button, and the URL or friendly URL that the button should click through to.
    • To open the link in the same tab use a relative link, e.g. /page_name
    • To open the link in a new tab use an absolute link, e.g. http://www.your-domain.com/page_name

      

• If you would like to add another Quicklink, select  and follow the above steps for all further additions.

Advanced Quicklink Settings 

Under the list of Quicklinks you have access to add/customise the advanced settings. In this area you can add:

• Container Class - to add CSS styling
• Item Class - to add CSS styling
• Item Colour - to select what colour each quicklink box will display
• Image Shape - dictates the same of the images in each quicklink.
• Heading Position - where each Quicklink heading will be displayed in relation to the Quicklink images
• Effect Type -
  • Selecting standard will have the image, text and button all display boxed on your page.
  • Selecting Roll-Over will display just the image with the heading on the image. When the mouse is rolled over the image the text will display on the image with the item colour as an overlay
• Image Size - Sets the sizes of the Quicklink Images. This may crop your images if you have uploaded images of different dimensions
• Display Type -
  • Standard display will contain your Quicklinks within the content body area of your website.
  • Full Width will display your Quicklinks the full width of the page to the edges.
  • Background Full Width with contain the Quicklinks within the content body area and the background colour and/or image (which can be set below) will expand the full width of the website
• Background Colour - This colour will be displayed behind the Quicklinks as a background. If you upload a Background image, then this colour will be used as an overlay over top of the background image.
• Background Image - The background image will be displayed behind the Quicklinks as the background. You can use the Display Type to dictate if you would like this to use standard display or show the background as full width. If you set a background colour as well as upload a background image, the background colour will be an overlay overtop of the background image.

• When you have completed your entries, click Save, and you will be taken back to the Widgets page, which will show your updated Quicklink Content Block. 

  

• Content Blocks are live on your website page as soon as you click Save. So it is a good idea to preview your page and ensure the update is correct. Below is an example of Quicklinks displayed with a background image and a white overlay background colour
  

• See Editing Content Blocks  for more information on how to make changes to your Content Block.
•