Torquay is one of our popular templates. It provides a landing page that can feature a screenwide 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.

All changes to your Torquay template can be done in the 'Homepage Editor', which you can access by clicking on Site > Theme in the top navigation bar of EHQ. 

The Theme page is displayed to enable you to edit your homepage. Click on the Edit your Homepage circle as highlighted below.

Like all the themed templates, Torquay consists of different boxes which we refer to as cards or tiles. Click on any of the cards/tiles on the left side and the right hand panel to edit will appear.

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 as the banner will automatically adjust to the screen it is displayed on.

Your options:

  • Show: You can hide or show any card. If slider is green then your card is currently showing, if grey then it is hidden.
  • Upload Image: Refer here for best image size.
  • Customise 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".

Make sure to hit save if you want your changes to be applied.

Slider

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

Your options for each slider item are:

  • Show: If show button slider is green then your slider 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 or Tool: Depending on your card style, you can link through to a project or tool.
  • 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. This image must be 1140 by 360 pixels. For more detail, click here.
  • 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.
  • Customise Call To Action: Depending where you link to, you can have different call to actions that appear as a button on the public side.

The cards within the slider can be dragged and dropped to rearrange them.

The Freestyle Card

Below the Slider is the Freestyle Card. 

You have different options here:

  • Show: Every card in this template can be hidden. If slider is green 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: Change the description of your page. This space should be used to describe what your site is all about. This accepts basic HTML. Feel free to play around with it if you feel comfortable.
  • Upload 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: You can toggle on or off your title and the logo.

Make sure to hit save if you want your changes to be applied.

The Small Cards

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

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

Click on the Settings button to bring up the settings options, as 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 2 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 Go Back 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. 

  • Show: You can hide or show any card. If slider is green then your card is currently showing, if grey then it is hidden.
  • Settings: Click on settings to change the card style and make further changes.
  • 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 small cards 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 new 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 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 Settings button, at the top of the card, to choose how you would like to use this card.

Click on the Settings button to bring up the settings options, as 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 2 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 Go Back 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

The widgets 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.

Your options:

  • 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 Type: Same types that you know from managing your projects. Only widgets that you have used in your projects will appear in this list.
  • Customise Title: You can customise the title of your card. You can also opt to show no title at all.
  • Show Title: Choose to show or hide the title of the widget.
  • Number of items: The number of lines (items) shown in the widget. The more you choose the longer the widget gets.
  • Select Layout: Choose between the different layouts options shown.

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 Lifecycle Widget

The Lifecycle widget is the same as your Lifecycle widget in any project. You 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 re-arrange the small cards and widget cards as per your choosing by dragging and dropping. Only the top cards like the banner, slider and freestyle cards will always remain in the same place at the top of the template 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 it's new place. You will see that the position of the two cards are interchanged. This is illustrated below.

Notice that when you hover over a widget card a dustbin symbol appears. This can be used to delete the widget when not required any more.


What's Next? Customise your site colours as described in the article on Primary and Secondary Colours.

Did this answer your question?