- Accordion
- Banner
- Bracket Quote With Text
- Button Panel
- Carousel
- Code Only
- Contents List
- Embed RSS
- Event Carousel
- Event Listing
- File Upload
- Foundation - 2 Cards
- Foundation - 3 Cards
- Foundation - 4 Cards
- Four Verticals
- General Content
- IMAGE - Single Image
- IMAGE => [5/7] Image / Wysiwyg
- Image and Text Expander
- Image Gallery
- News Carousel
- News Story
- One Horizontal
- One Horizontal with Background
- Page Contents
- Panel
- Student Quote
- Three Verticals
- Two Horizontals
- Two Verticals
- Video Embed
- Video With Text
Carousel
DTP - Carousel
- There are 3 large images, each with a text overlay, containing a heading and sub-heading.
- You can choose to insert either 1, 2 or 3 images.
- The text overlay can be Dark or Light. For example, if the image you insert is dark, then choose Light text. If the image you insert is light, then choose Dark text.
- You can also add either a Section Link, Web Link or no link to each image.
- The image dimensions for this content type are 1600*767 pixels.
Imagery
- You should have full permission for any image you intend to use on your website.
- Please ensure that the text overlay is considered when creating or selecting your images, as this may obscure key features.
- All images should be the correct dimensions (1600*767 pixels) and optimised for the web. For users that do not have access to Adobe Photoshop or a similar image editing resource, we would recommend the use of PIXLR, a free online image editing platform. This platform can be used to resize and optimise images.
- You must use the correct naming convention for image filenames, as follows:
- Use only lowercase letters (a to z), numerals (0-9) and hyphens (-);
- Do not use spaces. Instead, use hyphens to separate words.
- Do not use special characters (e.g., £, %, &, á) or underscores.
- The following resource explains how to optimise an image for use on the web.
- You are not required to add an Image Alt Text / Description if the image will be decorative only. Further information is available in the Text Alternatives for Images section of our Accessible Content Guidance.
- Do not create images with embedded text. The image will be inaccessible and the text will not scale across mobile and desktop devices. If and image with text is required, please use an alternative content type to display this information, such as DTP - One Horizontal.
Links
- To link to a specific section on your website use a Section Link. The CMS automatically remembers section links, even if you need to move the linked section when restructuring or reorganising content on your website.
- To link to a specific piece of content on your website, use a Content Link. As with section links, the CMS will automatically remember the content link, even if the content is moved to another location on your website.
- When linking to an external website or resource, then use a Web Address. The full URL of the website or resource is required i.e. https://www.qub.ac.uk. Please note that the majority of websites published via the CMS are now accessed over HTTPS only.
Accessibility Guidance
Please use the following guidance to help make sure your content adheres to accessibility regulations:
- Do not add HTML elements such as
span
,div
,h1
or otherwise to any of the form elements to change the structure of the content type. Either you will be asked to remove it, or it will be removed by the Web Support Team. - Do not add any CSS styling or selectors to any of the form elements to change the display of the content added to the content type. Either you will be asked to remove it, or it will be removed by the Web Support Team.
- Do not create images with embedded text.
- Do not add image Alt Text / Description to your image if it is decorative. Further information is available in the Text Alternatives for Images section of our Accessible Content Guidance.
- Do make sure that the link text used for the button is as descriptive as possible. Do not use generic link text such as 'Click Here' and 'Read More'. Further information and examples are available in the Using Links Effectively section of our Accessible Content Guidance.