Documentation

Header

The Site Name is a global area in the header where you can add your logo using an image block or type your site title into a content block. To style your heading the same as the demo, choose Header 1 from the paragraph format menu in the content editor.

Navigation

The navigation block automatically takes your site tree and creates the navigation for you with one level of sub navigation. If you need to reorder anything in the navigation just go to your Dashboard and click on SITEMAP > Full Sitemap . If you hover over a page title your cursor will turn to a cross and allow you to drag and drop each page to reorder.

To remove a page from the navigation just click on the page in the sitemap and select Properties, click on the tab Custom Attributes, click on Exclude From Nav, scroll up and check the box Yes, click Save.

Fullscreen Backgrounds

The Fullscreen Background is a block you will have available to you once Hi-Vis is installed. To use it simply add the block to an area of your website the same way you would any other block type. It will show up in the list of available blocks after the core blocks.

If you want the background(s) to show up on all pages then add it to the header or one of the footer areas which are global areas.

You can choose the level of opacity for the overlay within the block options.

If you prefer to have a single still image, just add one image and the slideshow effect won't activate.

Icons

If you want to add social links to your site you should use 5.7s Social Links block. If you'd like to add other icons to your page you can use  the Font Awesome icons included with Hi-Vis bu adding an html block and using the following syntax:

<i class="fa fa-rocket"></i>

<i class="fa fa-anchor"></i>

<i class="fa fa-heart"></i>

For more information and a full list of icons check out: http://fortawesome.github.io/Font-Awesome/examples/

Panels

Panels are a useful way of creating page hierrachy and highlighting important content.

To change any content block to a panel:

  1. Click on the block and choose 'Design & Custom Template' from the menu.
  2. Click on the cog icon.
  3. Choose 'Panel' from the Custom Template dropdown. 

Browser Support

Hi-Vis is built with Zurb Foundation Framework v5 which works with Chrome, Safari, Firefox and Internet Explorer 9+ Please note that IE8 support is limited as it does not support CSS3 media queries which make the site responsive.