Accordion

This is what the Accordion content type looks like:

Where is the latest Accessible Content Guidance?

You can find out about the latest Accessibility Regulations and guidance in the Accessibility area of our site.

You can learn about the 5 things you can do to help ensure your website is accessible. You can also learn about Siteimprove, our digital governance platform and how you can register to receive fortnightly accessibility reports for your site.

The following table shows the publish schedule of the main channels:

Channel Name	Publish Time
Home	:12 Hourly
Schools	:20 Every 2 Hours
Directorates	:30 Every 2 Hours
Research Centres	:52 Every 2 Hours
Sites	:35 Every 2 Hours
Elearning	01:55 Daily

Note: Edits will go live approx 45 minutes after the above publish times.

How do I register for CMS Training?
You can register your interest in CMS training on our training web pages.

Once you have registered your interest, we will contact you and then send you our self-paced CMS training instructions and resources. When you have completed the training tasks and reviewed all the information, you can request your training sign off via our Sitehelpdesk.
How do I request a new site?
The Change Request Process needs to be completed before you can begin developing a new site.

Contact your Change Initiator who will discuss your requirements with you and submit the Change Request Form on your behalf. This Change Request then goes to the Digital Operations Group (DOG). This group will review the change request and you will be informed accordingly of the outcomes.

Please contact us through our SiteHelpdesk to find out who your Change Initiator is.
Where are the CMS training videos and resources?
Our online training materials are a useful reminder of the tasks you covered in the CMS training course. Here you'll find a series of instructional pages which have been broken into two main categories:
- Common Tasks
- Content Types
Begin with the common tasks videos, as these are the things you'll need to know to be able to maintain your site, for example, modifying existing content; adding different types of links.

The Accordion content type displays up to 5 headings and 5 corresponding pieces of information, each of which can be expanded/contracted by the user, by clicking the +/- icon, located to right of each heading.

You can choose to add an introduction to the accordion.

You can choose to display the first piece of information fully expanded, when the page is loaded in the browser. Or choose to initially hide all the pieces of information, listing just the Headings instead.

You can use this content type on any page within your site. Is is very useful for housing a lot of information in a more succinct way. For example, a long list of FAQs or the daily timetable information of a Conference.

It can be used on its own on a webpage or along with other content types.

The accordion should have a minimum of two headings and text fields populated, otherwise use a different content type, such as General Content.

Tip: Copying a link to a single accordion item (for sending to others)
It is possible to link directly to the content in your accordion items. This can be useful when you want to send a web visitor directly to the accordion item of interest.

To do this:

Click on the accordion title of your choice. This will open the accordion content but will also set the address in the web address bar.
Copy the web address in the address bar.
At this point, you can use the link to embed into your website or pass it on to others via email, text, chat, etc.
Alternatively, right-click on the accordion tab title, and from the menu choose to copy the link address. This menu option will differ slightly depending on what browser you are using.

Important: Each accordion title should be a unique title. Accordions with the same title will cause an accessibility issue and a technical issue.

General Guidance

Please use the following information to help ensure that you are using this content type correctly:

Some of the fields have character limits as defined in the form field guidance below. Please ensure you are aware of these before planning out content using this content type.
If you want more than 5 headings & text fields, add a second block of content that uses the Accordion content type. So, for example, if you require 7 headings in your accordion, you can create two separate blocks of content, each using the Accordion content type. The first block will have all 5 headings with text fields populated and the second will have two headings with text fields populated.
You can also remove a heading and its corresponding text if required. For example, you can remove Title 3 and Text 3 and you do not need to replace these two fields with any other text. They will not appear blank when the content is previewed/published.

Imagery

We do not recommend adding images into the text fields of this content type. If you need to display an image, please use an alternative content type to display this information, such as DTP - One Horizontal or Image and Text Expander.
If you do insert an image, you should have full permission for any image you intend to use on your website.
All images should be the correct dimensions, 800 x 533 pixels (width x height) and optmised 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 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 an image with text is required, please use an alternative content type to display this information, such as DTP - One Horizontal with Background or Image and Text Expander.

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 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.
Do make sure each accordion title is unique. Each title will be used to build an anchor link to the specific accordion item. This anchor link will help improve page navigation. Accordions with the same title will cause a duplicate anchor title, and this will generate an accessibility error.

Form Field Guidance

Please use the following information to help you use this Content Type effectively:

Accordion Form Field Guidance
Field Title	Information	Is it required?
Name	This is the name of the content block, only visible to editors of the section.	Yes
Introduction (optional)	Add an introduction, if required. Maximum characters allowed: 2000	No
Title 1	Add a title to the first expandable text field. Maximum characters allowed: 500 Important: Make sure the title is unique from other accordion titles on the web page.	No
Text 1	Add content to the first expandable text field of the accordion. Maximum characters allowed: 8000	No
Title 2	Add a title to the second expandable text field. Maximum characters allowed: 500 Important: Make sure the title is unique from other accordion titles on the web page.	No
Text 2	Add content to the second expandable text field of the accordion. Maximum characters allowed: 8000	No
Title 3	Add a title to the third expandable text field. Maximum characters allowed: 500 Important: Make sure the title is unique from other accordion titles on the web page.	No
Text 3	Add content to the third expandable text field of the accordion. Maximum characters allowed: 8000	No
Title 4	Add a title to the fourth expandable text field. Maximum characters allowed: 500 Important: Make sure the title is unique from other accordion titles on the web page.	No
Text 4	Add content to the fourth expandable text field of the accordion. Maximum characters allowed: 8000	No
Title 5	Add a title to the fifth expandable text field. Maximum characters allowed: 500	No
Text 5	Add content to the fifth expandable text field of the accordion. Maximum characters allowed: 8000 Important: Make sure the title is unique from other accordion titles on the web page.	No
Initially Hide All?	By default, this is set to No (box unticked). You can leave the default setting as it is OR tick the box, so that the first text field is not expanded when the page loads in the browser, displaying only the Headings.	No
Margin Bottom	This setting determines the amount of space between the Accordion content type and the next block of content on the page. The default margin setting is No Margin. You can leave the default setting as it is OR you can increase the amount of space by selecting Margin Bottom 1, 2 or 3 from the dropdown list.	No

Queen's University Belfast

Accordion

General Guidance

Accessibility Guidance

Form Field Guidance

Queen's University Belfast