Skip to content

Installation & Configuration

Keith edited this page Nov 23, 2023 · 11 revisions

Installation of the Gantry 5 Ramblers Template

Pre-requisites

Please install the following software

  • Gantry 5 Component version 5.5.15 (or higher)
  • Gantry 5 Hydrogen Template version 5.5.15 (or higher)
  • Ramblers Gantry 5 Template (from this GitHub Area)

Gantry Media (for the first two items above) can be downloaded from https://gantry.org/downloads. NOTE: The version required is for Joomla 3.9+/4.0 (do not download for Grav or WordPress)

The order of installation is as per above (Gantry 5 component first, followed by Hydrogen Template and finally the Ramblers Gantry 5 Template).

The Ramblers Gantry 5 Template should be installed using a URL link. The link below will ensures further updates provided to the template will be made available using the Joomla Update System. As such please use this link:

https://raw.githubusercontent.com/ramblerswebs/updates/master/updates/downloads/Gantry5_Template-2.0.9.zip

Configuration

After installation the Gantry template needs to be customised for the Ramblers theme using the following steps.

Template Configuration - Layout

  1. From the menu select Extensions > Templates > Styles (The screen will display a list of templates two of which will be for Gantry 5).
  2. Select the one titled 'Hydrogen - Default'. This will default to the layout page.
  3. Select the 'Load' option which will be displayed on the top right
  4. Untick the option at the top to 'Keep current Particles while changing Preset'. This is important as the structure will not change
  5. Select the Ramblers User preset on the left. Once Selected the layout will change to match the Ramblers structure.
  6. Once complete select 'Save Layout' button at the top right.

Template Configuration - Style

  1. Select the Styles Tab at the top of the page. This will display the style colours for page. You will note there are presets already present to cover common Ramblers themes.
  2. Select one of the presets. These are under the styles section and they will be pictures of a ramblers site. Click on one of the pictures.
  3. This will automatically change the colour themes below.
  4. Click 'Save Styles' button at the top right once complete.

Assignments

To ensure your website uses the new template, pages need to be assigned to use it.

  1. Select the Assignments tab at the top of the page.
  2. On each menu select the 'All' option ensuring all pages are displayed using the new menu. When selected all the appropriate pages will display a green enabled option next to them.
  3. Once complete select 'Save Assignments at the top'.

Before clearing caches, ensure the default template is set to the new Gantry 5 one.

  1. Select from the menu Extension > Templates > Styles again
  2. Select the star for 'Default' against the 'Hydrogen - Default' style.
  3. The star should turn yellow/gold.

Tidy Up unwanted templates

The default hydrogen template installation provides one named ‘Hydrogen - Home’. This can be removed as it is not used.

  1. Select from the menu Extension > Templates > Styles again
  2. Select the one titled 'Hydrogen - Home' using the selection box on the left. Then you can chose to delete at the top of the page.

Template Configuration - Error Page.

To ensure the error page has the same look and feel as the rest of the site. Complete the following

  1. From the menu select Extensions > Templates > Styles (The screen will display a list of templates two of which will be for Gantry 5).
  2. Select the one titled 'Hydrogen - Default'. This will default to the layout page.
  3. On display this will be the ‘Default’ theme as shown in the dropdown at the top left of the page. Change this to ‘Error’.
  4. Select the 'Load' option which will be displayed on the top right
  5. Untick the option at the top to 'Keep current Particles while changing Preset'. This is important as the structure will not change
  6. Select the Ramblers User preset on the left. Once Selected the layout will change to match the Ramblers structure.
  7. Once complete select 'Save Layout' button at the top right.
  8. Select the Styles ‘Tab’ to move into the Style display.
  9. Select the same style you chose for the main site; followed by the ‘Save Styles’ button on the top right.

Menu Icons

Configure the version of FontAwesome

To ensure you have the latest icons available we need to ensure it uses the latest icons available.

  1. From the menu select Extensions > Templates > Styles (The screen will display a list of templates two of which will be for Gantry 5).
  2. Select the one titled 'Hydrogen - Default'. This will default to the layout page.
  3. Change the dropdown in the top left from Default to 'Base Outline'
  4. From the Tab menu select 'Page Settings'
  5. On this page you should see a section covering the configuration of 'Font Awesome'. In this section change the version dropdown to 'Font Awesome 5 Free (Webfont / CSS)'
  6. Select 'Save Settings'.

Configuring the Menu Icons

The use of icons on menus has changed between Gantry4 and Gantry5 as we no longer use RokNavMenu. As they will need to be manually replaced using the following steps.

  1. From the menu select Extensions > Templates > Styles (The screen will display a list of templates two of which will be for Gantry 5).
  2. Select the one titled 'Hydrogen - Default'. This will default to the layout page.
  3. On the top right select the button entitled 'Menu'. This will show the current configured menu.
  4. Repeating for each menu item.
    1. Hover over the menu item (it will turn blue). A cog will be shown, select it.
    2. Towards the Bottom you will see an entry for 'Icon'. On the right select the finger to select a new icon.
    3. Search for the icon you wish to use (below are some recommendations). Select the icon of choice. Ensure you set the size to Large (at the top of the popup).
    4. When complete select 'Apply and Save'
    5. Repeat for any other menu items.

Default menu items are:

  • Home - fa-home
  • Question - fa-question-circle
  • Calendar - fa-calendar-alt
  • Routes - fa-road
  • Articles - fa-list
  • Members - fa-walking
  • Login - fa-user
  • Twitter - fa-twitter

Clear Caches / recompile template - to reset the system

  1. Select from the menu Extension > Templates > Styles again
  2. Select the one titled 'Hydrogen - Default'. This will default to the layout page.
  3. Select the 'Styles' Tab at the top of the page.
  4. Select the 'Recompile CSS' button. Wait until it has completed.
  5. Select the 'Extras' drop down menu. From that menu select 'Clear Cache'. Wait until complete.
  6. Select the 'Extras' drop down menu. Ensure the option between Development and Production at the top is set to 'Production'.
  7. Select System > Clear Cache from the main menu.
  8. Select 'Delete All' button on the top left of the display.

Finally, Load your website and check all is displayed successfully.

Clone this wiki locally