There are a few different text-based components that can be used to enhance your page's look and feel. They can be found at /SharedResources/Razor/2022
These components need to be dragged and dropped onto the page in the place you want them to appear. Once dropped, a pop-up will appear which allows you to input the relevant content and configuration options.
Header, text and CTA card
The header, text and CTA card is a component that has a heading with text and a call to action (CTA) button link. You have to include a button link. It can used full width or within a column.
It can be found at /SharedResources/Razor/2022/headerTextCTA-card
Important information CTA card
The important information CTA card lets you highlight important information. You can choose if you want to show the 'i' icon. The CTA button link is also optional. It can used full width or within a column.
It can be found at /SharedResources/Razor/2022/ImportantInfoCTA-card
Important information heading
Information information here.
Link text
Standard tabs
The standard tabs component lets you display content in tabs where you can click along on the next tab to show different content. You can have from one to seven tabs. The content allows you to use HTML to format the content. It can used full width or within a column. You should check how it displays on smaller screen sizes.
It can be found at /SharedResources/Razor/2022/Standard-Tabs
-
-
-
-
Statistics
The statistics control lets you display a number of statistics so they stand out. You can choose to have them display in pink or blue and decide on the number of stats across the page. You have the option for a link and a source as well.
It can be found at /SharedResources/Razor/2022/Stats
Testimonial carousel
The testimonial carousel lets you display a number of testimonials in a rotation. You can have no link or you can link the source to a profile or further information page. It can used full width or within a column.
It can be found at /SharedResources/Razor/2022/Testimonial-carousel
"One of my favourite things about the course is the support we get from tutors and academics. I speak from the heart when I say that every single one of them gives their job their all and goes above and beyond for their students. Never have I received so much academic support and confidence instilled in me consistently from the staff members that I turn to for help."
— Raffaela, BA Sociology
"I received valuable lessons on economics, governance and globalisation, which helped me to develop a dissertation on food inflation and social welfare. This helped me to get a project with the World Bank's Poverty Reduction and Economic Management Unit."
— Anuja, MA Public Policy
Formatting
There are some formatting options in the Styles dropdown that you can also use.
You can use heading-underline-blue or heading-underline pink on your headings to make them stand out. First apply your heading format and then highlight the text and select your heading style.
Heading with heading-underline-blue style
Heading with heading-underline-pink style
Older components
You can also use a few of our components created for our left side menu templates. View the guidance for: