Changing which accordion is open#
How it all works#
When displayed in Blackboard, this content will use an accordion interface. i.e. sections of the text will appear as vertically stacked. Each section having a title and some content. Clicking on the title will reveal or hide the content. The accordion interface provides progressive disclosure of content. The titles provide an overview of the content and a mechanism by which focus is applied to specific parts of the content.
There are two levels of accordions
The Content Interface supports two levels of nested accordions.
All the accordions you can see in Figure 2 are level 1 accordions. These are specified using a Heading 1 style in the Word document.
Level 1 accordions can include further accordion sections. Each of these further accordion sections are Level 2 accordions. Specified in Word using a Heading 2 style.
The following explains
- Which accordion is open for the first visit.
- Which accordion is open all subsequent visits.
- How to stop auto scrolling to the open accordion.
- How to change which accordion opens for a visitor.
- How to open or close all the accordions.
- How to remove the accordions.
Which accordion is open for the first visit#
The first time you visit a page with the Content Interface the default behaviour is for the first top-level accordion to open and for the page to scroll to the top of the top-level section (see image below).
Which accordion is open for all subsequent visits#
When using the same web browser (on the same device) the Content Interface remembers which accordion you last opened. When you return to a page (using the same web browser on the same device) it will open that accordion and scroll to the top of the matching section.
How to stop auto scrolling to the open accordion#
If you would prefer that the Content Interface would open the Blackboard page normally. i.e. did not scroll to the top of the open accordion. Then you can add nofirstscroll to the name of the Content Interface item (Figure 1).
How to change which accordions open for a visitor#
If you would like a visitor to see a different accordion open when they view the page, there are two different ways you can specify this. The following sections explain these two approaches. But first, you need to understand the numbering of accordions.
Numbering of accordions#
Almost all Content Interface pages will have a collection of accordions. Figure 2 shows a Content Interface page with 8 accordions.
To change which accordions will open for a visitor, you need to know the accordions number. Accordions are numbered from 1 up. In Figure 2, How it all works is the title for accordion #1. Open or collapsing all accordions is the title for accordion #7
Expand a particular accordion#
This first approach assumes that every time someone visits a page you wish to expand a particular accordion. For example, assume that when I was designing the page shown in Figure 2 I wanted the accordion with the title Opening or collapsing all accordions (accordion #7) to be expanded (open) for everyone.
To do this I would add expand=7 to the name of the Content Interface item (see Figure 3)
Linking to a particular accordion#
If I wanted to email someone information about how to stop auto scrolling in the Content Interface, I might wish to send them a link directly to accordion #4 in Figure 2. This is the accordion titled How to stop auto scrolling to the open accordion.
If I sent them a link to the web page containing Figure 2 then the Content Interface might – depending on how it’s configured - open the first accordion or the last accordion the visitor opened. But not accordion #4.
To make sure that accordion #4 is opened, I need to add #4 to the end of the URL.
For example, this URL
https://bblearn.griffith.edu.au/webapps/blackboard/content/listContent.jsp?content_id=_5578515_1&course_id=_82534_1&mode=quick&content_id=_5589289_1
would become (note the #4 on the end)
https://bblearn.griffith.edu.au/webapps/blackboard/content/listContent.jsp?content_id=_5578515_1&course_id=_82534_1&mode=quick&content_id=_5589289_1#4
Expanding or collapsing all accordions#
You can also specify if a Content Interface should expand or collapse all accordions.
Expanding all accordions#
To have the Content Interface display with all Level 1 accordions open you add the parameter expandAll to the title of the Content Interface item as shown in Figure 4 below.
Figure 5 shows a Content Interface with all Level 1 accordions open.
Collapse all the level 1 accordions#
To have the Content Interface display with all Level 1 accordions closed you add the parameter collapseAll to the title of the Content Interface item as shown in Figure 5 below.
Figure 6 - Adding the collapseAll parameter to the Content Interface title
Figure 7 shows a Content Interface with all Level 1 accordions open.
How to remove the accordions#
If you’d like to remove the accordion sections, add noaccordion to the name of the Content Interface item. Figure 8 illustrates what this looks like with Edit Mode on. The accordions appear as normal headings. All remaining styling is applied.
If Edit Mode is turned off, the Content Interface noaccordion title will not be visible to students.
