Joomla! 4 Templates
What is a Template?
A Template is an extension which enables you to control the Look and Feel of your website.
A Template includes one or more Style Sheets.
A WYNCHCO Template Design comprises:
- three Style Sheets (each containing many styles),
- plus a compendium of more than 100 Custom Style Sets (organised into groups).
Each group of Custom Style Sets can be changed:
- quickly and easily,
- without any technical know-how, and
- without having to edit any code
via your website's Dashboard.
In short, you can change the Look and Feel of your website with just a few simple clicks!
We show you how in this Joomla! User Guide.
Read more: How to change Look and Feel.
template.css
This Style Sheet is included with the 'off the shelf' Joomla! CMS.
It contains the building blocks which determine the appearance of all Joomla! websites, including the provision of the CSS Grid System.
We use the CSS Grid System to determine how Modules are displayed in your website.
user.css
This Style Sheet is added by us when we create a bespoke WYNCHCO Website Design for you.
The unique Look and Feel of your website is determined by this Style Sheet.
editor.css
We add this Style Sheet to a WYNCHCO Template to enable you to add your own style sets which can be easily applied when you edit website content using the JCE Content Editor.
Follow the steps below to view the content of each individual Style Sheet included with a WYNCHCO Template Design.
1) Open the Site Templates screen.
Select System to open the System Dashboard.
Next select Site Templates from the Templates panel.
2) Select the Template for which you want to view Style Sheets.
3) Select CSS from sidebar.
4) Select the CSS file you wish to view (in this example: user.css).
Follow the steps below to change a Custom Style Set (Example: SITE - Website Width).
1) Open the Site Template Styles screen.
Select System to open the System Dashboard.
Next select Site Template Styles from the Templates panel.
2) Select the Template for which you want to view and edit a Custom Style Set (in this example: 4-3-0-94).
3) Select a Custom Style tab (in this example: Site).
4) Change a Custom Style element (in this example: Website Width).
In this example you can toggle between FIXED Width and FULL Width to change the width of your website when it is viewed in browsers on large screen devices.