Page 4 of 8
How to assign a Module to a Position
In other words, control WHERE it is displayed.
Published MODULES will not be visible in your website until they have been ASSIGNED to a POSITION.
A POSITION is a placeholder for the purpose of displaying MODULES
A very simple Template might comprise of just two Positions:
- Top (dark grey in the image below), and
- Right (light grey)
and a MAIN BODY (the white area).
The MAIN BODY is where website ARTICLES are displayed.
It is not a Position, but it fulfills a similar role.
Published Articles are by default displayed in the MAIN BODY.
Published Modules will not be visible in your website until they have been assigned to a Position.
The Position determines when and where they will be visible (for example, at the Top or on the Right).
In a WYNCHCO website design, the Position to which a Module is assigned will also determine WHEN it is visible, depending upon:
- the device and
- screen size
used by the visitor.
The Position to which a Module has been assigned will determine whether it is visible on:
- PCs & Tablets (landscape) only,
- Phones & Tablets (portrait) only, or
- ALL devices regardless of screen size.
Example: Assign a Custom Module to a Position
The process is the same regardless of module type.
In this example we refer to assigning a Custom Module.
Open the Modules Screen
To open the Modules screen, select the Modules button from the welcome screen of your website's control panel.
Choose Module to Assign
Use the filters at the top of the screen to select a Module to assign.
The image below shows CUSTOM Modules in the BOTTOM-BAR Position.
Next, click on the Module name to open it and edit its settings.
Assign the Module to a Position
Under the MODULE tab you will find the POSITION field either:
- to the right (on large screen devices) or
- below (on small screen devices)
the TITLE field and the CONTENT EDITOR panel - see below.
The POSITION Field
Choose a Position in which to display the Module.
Position Maps
The Positions in a WYNCHCO website design can be seen in two Position Maps:
- Position Map: PCs and Tablets (landscape).
- Position Map: Phones and Tablets (portrait).
Each Position Map also shows four Positions which may be used to display Modules on ALL devices regardless of screen size.
Position Map: PC & Tablets (Landscape)
Unshaded boxes indicate Positions visible only on PC & Tablets (Landscape).
Shaded boxes indicate Positions visible across ALL devices regardless of screen size.
Positions
These Positions are only visible by default on PCs & Tablets (landscape):
- navbar-landscape-top,
- navbar-landscape-top-right,
- top-left,
- top-right,
- sitebanner-right,
- navbar-landscape,
- landscape-top,
- left,
- navbar-mainbody,
- right,
- landscape-bottom.
OFFCANVAS Position
The OFFCANVAS Position (not shown on the above map) supports the publication of Modules at the edge of the browser window.
For example: a CALL TO ACTION message.
A Module assigned to the OFFCANVAS Position may be displayed at the bottom, left or right edge of the browser window.
Position Map: Phone & Tablets (Portrait)
Unshaded boxes indicate Positions visible only on Phones & Tablets (Portrait).
Shaded boxes indicate Positions visible across ALL devices regardless of screen size.
Positions
These Positions are only visible by default on Phones & Tablets (portrait):
- navbar-portrait-top,
- portrait-top,
- navbar-portrait,
- portrait-bottom.
Positions visible on ALL Devices & Screen Sizes
These Positions, indicated by shaded boxes on Position Maps, are visible on ALL devices and screen sizes:
- above,
- below,
- base,
- footer.
Control when Positions are visible
You can edit or remove a POSITION Style Set to change which device any one Position is visible on.
For example, whilst the LEFT and RIGHT Positions are by default visible only on PCs & Tablets (landscape), you can change this.
Read more: Working with POSITION Style Sets.
Create new Positions
There are two ways in which POSITIONS can be created:
- by editing the Template, and
- by using the LOADPOSITION Command.
We recommend using the LOADPOSITION Command if you want to have more control over where content is displayed within your website.
Read more: How to use the LOADPOSITION Command.
Preview Positions
We show how to preview Positions via the Templates screen of your website's control panel in our separate article.
Read more: How to preview Positions.
Work smarter NOT harder!
We coach, help and support managers of businesses and organisations across Cheshire, Manchester, Merseyside, North West England and the UK.
Learn how to manage a Joomla! website.
