Torquay is one of our popular templates. It provides a landing page that can feature a screen wide banner, a carousel with up to six images, various card styles and widgets to display content from project pages.
Read the article on Best Image Sizes in EHQ guide for information on the best images sizes to use for this template.

NOTE: If your current theme is NOT Torquay and you would like to change it, then please get in-touch with our support team via mailto:support@engagementhq.com and we will arrange to help you through this process.

If your current theme is Torquay, you can edit it by clicking on Site Management > Homepage Manager located on the side navigation bar.

Like all themed templates, Torquay consists of different boxes which we refer to as cards or tiles. Click on any of the cards / tiles to edit them.

 

Banner

A unique feature of Torquay is the banner that stretches across the entire screen. Because this banner is responsive, it will look good on all devices and it will automatically adjust to the screen it is displayed on.

Options available for banner are:

  • Hide: You can hide or show any card. If the slider is blue then your card is currently showing, if grey then it is hidden.
  • Click to upload: Click this option to upload the banner. Supported formats are *.png and *.jpg. Refer here for the best image size.
  • Enter alt text: The alt text for your image is used for accessibility and search engine optimisation. You can leave this as it is, however, it is better to give a meaningful alt text. The text should describe, in a few words, what can be seen in your image, e.g. "company logo".

You can change or hide a banner, but you cannot delete it. Click the Save button to apply the changes.

Slider

Slider is below the banner card. The slider or carousel allows you to showcase up to 6 projects or tools in a very prominent way.

To add a slider, click on the Add button on a card.

The following Slider Item page is displayed.

Options available for slider are:

  • Hide: You can hide or show any card. If the slider is blue then your card is currently showing, if grey then it is hidden.
  • Select Card Type: Depending on your card style, you can link through to a project or tool or even use an external link to direct to some other page or website.
  • Select Project: Depending on your card style, you can link through to a project.
  • Customize Title: You can customise the title of your card. This is a mandatory field. You can NOT have cards without titles.
  • Customize Description: You can customise the description of the card in this field.
  • Upload Image: Upload an image that is displayed. This image must be 1140 by 360 pixels.
  • Customize image ALT: The alt text images in your tiles are very important for accessibility reasons. You can leave this as it is, however, it is better to give a meaningful alt text. The text should describe in a few words what can be seen in your image.
  • Customize Call To Action: Depending where you link to, you can have different call to actions that appear as a button on the public side.

Enter all the details and click the Save button to apply the changes.

The cards within the slider can be dragged and dropped to rearrange them, as illustrated below.

The Freestyle Card

The Freestyle Card is located below the slider.

The options available for Freestyle card are:

  • Hide: Every card in this template can be hidden. If the slider is blue then your card is currently showing, if grey then it is hidden.
  • Title: Give your site a title. The title will be displayed in big letters below the slider and/or banner.
  • Description: Enter the description of your page. This space should be used to describe what your site is all about and accepts basic HTML. You can format the entered description using the provided formatting options. Feel free to play around with it.
  • Upload an Image: The image or logo will be displayed to the left of your description.
  • Alternative Text: The alt text for your image is used for accessibility and search engine optimisation. You can leave this as it is, however, it is better to give a meaningful alt text. The text should describe in a few words what can be seen in your image, e.g. "company logo".
  • Settings: Under Settings, you have the following checkboxes:
  • Show Title: You can toggle on and off the title by selecting or unselecting the checkbox. Unselecting this checkbox, disables the Title box and you cannot edit it.  
  • Show Logo: You can toggle on and off the logo by selecting or unselecting the checkbox. Unselecting this checkbox, disables the Alternative Text box and you are not allowed to edit it.    

Click the Save button to save the changes.

The Small Cards

There are plenty of little cards available for use. These cards can be moved around by dragging and dropping too, as illustrated at the bottom of this article.

The options available for Small Cards are:

  • Hide: You can hide or show any card. If the slider is blue then your card is currently showing, if grey then it is hidden.
  • Details tab: In the Details tab, you can select project, customise title, upload image and customise image ALT. The different fields in this tab are:
  • Select Project: Depending on your card style, you can link through to a project.
  • Customize Title: You can customise the title of your card. This is a mandatory field. You can NOT have cards without titles.
  • Upload Image: Upload an image that is displayed. The small cards image is 360 by 360 pixels. Make sure the image you upload does not exceed 0.2MB.
  • Customize Image ALT: The alt text images in your tiles are very important for accessibility reasons. You can leave this as it is, however, it is better to give a meaningful alt text. The text should describe in a few words what can be seen in your image.
  • Customisation tab: In the Customisation tab, you can select card type and style, and set configurations.

