Table of Contents
Home Page Hero
This page controls what is shown in the hero area of the home page, with each set of content on a separate Wiki page. Pages should be listed below with their start and end date (leaving either blank means from the start of or until the end of time!).
Entries
When editing this table, you don't need to align the dividers, but it
can help make the code more readable. Any line beginning with | is
treated as an entry.
| Start date | End date | Page link |
|---|---|---|
| n/a | n/a | example |
| 2024-10-01 | 2024-12-31 | 2024_fundraising |
| 2023-05-29 | 2024-05-25 | 2023-05-29_mixed-champions |
| 2022-12-11 | 2023-01-10 | 2023-01-10_new-singers |
| default |
Start date: the date on which the entry becomes current in YYYY-MM-DD format, or blank space to mean from any date; any unrecognised text makes the entry ignored.
End date: the date after which the entry is no longer current in YYYY-MM-DD format, or blank space to mean forever; any unrecognised text makes the entry ignored.
Page link: a bare Wiki link to the page with the HTML content of the
hero; the [[ and ]] will be stripped off, but no other
processing is done, so link text can't be used.
Which page is shown to the visitor?
If there is more than one hero in effect at the same time, one will be chosen randomly for each page view in the following order:
-
Current heroes with start date and end date
-
Current heroes with end date only
-
Current heroes with start date only
-
Current heroes with no start or end date
What content is shown to the visitor?
Any content in <html> / </html> sections will become part of the
hero area of the home page. Full HTML syntax is available, and no Wiki
text processing is done, so links should be in <a> tags, for
instance.
You can also set CSS properties listed below with a property block:
<code yaml> ~~~ property-name: property value </code>
-
background-image: A CSS image source like
url('/path/to/image.jpg'). The image is resized to make sure it covers the hero area, and centred; make sure that the parts you want to be the focus of attention are on the horizontal mid-point of the image. The position of text in an image is difficult to predict, so use the HTML for that – the best images are simple backgrounds or photographs, that you can put text on top of (using a semi-transparent background if there's lots of variability in the image contrast). -
padding-bottom: The amount of space to pad the bottom of the hero area with; can be used with padding-top to control the vertical alignment of the content in the hero area.
-
padding-top: The amount of space to pad the top of the hero area with; can be used with padding-bottom to control the vertical alignment of the content in the hero area.