Website Templates

Before we dive into bespoke website templates, this subject is not for the faint-hearted! To be able to use a bespoke template, you must understand what CSS and JavaScript are, what HTML is and how it all ties together to form a web page.

Currently, the system has 15 web templates to choose from. They are basically the same layout but with a different colour palette.

However, you are somewhat restricted with a default template so if you want more control, you need to select "Bespoke Template"  from the "Setup > Club > Club details" page on the "Website Settings" tab.

As soon as you select "Bespoke Template", 3 more fields will appear.

1. Website Template HTML - This is the HTML that forms your template
   

2. Website Template CSS - This is the CSS for your template
   

3. Website Template JavaScript - This is the JavaScript that you want to use
   

The system will automatically include the following libraries for you so you DO NOT NEED to include them in your template yourself:

• JQuery version 1.11.0
  

• Bootstrap version 3.3.6
  

• Font Awesome version 4.2.0
  

• HTML5Shiv
  

• Respond
  

There are certain special tags that you can insert into your template so that when your page is rendered, certain things happen such as the navigation is displayed.

The available tags are:

{clubLogo}

Inserts your club logo that you have set in the "General Settings" section on the "Website Settings" tab.

{navigationLinks}

Inserts a Bootstrap horizontal navigation menu.

{navmenu}

Inserts a vertical navigation menu.

{sideBar}

Inserts a sidebar with search form, featured news & featured pages tabs as well as any social media links you have added and Twitter widget code.

{searchForm}

Inserts a search form

{webAddress}

Inserts your club website address

{featuredNews,05}

Inserts the top 5 featured news items (no spaces and 2 digit number from 01 to 99)

{latestNews,05}

Inserts the top 5 news items ordered in descending order (no spaces and 2 digit number from 01 to 99)

{featuredPages,05}

Inserts the top 5 featured pages (no spaces and 2 digit number from 01 to 99)

{pageTitle}

Inserts the current page's title

{pageDescription}

Inserts the current page's description

{pageContent}

Inserts the current page's main content

{whosWho}

Inserts your who's who

{clubSessions}

Inserts a table of your club sessions

If you would like to be able to hide the sidebar on certain pages and news items, you need to give your main content div an id of "main_content" and your sidebar div an id of "side_bar".

Do not include any "forms" or form tags in your template.