The different fields in this tab are:

  • Select Card Type: Depending on your card style, you can link through to a project or tool or even use an external link to direct to some other page or website. Options available are project, survey, news feed, story, forum topic, brainstormer, map and custom.
  • Select Card Style: Select a style for your card.
  • Set Configurations: You can set the configuration by selecting or unselecting options like Show Status, Show Date and Show Lifecycle checkboxes. The configuration options vary based on the type of card selected in the Select Card Type drop-down menu.

Click the Save button to save the changes.

Depending on your settings for the card, this card might have a different name, but, in this case, we are linking through to a project and the card is called Project Card. If you choose to display a tool, like Survey, this would be called a Survey Card.

The Big Cards

You can choose to use as many big cards too. These can be found at the bottom of the small card list as shown below.

Use the Customisation button, at the top of the card, to choose how you would like to use this card.

You can also choose how to display the content in the card by selecting the card style, as seen below.

  • Select Card Type: Use this dropdown to select if the card will be used to display a project or a tool (like survey, idea, forum, places, etc.). If project is selected, which is the default, then the card is called a project card, if survey is selected it is called a survey card, etc.
  • Select Card Style: There are 3 card styles to choose from here.
  • Set Configurations: Use these settings to control if the status of the project, date of creation and the lifecycle of the project should be displayed on the card.

Click on Details to start customizing the card.

Depending on your settings for the card, this card might have a different name, but, in this case, we are linking through to a project and the card is called Project Card. 

  • Select Project or Tool: Depending on your card style, you can link through to a project or tool or even use an external link to link anywhere else.
  • Customise Title: You can customise the title of your card. This is a mandatory field. You can NOT have cards without titles.
  • Upload Image: Upload an image that is displayed. The recommended image is 360 by 360 pixels. Make sure the image you upload does not exceed 0.2MB.
  • Customise Image Alt: The alt text images in your tiles very important for accessibility reasons. You can leave this as it is, however, it is better to give a meaningful alt text. The text should describe in a few words what can be seen in your image.

If you choose the alternative design in Settings, there are a couple of more options to look at.

  • Customise Description: This description may auto-fill from your project or tool. We recommend you amend it here. Your tile is small, there won't be much space for text. Make sure it is precise and entices the reader to click.
  • Customise Call to Action: This card style has a call to action. Keep it short and make sure the wording you use is actually a call to action.

The Widget Cards

Widget Cards can be used to display content from any project page on your landing page. This can be done in an aggregated manner, or for a specific project.

The different options of the Widget Card are:

  • Select Project: The project from which you want to source the content. If you choose 'All Projects', EHQ takes the latest items from across all your projects (only works with some widgets).
  • Select Widget from Project: Same types that you know from managing your projects. Only widgets that you have used in your projects will appear in this list.
  • Title: Enter a title for the widget card.
  • Show Title checkbox: Choose to show or hide the title of the widget.
  • Number of Items: It is the number of lines (items) shown in the widget. The more you choose the longer the widget gets.
  • Layout: Choose between the different layout options displayed.

Click the Save button to save the changes.

The contents of the different types of widgets will order automatically by the following logic. This cannot be changed:

  • Key Dates: By date, oldest first. It will work with a rough 2 to 3 ratio. That means if you have 5 dates displayed, it will pick 2 dates that are in the past and 3 that are in the future. If you display 10 dates, it will pick 4 dates from the past and 6 from the future.
  • Related Projects: Picks the projects you have selected in the associated project and orders them by published date, oldest first.
  • Photos: Ordered by date when uploaded, newest first. 
  • Videos: Ordered by date when uploaded, newest first.
  • Documents, Important links and FAQs: Ordered by date when created, newest first.

The Freestyle Widget

The freestyle widget is similar to the custom widget in your project pages. It accepts HTML and other basic formatting. Be careful not to insert any in here without checking with us first.

The options available in the Freestyle widget are:

  • Title: Enter a suitable title in the box.
  • Description: Enter a description for the widget. You can format the description using the formatting options. 
  • Settings: Select or unselect the Show Title checkbox to show or hide the title. If the checkbox is not checked, the Title box is disabled.

The Sign-up banner

Unlike the sign-up banner on project pages, sign-up banners on home-pages can only be uploaded. However, you can always download the sign-up banner from the project page and upload it on the home-page.

The Lifecycle Widget

The Lifecycle widget is the same as your Lifecycle widget in any project. You can set up the widget in the project and then simply select this widget to be displayed on your homepage. 

Drag and Drop Small Cards and Widgets

In this template you can rearrange the small cards and widget cards as per your choice, by dragging and dropping. Only the cards at the top end like banner, slider and freestyle cards will always remain in the same place and cannot be moved. Any of the small cards can be dragged and dropped into another position for a small card and any of the widgets can be dragged and dropped into another widget position card. Just click and drag the card you would like to move into its new place. You will see that the position of the two cards is interchanged. This is illustrated below.

Did this answer your question?