Collapsed Topics course format

 

Contents

Usage

Selecting

To select the format, simply choose it from the list of course formats in the course settings. To show/hide a topic just click on its toggle.

Setting the Toggle Text

Tick off ‘Uses default section name’ and type in the ‘Section name’ box. This allows the summary to be shown as it normally is in the Topics course format (Course_homepage#Topic_format_example).

Toggle State

When refreshing the page, the state of the ‘toggles’ is remembered. This is on a per browser session per course basis for as long as the browser remains open. If you would like it to persist longer, please follow the instructions in the included ‘Readme.txt’ file.

Changing the look

Introduction

The format now incorporates a means of customizing the ‘elements’ and ‘structure’ of the course within LMS on a course by course basis. The ‘elements’ are such things as the ‘Toggle’ word showing / not showing. The ‘structure’ is the way the sections are presented, in effect the ability to switch to the ‘Collapsed Weeks’ format without installing another course format. Two other structures ‘Latest Week First’ and ‘Current Topic First’ have also been added.

All of the settings can be changed through the course settings page as demonstrated on the overview video above.

Structure Descriptions

  • ‘Topics’ – Where each section is presented as a topic in section number order. This is identical to previous versions of the format.
  • ‘Weeks’ – Where each section is presented as a week in ascending week order. This is identical to the ‘Collapsed Weeks’ course format.
  • ‘Latest Week First’ – The same as ‘Weeks’ but the current week is shown at the top and preceding weeks in descending order are displayed below except in editing mode where the structure is the same as ‘Weeks’.
  • ‘Current Topic First’ – The same as ‘Topics’ except that the current topic is shown at the top if it has been set.
  • ‘Day’ – where each section is presented as a day in ascending day order from the start date of the course.

Fine tuning the look

Formatting

Most of the formatting is contained within the file ‘styles.css’ which is fully commented to facilitate easy manipulation of specific elements. For example, if you found that in your particular web browser the ‘Topic x ‘ text was too big…

Then you can change the ‘font-size:0.7em;’ in the ‘.course-content ul.ctopics li.section .content .toggle a’ selector class:
Changing the css

The Arrow

If you want to change the look and style of the arrow you can either change ‘arrow_down.png’ and ‘arrow_up.png’ in the ‘pix’ folder or if you would like a per theme look then override the CSS in your theme. To change the up and down arrow for the toggle you need to override some or all of the following depending on the size of your arrow:

Toggle arrow css

The selector without the ‘body.jsenabled’ prefix is for when the user has disabled JavaScript and all the sections default to open.

To override the ‘Open / Close all sections’ arrows you need to override some or all of the following depending on the size of your arrow:

Toggle all arrow css

In both cases use ‘pix:’ URLs that pertain to your theme in line with standard theme design.