Brand UI Kit
Colours:
Primary
#ef373e
Secondary
#ffffff
Background Colours:
Brand 1
#D9E4EF
Brand 2
#FFFFFF
Brand 3
#78BE20
Brand 4
#796E65
Greyscale Colours:
Dark Champagne
#cdbbac
Cool Grey
#c6cdd1
Royal Blue
#878a8f
Grey
#e2e6e8
Buttons:
Links
IMPORTANT: Before applying any of the following link styles, make sure that the element you're applying the style to is ALREADY a link. See Working With Custom HTML Modules' Content Editors (WYSIWYG) to learn how to add a link inside your content editor.
*Use your mouse to hover over links in order to see their hover states.
Typography:
Select the text in the editor and choose the theme heading in the STYLE dropdown
Headline 1
46pxHeadline 2
36pxHeadline 3
24pxHeadline 4
20pxHeadline 5
16pxFont Family:
'GillSans', Helvetica, Arial, Helvetica, sans-serif
Font Weights:
400 (regular), 600 (Semi Bold)
Default copy:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
14px
Block Quote:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
18px
First and Last Name
Title and Department
14px
Style Management
The following labels refer to styling options/classes in the "STYLE" dropdown menu located in the toolbar in every Custom HTML Module's content editor. To use Style Management, highlight the text you want to apply the style to, then click the STYLE dropdown. Select the style you want. The Identifier field (custom class field) is for developer use only, as this can control the layout and aesthetics of the module / section.
| STYLE NAME | STYLE DESCRIPTION |
| Headline 1 | Applies styles for a Title (uses H1 styles by default) |
| Headline 2 | Applies styles for a Title (uses H2 styles by default) |
| Headline 3 | Applies styles for a Title (uses H3 styles by default) |
| Headline 4 | Applies styles for a Title (uses H4 styles by default) |
| Headline 5 | Applies styles for a Title (uses H5 styles by default) |
Custom HTML Modules: Content Editor (WYSIWYG) FAQs
How do I replace placeholder ("lorem ipsum") or unwanted text content?
The content editor can be finicky. To replace placeholder or unwanted text, we recommend that you first click the “BLOCKS” button in the toolbar to reveal outlines surrounding block-level elements. Then, select the text you wish to replace and type in your desired text. Or, you can place your cursor at the end of the text you want to replace, add your desired text, and then select and delete the placeholder text preceding it. We do NOT recommend selecting all placeholder text in the editor and deleting it before you add your desired content. As a result you may accidentally erase necessary markup that the content depends on. It is always best to edit text elements one at a time rather than deleting everything you don’t want from the start.
Can I copy/paste from other sources?
Be very careful when copy/pasting text content from other sources into a Custom HTML module's content editor. When copying from an external document, take steps to ensure the text you are copying is plain text (as opposed to rich text.) When copying from a web page, make sure you are ONLY including text and not actual HTML tags (<p>, <br>, etc.) as this could result in unintended styling/format inconsistencies.
How do I change the appearance of text content (color, font size, etc)?
The "STYLE" dropdown in the toolbar can be used to edit the styling/appearance of content. Keep in mind that when you add a style from the dropdown, it does not overwrite other styles previously applied to the element. This allows greater flexibility in cases where you may need more than one style applied, but you will need to remember to uncheck undesired styles after applying them.
Please refer to Style Management for examples of classes/styles you may apply.
Keep in mind that changing the appearance or styles of text should be done SPARINGLY - for the sake of consistency across pages, it is best to stick with the module's default styling whenever possible.
How do I add/edit a link?
The "insert/edit link" button in the toolbar is used to create and modify links:
To create a new link, type your desired link text within the content editor, select it, and then click the "insert/edit link" button. This may be tricky if you're creating a new link next to an already-existing link. To do this, place your cursor at the end of the existing link's text and then press the right arrow key, so your cursor is outside the existing link. Then, type the new link's text, select it and click the "insert/edit link" button.
To modify an existing link, click into the middle of the link text within the content editor, then click the "insert/edit link" button.
Note: Using proper link text is very important. For more details, see "Does it matter what I use for [clickable] link text?" in General Advice & FAQs.
How do I add/edit an image?
The "asset picker" button in the toolbar allows you to add images into the content editor. To modify an existing asset, click the asset and then click the "asset picker" button. Not all custom HTML modules were made with the intent to have an image placed in them. (Tip: If your default placeholder content did not contain an image, you should probably avoid adding one with this tool.)
Note: If you're including an image in a Custom HTML module, remember to consider the image alt text (which is editable through the "asset picker" button), and include a value when necessary. For more details, see "Do I need to update/include alt text for every image?" in General Advice & FAQs.
How do I add a code snippet?
The "insert code snippet" button in the toolbar adds pre-made snippets of code into the content editor. Note that code snippets are often (but not always) used as a way to revert either the entire content of a Custom HTML Module to its default state, or to revert a part of its content to its original state. In many cases you will not need to use code snippets unless you're attempting to "fix" a module (i.e. bring back original content which was since removed.)
Additionally, code snippets are used as a way to add specific html into your content editor that is either difficult or impossible to achieve without editing the actual source code.
IMPORTANT: Be very careful to only use code snippets that are intended for use in the specific module you’re editing. In most cases the name of the code snippet should partially or exactly match the name of the module you’re editing. A list of all code snippets that are intended for use within a module will appear in that module's parent section's documentation in the Section Guide. Do not use a code snippet when the section name in the title of the code snippet does not match the section you are currently editing. For example, if you're editing a section created from a section template labeled as "Section 1" you should only be using code snippets whose titles include "Section 1."
I've messed up my edits and would like to revert to the original "lorem ipsum" placeholder content. Is there a way to do that?
Check to see if the module you're editing has a default code snippet available. The name of the snippet should match the name of your module (minus the given section name prefix.) If so, you may delete the entire content and then insert the appropriate code snippet. Some modules don't have default code snippets available, but they may have other snippets which could replace specific portions of your content.
Does it matter which levels of headings (H1, H2, etc) I use in my content?
Yes. For SEO and accessibility purposes, it is important that your page’s heading structure is hierarchical. This means that your page’s top heading needs to be an h1 heading.
You should also be careful to avoid skipping heading levels (i.e. using an h3 heading before an h2 has been used, etc.) If you need to change the appearance of a heading without changing the level, apply one of the heading classes from the content editor's "STYLE" dropdown (see Style Management for a list of these heading style classes.)
Page Templates
What page templates are available to create new pages with?
The following page templates are available in the "CMS Primary Theme" theme:
- Career Area Template - Suggested Use: Content pages relating to Career Areas.
- Employee Story Template - Suggested Use: Content pages relating to Employee Stories.
In which theme should I create my page? / Which theme should my page be assigned to?
To use one of the page templates, you must create your page inside the theme where the desired page template resides. You may later assign the page to another theme if needed.
See General Advice & FAQs for more details.
What if I don't need all the sections used in a template?
Before using a CMS page template to create a page, determine if you’re going to need all the sections used in that template. Then, after using the template to create a new page, remove the sections from the page which aren’t needed BEFORE SAVING THE NEW PAGE. This prevents those sections from ever being created and we avoid cluttering the system with unused sections and modules.
Can I create a CMS page without using one of the CMS Page Templates?
General Advice & FAQs
How can I ensure that my content will be accessible to all users?
Be sure to follow all recommendations and instructions given in this guide, particularly the recommendations involving link text, image alt text, and heading levels. To learn more about accessibility, please see Accessibility for Radancy CMS Publishers.
Can I change the layout assignment of a page/section/module?
You should never change a layout assignment unless specifically instructed to do so in the relevant section's documentation found in the Section Guide. This will almost always lead to unintended results.
Can I add a module to a section?
You should never add a module to a section unless specifically instructed to do so in the relevant section's documentation found in the Section Guide. This will almost always lead to unintended results.
When I'm adding a section from the "Add New" section menu to a page, what should I name my new section?
To avoid future confusion, especially for other CMS users who may need to edit/update the content you're creating, naming conventions should be consistent throughout the site. When creating a section that you anticipate will only be used on the page you're adding it to, we recommend the following naming convention: [Page Name OR Abbreviated Page Name] - [Section Template Name] [Number (only include if you anticipate other sections of the same template will be added to the same page.)] For example, "Benefits - Full Width Copy" or "DEI - Full Width Copy 1." If you anticipate that the section you're creating may be used on other pages as well, we suggest giving it a name that summarizes its purpose/intent rather than its content or context (which may change or be updated later.) For example, "Human Resources Job List" or "Annual Job Fair CTA."
Note: While you CAN change a section's name after creating it, you will NOT be able to change the names of the modules included in the section (which will, by default, include the ORIGINAL section name.) So we recommend that you carefully choose a good name for each section you create.
Can I create a CMS page without using one of the CMS Page Templates?
Yes, but this is not recommended as creating a page without using a CMS Page Template will require you to select a page layout. To avoid selecting the incorrect layout, we recommend using one of the available CMS Page Templates, in all cases.
If you are looking to create a "blank" page, see the next question.
How do I create a "blank" page?
To create a blank page, click the "Add Page" button in the "CMS Primary Theme" theme and select the "Blank" page template. To clarify, the option is called "Blank".
Which theme should my page be assigned to?
All CMS pages should be assigned to the "CMS Primary Theme" theme.
DO NOT assign any CMS pages to the "Default Theme (GST)" theme. This theme is enabled for CMS due to system requirements, but it is NOT intended to be used as a theme for CMS Pages.
Do I need to update/include alt text for every image?
Every time you add or replace an image file, you should consider whether to include alt text for the image. In some cases, such as when the image is considered descriptive and not essential to the page content, alt text may be left blank. For more details, please see this alt text decision tree. Not only are these considerations essential in making the site accessible to non-visual users, it will also improve SEO.
Does it matter what I use for [clickable] link text?
It matters a lot. To make links accessible to all users, use link text that would make sense to users if taken out of the surrounding context. For example, "learn more about our benefits" is acceptable, whereas "click here" or "learn more" are not. This is important in all situations but be particularly careful when adding/editing links inside Custom HTML modules, as you'll have full control over what text is included in a link.
How do I update/add a hero banner to my page?
There are two ways to add a hero banner to your page. As with other Sections, you would add a new Section to your page named "Section 10 - Hero Banner" or "Section 10 - Hero Banner With Search Form". Which one you choose depends on whether you would like the banner to include a Search Form within the section. Provide a name for your module and place to the top of the list of sections (of your page) and save the changes.
CMS User Notes
How can I add to or update the notes to this section?
Find this section (title: "CMS guide - CMS User Notes") in your section list and edit its "CMS guide - CMS User Notes Copy" module to add as many notes as you'd like right here. Be careful to not delete this instructional text, so that it may be referenced later on.
Add your notes below:
Section Guide
Important! Before using a section from this guide, please read the corresponding documentation for that section. Documentation is found above each section in this guide.
Note that section titles are NOT color coded based on which menu they can be found in after clicking the "add section" button on any page. Instead, there is a label ("CMS Enable:") followed by either a "TRUE" or "FALSE" value:
FALSE - find this section in the "Use Existing" Menu.
TRUE - find this section in the "Add New" Menu.
Keep in mind that when you edit a section from the "Use Existing" Menu, you are editing every instance of that section. Sections added via the "Add New" Menu are safe to be edited freely, as a new instance of the section is created every time it's added to a page.
Section 10 - Hero Banner With Search Form
CMS Enable: Add New
Code Snippet: Section 10 - Copy
Notes: The "Section 10 - Hero Banner With Search Form" consists of a MEDIA module and CUSTOM Html module and is set up so that it is editable. User can ONLY update the placeholder image and text of the content
THIS SECTION SHOULD ONLY BE USED IF BANNER HAS NOT BEEN APPLIED VIA BANNER OPTION ON PAGE LEVEL IN SITE ADMIN
Available Modules to EDIT:
- Section 10 - Image: Use this to replace Image.
- Section 10 - Copy: Use this to replace the text. Please use Code Snippet: "Section 10 - Copy" (Custom HTML)
Section 10 - Hero Banner
CMS Enable: Add New
Code Snippet: Section 10 - Copy
Notes: The "Section 10 - Hero Banner" consists of a MEDIA module and CUSTOM Html module and is set up so that it is editable. User can ONLY update the placeholder image and text of the content
Available Modules to EDIT:
- Section 10 - Image: Use this to replace Image.
- Section 10 - Copy: Use this to replace the text. Please use Code Snippet: "Section 10 - Copy" (Custom HTML)
Section 6 - Copy and 5 CTAs
CMS Enable: Add New
Code Snippet: Section 6 - Intro Copy
Notes: The "Section 6 - Copy and 5 CTAs" consists of 1 CUSTOM HTML modules and 5 CALLOUT ACTION LINK MODULES. "Section 6 - CTA 1" and other 4 modules hold the image, copy and link. User and Content Editor can update content in the Callout Action Link Module. Images will automatically be sized to 100x100 pixels and have the border shape applied.
Available Modules to EDIT:
- Partial 1:
- Section 6 - Intro Copy: Use this to replace the introduction text. Code snippet avalaible: "Section 6 - Intro Copy" (Custom HTML)
- Partial 2:
- Section 6 - CTA 1: Use this to replace image, text and link.
- Section 6 - CTA 2: Use this to replace image, text and link.
- Section 6 - CTA 3: Use this to replace image, text and link.
- Section 6 - CTA 4: Use this to replace image, text and link.
- Section 6 - CTA 5: Use this to replace image, text and link.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 17 - 1 Col Copy
CMS Enable: Add New
Code Snippet: Section 17 - Copy
Character Count: Title - 30 & Paragraph text - 340
Available Modules to EDIT:
- Section 17 - Copy: Use this to replace the text. Please use Code Snippet: "Section 17 - Copy" (Custom HTML)
Section 17a - 1 Col Copy
CMS Enable: Add New
Code Snippet: Section 17a - Copy
Character Count: Title - 30 & Paragraph text - 340
Available Modules to EDIT:
- Section 17a - Copy: Use this to replace the text. Please use Code Snippet: "Section 17a - Copy" (Custom HTML)
Section 19 - Copy & Image
CMS Enable: Add New
Code Snippet: Section 19 - Copy
Character Count: Title - 30 & Paragraph text - 450
Available Modules to EDIT:
- Section 19 - Image: Use this to replace image and video.
- Section 19 - Copy: Use this to replace the text. Code snippet avalaible: "Section 19 - Copy" (Custom HTML)
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 19a - Image & Copy
CMS Enable: Add New
Code Snippet: Section 19 - Copy
Character Count: Title - 30 & Paragraph text - 450
Available Modules to EDIT:
- Section 19 - Image: Use this to replace image and video.
- Section 19 - Copy: Use this to replace the text. Code snippet avalaible: "Section 19 - Copy" (Custom HTML)
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 20 - Image & Copy
CMS Enable: Add New
Code Snippet: Section 20 - Copy + CTA
Character Count: Title - 30 & Paragraph text - 450
Available Modules to EDIT:
- Section 20 - Image: Use this to replace image and video.
- Section 20 - Copy: Use this to replace the text. Code snippet avalaible: "Section 20 - Copy + CTA" (Custom HTML)
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 20a - Copy & Image
CMS Enable: Add New
Code Snippet: Section 20 - Copy + CTA
Character Count: Title - 30 & Paragraph text - 450
Available Modules to EDIT:
- Section 20 - Image: Use this to replace image and video.
- Section 20a - Copy: Use this to replace the text. Code snippet avalaible: "Section 20 - Copy + CTA" (Custom HTML)
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 20b - Copy & Image
CMS Enable: Add New
Code Snippet: Section 20 - Copy + CTA
Character Count: Title - 30 & Paragraph text - 1820
Available Modules to EDIT:
- Section 20b - Image: Use this to replace image and video.
- Section 20b - Copy: Use this to replace the text. Code snippet avalaible: "Section 20 - Copy + CTA" (Custom HTML)
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 21 - 6 Cards
CMS Enable: Add New
Code Snippet: Section 21 - Intro Copy / Section 21 - 6 Cards
Character Count: Title - 30 & Card Title - 30 & Paragraph text - 300
Notes: The "Section 21 - 6 Cards" consists of 1 CUSTOM HTML module for the Intro copty and and 1 CUSTOM HTML module for all 6 tiles. "Section 21 - 6 Cards" consists of the image and copy. User and Content Editor can update content in the Media Module.
Available Modules to EDIT:
- Partial 1:
- Section 21 - Copy: Use this snippet "Section 21 - Intro Copy".
- Partial 2:
- Section 21 - 6 Cards: Use this to replace and add text / image / anchor. Use snippet "Section 21 - 6 Cards"
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 22 - 4 Cards
CMS Enable: Add New
Code Snippet: Section 22 - Intro Copy
Character Count: Title - 30 & Paragraph text - 300 & Card Paragraph text - 244
Notes: The "Section 22 - 4 Cards" consists of 1 CUSTOM HTML modules and 4 MEDIA MODULES. "Section 22 - Image - 1" and other 3 modules hold the image and copy. User and Content Editor can update content in the Media Module. Media Type is where the image is updated and the Description field is the text beneath the image.
Available Modules to EDIT:
- Partial 1:
- Section 22 - Copy: Use this snippet "Section 22 - Intro Copy".
- Partial 2:
- Section 22 - Image - 1: Use this to replace and add text / image.
- Section 22 - Image - 2: Use this to replace and add text / image.
- Section 22 - Image - 3: Use this to replace and add text / image.
- Section 22 - Image - 4: Use this to replace and add text / image.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 22a - 3 Cards
CMS Enable: Add New
Code Snippet: Section 22 - Intro Copy
Character Count: Title - 30 & Paragraph text - 300 & Card Paragraph text - 244
Notes: The "Section 22a - 3 Cards" consists of 1 CUSTOM HTML modules and 4 MEDIA MODULES. "Section 22a - Image - 1" and other 3 modules hold the image and copy. User and Content Editor can update content in the Media Module. Media Type is where the image is updated and the Description field is the text beneath the image.
Available Modules to EDIT:
- Partial 1:
- Section 22 - Copy: Use this snippet "Section 22 - Intro Copy".
- Partial 2:
- Section 22a - Image - 1: Use this to replace and add text / image.
- Section 22a - Image - 2: Use this to replace and add text / image.
- Section 22a - Image - 3: Use this to replace and add text / image.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 22b - 2 Cards
CMS Enable: Add New
Code Snippet: Section 22 - Intro Copy
Character Count: Title - 30 & Paragraph text - 300 & Card Paragraph text - 244
Notes: The "Section 22b - 2 Cards" consists of 1 CUSTOM HTML modules and 4 MEDIA MODULES. "Section 22b - Image - 1" and other one modules hold the image and copy. User and Content Editor can update content in the Media Module. Media Type is where the image is updated and the Description field is the text beneath the image.
Available Modules to EDIT:
- Partial 1:
- Section 22 - Copy: Use this snippet "Section 22 - Intro Copy".
- Partial 2:
- Section 22b - Image - 1: Use this to replace and add text / image.
- Section 22b - Image - 2: Use this to replace and add text / image.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 22 (With Shadow) - 4 Cards
CMS Enable: Add New
Code Snippet: Section 22 - Intro Copy
Character Count: Title - 30 & Paragraph text - 300 & Card Paragraph text - 244
Notes: The "Section 22 (With Shadow) - 4 Cards" consists of 1 CUSTOM HTML modules and 4 MEDIA MODULES. "Section 22 - Image - 1" and other 3 modules hold the image and copy. User and Content Editor can update content in the Media Module. Media Type is where the image is updated and the Description field is the text beneath the image.
Available Modules to EDIT:
- Partial 1:
- Section 22 - Copy: Use this snippet "Section 22 - Intro Copy".
- Partial 2:
- Section 22 - Image - 1: Use this to replace and add text / image.
- Section 22 - Image - 2: Use this to replace and add text / image.
- Section 22 - Image - 3: Use this to replace and add text / image.
- Section 22 - Image - 4: Use this to replace and add text / image.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 22a (With Shadow) - 3 Cards
CMS Enable: Add New
Code Snippet: Section 22 - Intro Copy
Character Count: Title - 30 & Paragraph text - 300 & Card Paragraph text - 244
Notes: The "Section 22a (With Shadow) - 3 Cards" consists of 1 CUSTOM HTML modules and 4 MEDIA MODULES. "Section 22a - Image - 1" and other 3 modules hold the image and copy. User and Content Editor can update content in the Media Module. Media Type is where the image is updated and the Description field is the text beneath the image.
Available Modules to EDIT:
- Partial 1:
- Section 22 - Copy: Use this snippet "Section 22 - Intro Copy".
- Partial 2:
- Section 22a - Image - 1: Use this to replace and add text / image.
- Section 22a - Image - 2: Use this to replace and add text / image.
- Section 22a - Image - 3: Use this to replace and add text / image.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 22b (With Shadow) - 2 Cards
CMS Enable: Add New
Code Snippet: Section 22 - Intro Copy
Character Count: Title - 30 & Paragraph text - 300 & Card Paragraph text - 244
Notes: The "Section 22b (With Shadow) - 2 Cards" consists of 1 CUSTOM HTML modules and 4 MEDIA MODULES. "Section 22b - Image - 1" and other one modules hold the image and copy. User and Content Editor can update content in the Media Module. Media Type is where the image is updated and the Description field is the text beneath the image.
Available Modules to EDIT:
- Partial 1:
- Section 22 - Copy: Use this snippet "Section 22 - Intro Copy".
- Partial 2:
- Section 22b - Image - 1: Use this to replace and add text / image.
- Section 22b - Image - 2: Use this to replace and add text / image.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 23 - 6 Icons
CMS Enable: Add New
Code Snippet: Section 23 - Intro Copy
Character Count: Title - 30 & Paragraph text - 300 & Icon Title - 30 & Icon Paragraph text - 100
Notes: The "Section 23 - 6 Icons" consists of 1 CUSTOM HTML modules and 6 MEDIA MODULES. "Section 23 - Icon - 1" and other 5 modules hold the image and copy. User and Content Editor can update content in the Media Module. Media Type is where the image is updated, Alternative Text field is for the icon's heading the Description field is the text beneath the heading.
Available Modules to EDIT:
- Partial 1:
- Section 23 - Copy: Use this snippet "Section 23 - Intro Copy".
- Partial 2:
- Section 23 - Icon - 1: Use this to replace and add text / image.
- Section 23 - Icon - 2: Use this to replace and add text / image.
- Section 23 - Icon - 3: Use this to replace and add text / image.
- Section 23 - Icon - 4: Use this to replace and add text / image.
- Section 23 - Icon - 5: Use this to replace and add text / image.
- Section 23 - Icon - 6: Use this to replace and add text / image.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 24 - Image & Quote
CMS Enable: Add New
Code Snippet: Section 24 - Quote Copy
Character Count: Quote text - 300
Available Modules to EDIT (Notes):
- Section 24 - Image: Use this to update IMAGE. Images are NOT automatically cropped to circular shape. All circular cropping must be flattened into the image file prior to upload.
- Section 24 - Copy: Use this to replace the text. Please use this snippet in Module: "Section 24 - Quote Copy".(Custom HTML)
Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus.
First and Last Name
Title and Department
Section 25 - 2 Col Quote Copy With Image
CMS Enable: Add New
Code Snippet: "Section 25 - Quote Copy"
Character Count: Quote text - 300
Notes: The "Section 25 - 2 Col Quote Copy With Image" consists of 2 CUSTOM HTML modules and 2 Media Modules.
Available Modules to EDIT:
- Partial 1:
- Section 25 - Image - 1: Use this to replace and add Imagery.
- Section 25 - Quote Copy - 1: Use Snippet: Section 25 - Quote Copy.
- Partial 2:
- Section 25 - Image - 2: Use this to replace and add Imagery.
- Section 25 - Quote Copy - 2: Use Snippet: Section 25 - Quote Copy.
Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus.
First and Last Name
Title and Department
Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus.
First and Last Name
Title and Department
Section 25a - 2 Col Quote Copy
CMS Enable: Add New
Code Snippet: "Section 25 - Quote Copy"
Character Count: Quote text - 300
Notes: The "Section 25a - 2 Col Quote Copy" consists of 2 CUSTOM HTML modules and 2 Media Modules.
Available Modules to EDIT:
- Partial 1:
- Section 25 - Image - 1: Use this to replace and add Imagery.
- Section 25 - Quote Copy - 1: Use Snippet: Section 25 - Quote Copy.
- Partial 2:
- Section 25 - Image - 2: Use this to replace and add Imagery.
- Section 25 - Quote Copy - 2: Use Snippet: Section 25 - Quote Copy.
Section 26 - Testimonial Quote
CMS Enable: Add New
Code Snippet: "Section 26 - Quote Copy" / "Section 26 - Citation"
Character Count: Quote text - 300
Notes: The "Section 26 - Testimonial Quote" consists of 2 CUSTOM HTML modules and 1 MEDIA MODULE.
Available Modules to EDIT:
- Partial 1:
- Section 26 - Quote Copy: Use this snippet "Section 26 - Quote Copy".
- Partial 2:
- Section 26 - Image: Use this to replace image.
- Section 26 - Citation: Use this snippet "Section 26 - Citation".
Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus.
First and Last Name
Title and Department
Section 26a - Testimonial Quote
CMS Enable: Add New
Code Snippet: "Section 26a - Quote Copy" / "Section 26a - Citation"
Character Count: Quote text - 300
Notes: The "Section 26a - Testimonial Quote" consists of 2 CUSTOM HTML modules.
Available Modules to EDIT:
- Partial 1:
- Section 26a - Quote Copy: Use this snippet "Section 26a - Quote Copy".
- Partial 2:
- Section 26a - Citation: Use this snippet "Section 26a - Citation".
Section 27 - Image & Links
CMS Enable: Add New
Code Snippet: Section 27 - Links Copy / Section 27 - Links
Available Modules to EDIT:
- Partial 1:
- Section 27 - Copy: Use this to replace the text. Code snippet avalaible: "Section 27 - Links Copy" (Custom HTML)
- Partial 2:
- Section 27 - Image: Use this to replace image and video.
- Section 27 - Links: Use this to replace the text. Code snippet avalaible: "Section 27 - Links" (Custom HTML)
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 28 - 2 Col Copy
CMS Enable: Add New
Code Snippet: Section 28 - Copy + CTA
Character Count: Title - 30 & Paragraph text - 200
Available Modules to EDIT:
- Section 28 - Copy - 1: Use this to replace the text. Code snippet avalaible: "Section 28 - Copy + CTA" (Custom HTML)
- Section 28 - Copy - 2: Use this to replace the text. Code snippet avalaible: "Section 28 - Copy + CTA" (Custom HTML)
Section 29 - 3 Col Cards
CMS Enable: Add New
Code Snippet: "Section 29 - Intro Content" / "Section 29 - Card Copy + Anchor"
Character Count: Title - 30 & Card Paragraph text - 100
Notes: The "Section 29 - 3 Col Cards" consists of 4 CUSTOM HTML modules and 3 Media Modules.
Available Modules to EDIT:
- Partial 1:
- Section 29 - Intro Copy: Use Snippet: Section 29 - Intro Content.
- Partial 2:
- Section 29 - Card Image - 1: Use this to replace and add Imagery.
- Section 29 - Card Copy - 1: Use Snippet: Section 29 - Card Copy + Anchor.
- Partial 3:
- Section 29 - Card Image - 2: Use this to replace and add Imagery.
- Section 29 - Card Copy - 2: Use Snippet: Section 29 - Card Copy + Anchor.
- Partial 4:
- Section 29 - Card Image - 3: Use this to replace and add Imagery.
- Section 29 - Card Copy - 3: Use Snippet: Section 29 - Card Copy + Anchor.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Copy 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Copy 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Copy 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 29a - 3 Col Cards
CMS Enable: Add New
Code Snippet: "Section 29a - Intro Content" / "Section 29a - Card Copy"
Character Count: Title - 30 & Card Paragraph text - 100
Notes: The "Section 29a - 3 Col Cards" consists of 4 CUSTOM HTML modules and 3 Media Modules.
Available Modules to EDIT:
- Partial 1:
- Section 29 - Intro Copy: Use Snippet: Section 29 - Intro Content.
- Partial 2:
- Section 29a - Card Image - 1: Use this to replace and add Imagery.
- Section 29a - Card Copy - 1: Use Snippet: Section 29a - Card Copy.
- Partial 3:
- Section 29a - Card Image - 2: Use this to replace and add Imagery.
- Section 29a - Card Copy - 2: Use Snippet: Section 29a - Card Copy.
- Partial 4:
- Section 29a - Card Image - 3: Use this to replace and add Imagery.
- Section 29a - Card Copy - 3: Use Snippet: Section 29a - Card Copy.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Copy 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Copy 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Copy 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 29b - 3 Col Cards
CMS Enable: Add New
Code Snippet: "Section 29 - Intro Content" / "Section 29b - Card Copy"
Character Count: Title - 30 & Card Paragraph text - 100
Notes: The "Section 29b - 3 Col Cards" consists of 4 CUSTOM HTML modules and 3 Media Modules.
Available Modules to EDIT:
- Partial 1:
- Section 29b - Intro Copy: Use Snippet: Section 29 - Intro Content.
- Partial 2:
- Section 29b - Card Image - 1: Use this to replace and add Imagery.
- Section 29b - Card Copy - 1: Use Snippet: Section 29b - Card Copy.
- Partial 3:
- Section 29b - Card Image - 2: Use this to replace and add Imagery.
- Section 29b - Card Copy - 2: Use Snippet: Section 29b - Card Copy.
- Partial 4:
- Section 29b - Card Image - 3: Use this to replace and add Imagery.
- Section 29b - Card Copy - 3: Use Snippet: Section 29b - Card Copy.
Heading
Copy 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Copy 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Copy 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 30 - Full Width Media
CMS Enable: Add New
Notes: This media module is where the user can find/update imagery/video.
Available Modules to EDIT:
- Section 30 - Media: Use this to replace image and video.
Section 31 - CMS Map
CMS Enable: Add New
Code Snippet: Section 31 - Intro Copy
Notes: The "Section 31 - CMS Map" consists of 1 CUSTOM HTML module and 1 MAP MODULE. "Section 31 - Intro Copy" code snippet should be used for the heading and introduction copy above the map. The copy beside the map is filled in via the Map Module. TIP: When adding a new location, be sure to also generate the new map by clicking on "RENDER MAP" button. ONLY ONE MAP CAN BE PLACED PER PAGE.
Available Modules to EDIT:
- Partial 1:
- Section 31 - Copy: Use this snippet "Section 31 - Intro Copy".
- Section 31 - Map: Use this to add/remove/change any map locations and to edit the copy beside the map.
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt Lorem ipsum dolor sit amet, consectetur adipiscing elit
Section 33 - Golden Rules of Safety
CMS Enable: Use Existing
Notes: All updates / changes are managed by Radancy. All the code is within the Module Layout. The red ribbon in the image is part of the image.
Our Golden Rules of Safety
Our Golden Rules of Safety are our simple and easily understood behaviours that prevent incidents from occurring. Our Golden Rules apply in all geographies, service lines and at all times while working for G4S.
Ensuring we’re doing all we can to put our employees and safety first, we continue to raise greater awareness of the Golden Rules of Safety by emphasising the importance of general rules, road safety rules and specialist rules.
Our Golden Rules are available in simple posters in 35 languages to make the messaging accessible and easily understood for our employees across the world.
-
Report all incidents, as well as unsafe acts and conditions
Use appropriate Personal Protective Equipment (PPE)
Do not work or drive under the influence of alcohol or drugs
-
Check your vehicle before driving
Always wear a seat belt
Take the required breaks when driving
Do not speed
Never use a hand-held mobile telephone whilst driving
-
Treat every firearm as loaded
Obtain authorisation before entering a confined space
Always wear a helmet and high visibility equipment when riding a motorcycle
Section 32 - Copy & Job List
CMS Enable: Add New
Code Snippet: "Section 32 - Content Copy"
NOTES: Will display a Job List that will dynamically populate with jobs based on the Page Tagging of the page on which this Section is placed. (Page Tagging refers to the filters applied in the "Tagging: Job Data" portion of a Content Page.)
Available Modules to EDIT:
- Section 32 - Copy: Use this to replace the text. Please select "Section 32 - Content Copy". *
- Section 32 - Job List: Use this to add/reduce the amount of job tiles in the list.
Section 7a - Related Content (Content Feed)
CMS Enable: Use Existing
Character Count : Paragraph text - 200
Important Notes: ANY CHANGES WILL BE APPLIED TO THIS SECTION GLOBALLY.
Notes: The "Section 7a - Related Content (Content Feed)" consists of a Content Feed module. Headline and text can be edited in the "Content Page Filtering: Display Title" and "Content Page Filtering: Display Description" field of that Content Page or Offsite Content Page.
Available Modules to EDIT:
- Section 7a - Related Content: Use this module to choose content pages to display.
More about G4S
-
Explore G4S careers in Europe
Discover exciting career opportunities at G4S in Europe. Search job openings, set up alerts and apply now to join a global leader in security.
-
Explore G4S careers in Asia Middle East
Discover exciting career opportunities at G4S in Asia Middle East. Search job openings, set up alerts and apply now to join a global leader in security.
-
Security Services at G4S
Explore rewarding security careers at G4S. Join our expert teams around the world to protect communities and deliver innovative security solutions.
-
Cash Solutions at G4S
Explore exciting Cash Solutions roles at G4S. Join our innovative team and advance your career in cash management and security.
-
Care & Rehabilitation Services at G4S
Explore rewarding Care & Rehabilitation roles at G4S. Join our team to enhance community safety and drive innovative social care and justice solutions.
-
Facilities Management at G4S
Explore top Facilities Management jobs at G4S. Join our innovative team and drive excellence in secure, efficient operations.
-
Functional & Operational roles at G4S
Explore a wide range of functional roles and opportunities at G4S, from IT, Administration and HR to Project Management, Finance and Customer Service.
-
Employee Benefits at G4S
Discover our comprehensive benefits, from professional development to health & wellness. At G4S, we want our people to thrive and reach their potential.
-
Explore G4S careers in Africa
Discover exciting career opportunities at G4S in Africa. Search job openings, set up alerts and apply now to join a global leader in security.
-
Explore G4S careers in Latin America
Discover exciting career opportunities at G4S in Latin America. Search job openings, set up alerts and apply now to join a global leader in security.
-
Explore G4S careers in UK & Ireland
Discover exciting career opportunities at G4S in UK & Ireland. Search job openings, set up alerts and apply now to join a global leader in security.
-
Health & Safety at G4S
The safety and wellbeing of our employees is a core G4S value. Setting the highest standards for safety across our industry keeps our colleagues safe.
-
Learning & Career Development at G4S
At G4S we strive to foster a culture of continuous development and encourage people at all levels to grow their skills and reach their full potential.
-
Hiring Tips And FAQs For Our Application Process
Find out more about the G4S application process. To help you on your journey, we've put together the most commonly asked questions posed by our applicants.
-
Keith's G4S Career Progression
Keith Freeman joined G4S in 2005 after serving in the Royal Anglian Regiment, 1st Battalion, including tours in Northern Ireland and Afghanistan.
-
Culture & Belonging at G4S
Investing in Culture & Belonging drives our success - enhancing career development, community safeguarding, and innovative solutions across our global team.
-
No challenge is too much for Head of General Affairs, Noviana Widyas Ningrum
In her role as Head of General Affairs for G4S in Indonesia, Noviana Widyas Ningrum is responsible for all of the G4S assets, including buildings and vehicles, across Indonesia.
-
-
Jason's G4S Heroism Rewarded
Jason Leon Guerrero began his career at G4S three years ago as an entry-level security officer. His consistent reliability and professionalism led to his promotion to Security Supervisor.
-
Alwiya's Two Decades of Care
Alwiya Aboudi has dedicated 20 years to pastoral care in custody. Before joining Oakhill Secure Training Centre (STC) four years ago, she spent 16 years at HMP Woodhill, becoming the first female Muslim chaplain appointed in the adult estate.
-
Senya's Ordnance Management Journey
Senya Augustino completed her Level 3 International Mine Action Standards training in 2011, the same year South Sudan gained independence. After working with other organisations in South Sudan, she joined G4S in 2020 as a deminer within the Multi-Tasking Team (MTT) project, a commercial demining contract.
-
G4S Crew Saves Man After Fall with Urgent First Aid
G4S UK ambulance crew provided urgent, life-saving care to a man bleeding profusely from a head wound after an accidental fall.
-
-
From CCTV Operator to HR Director: G4S Colombia promotes Carlos Vidal Sanchez
Carlos Vidal Sanchez joined G4S Colombia in 2011 and was been promoted from Head of Regional Operations Santander to Director of Human Resources Management Regional Costa Base Barranquilla.
-
ESS Customer Contact Centre
Build your career at the ESS Customer Contact Centre, where our diverse range of roles provides ample opportunity for growth and ambition.
Section 7 - Related Content (Content Page Display)
CMS Enable: Add New
Notes: The "Section 7 - Related Content (Content Page Display)" consists of a Content Page Display module. This is set up so that it is editable where user can update the modules headline text, prefiltering, default content and thumbnail image for a fallback option when a content page does not have a thumbnail image.
Available Modules to EDIT:
- Section 7 - Related Content: Use this module to choose content pages to display.