Note: You are currently viewing documentation for Moodle 2.9. Up-to-date documentation for the latest stable version of Moodle may be available here: Collapsed Topics course format.

Collapsed Topics course format: Difference between revisions

From MoodleDocs
 
(40 intermediate revisions by 3 users not shown)
Line 1: Line 1:
The Collapsed Topics course format is a contributed code module.  The format is similar to the standard [[Course_sections#Topics_format |Topics]] format except that all topics (except '0') can be 'toggled' on and off.  This reduces clutter in courses that have a large number of topics, lots of content in the topics or a combination of the two.
The Collapsed Topics course format is a contributed code module.  The format is similar to the standard [[Course_sections#Topics_format |Topics]] format except that all topics (except '0') can be 'toggled' on and off.  This reduces clutter in courses that have a large number of topics, lots of content in the topics or a combination of the two.


[[Image:ct_23_main.png|center|Collapsed Topics format example]]


[[Image:Collapsed topics image1.png|center|Collapsed Topics format example]]
{{Courses}}


== Download ==
You can download the format from the [http://moodle.org/plugins/view.php?plugin=format_topcoll Modules and Plugins Database] or by going to [https://github.com/gjb2048/moodle-format_topcoll GitHub] and cloning the repository alternatively by selecting one of the [https://github.com/gjb2048/moodle-format_topcoll/tags downloads] for your version of Moodle if the database is unavailable.  Full installation instructions are in the included 'Readme.txt' file.
== Installing ==
Please follow the instructions in the supplied 'Readme.txt' file and if desired, follow this video:
<mediaplayer>http://www.youtube.com/watch?v=ydFdES-pKYc</mediaplayer>
== Overview ==
For an overview please see this video:
<mediaplayer>https://www.youtube.com/watch?v=c9NaEAPPC5E</mediaplayer>


== Usage ==
== Usage ==
Line 16: Line 32:
'''Setting the Toggle Text'''
'''Setting the Toggle Text'''


The toggle text is set by editing the section description ([[Course_sections#Editing_sections]]). As shown below...
Tick off 'Use 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]]).
 
[[Image:Collapsed_topics_image6_moo20.png|center|Summary description Moodle 2.2]]
 


For Moodle 1.8 and 1.9 just type in the editor box...


[[Image:Collapsed_topics_image6.png|center|Summary description Moodle 1.8 and 1.9]]
'''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.


For Moodle 2.0, tick off 'Use 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]]).  {{Moodle 2.0}}
== Changing the look ==


[[Image:Collapsed_topics_image6_moo20.png|center|Summary description Moodle 2.0]]
=== Introduction ===


Since versions 1.9.8.1, 2.0.5.1, 2.1.5.1, 2.2.3.1 and 2.3.3.1 for Moodle 1.9.14+, 2.0.5+, 2.1.2+, 2.2+ and 2.3+ respectively, which were released on the 5th March 2012 the format now incorporates a means of customising the 'elements' and 'structure' of the course within Moodle 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.


'''Toggle State'''
=== 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 decending order are displayed below execpt 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.


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.
* 'Day' - where each section is presented as a day in ascending day order from the start date of the course.


== Changing the look ==
== Fine tuning the look ==


'''Formatting'''
'''Formatting'''


Most of the formatting is contained within the file 'topics_collapsed.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...
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...
 


[[Image:Collapsed topics image2.png|center|Topic text too big]]
[[Image:Collapsed topics image2.png|center|Topic text too big]]


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


Then you can add an addtional 'font-size:0.6em;' to the 'tr.cps td.cps_centre' class.
[[Image:ct_23_font.png|center|Changing the css]]


'''The Arrow'''


[[Image:Collapsed topics image3.png|center|Changing the css]]
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:


'''Per Theme Changes'''
[[Image:ct23_arrow.png|center|Toggle arrow css]]


You can set a different look globally or on a per theme basis by changing the following css in 'collapsed_topics.css'.  Non-standard colours used to illustrate the point.
The selector without the 'body.jsenabled' prefix is for when the user has disabled JavaScript and all the sections default to open.


[[Image:Collapsed_topics_image5.png|center|Per theme css]]
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:


If you want a per theme look for when you allow your users to choose their own theme, move the css shown and place in your theme's css files and change as desired.
[[Image:ct23_tarrow.png|center|Toggle all arrow css]]


'''The Arrow'''
In both cases use 'pix:' URLs that pertain to your theme in line with standard theme design.
 
If you want to change the look and style of the arrow, simply change 'arrow_down.png' and 'arrow_up.png'.


== FAQ ==
== FAQ ==


Q. How do I report an issue with Collapsed Topics?
Q. How do I report an issue with Collapsed Topics?
A. Raise an issue on [http://tracker.moodle.org/browse/CONTRIB/component/10406 Moodle Tracker] or post a discussion on the [http://moodle.org/mod/forum/view.php?id=47 Moodle Course Formats Forum]


Q. Is Collapsed Topics [https://docs.moodle.org/en/Moodle_2.0_release_notes Moodle 2.0] compatible?
:A. Raise an issue on [http://tracker.moodle.org/browse/CONTRIB/component/10406 Moodle Tracker] or post a discussion on the [http://moodle.org/mod/forum/view.php?id=47 Moodle Course Formats Forum]
A. The latest version is but please use at your own risk.  It does not have all of the desired changes to make it fully 2.0 compliant as I maintain it whilst Moodle 2.0 is still changing as development progresses.
 
Q. Is Collapsed Topics [https://docs.moodle.org/en/Moodle_2.0_release_notes Moodle 2.0], [https://docs.moodle.org/en/Moodle_2.1_release_notes Moodle 2.1], [https://docs.moodle.org/en/Moodle_2.2_release_notes Moodle 2.2], [https://docs.moodle.org/en/Moodle_2.3_release_notes Moodle 2.3], [https://docs.moodle.org/en/Moodle_2.4_release_notes Moodle 2.4] & [https://docs.moodle.org/en/Moodle_2.5_release_notes Moodle 2.5] compatible?
 
:A. Yes.  It incorporates a change where the section name of the topic summary is used instead of the summary itself to form the words on the toggle.


== Credits ==
== Credits ==
Line 77: Line 107:


==See also==
==See also==
*[http://moodle.org/mod/data/view.php?d=13&rid=2307 Collapsed Topics] is the Modules and plugins database page for downloads and more information on this module. There are versions for Moodle 1.8, 1.9 and 2.0.
*[http://moodle.org/plugins/view.php?plugin=format_topcoll Collapsed Topics] is the Modules and plugins database page for downloads and more information on this module. There are versions for Moodle 1.9, 2.0, 2.1, 2.2, 2.3 , 2.4 and 2.5.  The Moodle 1.8 version for reference and legacy use is available from [https://github.com/gjb2048/moodle-format_topcoll GitHub] and in the [https://github.com/gjb2048/moodle-format_topcoll/downloads downloads].
*Discussions: please create or find a discussion topic in the [http://moodle.org/mod/forum/view.php?id=47 Moodle Course Formats Forum]
*Discussions: please create or find a discussion topic in the [http://moodle.org/mod/forum/view.php?id=47 Moodle Course Formats Forum]
*Bugs can be reported on [http://tracker.moodle.org/browse/CONTRIB/component/10406 Moodle Tracker]  
*Bugs can be reported on [http://tracker.moodle.org/browse/CONTRIB/component/10406 Moodle Tracker]  
*[[Collapsed Weeks course format]] is a similar contributed code module.




[[Category:Contributed code]]
[[Category:Contributed code]]
[[Category:Course format]]

Latest revision as of 12:47, 21 May 2013

The Collapsed Topics course format is a contributed code module. The format is similar to the standard Topics format except that all topics (except '0') can be 'toggled' on and off. This reduces clutter in courses that have a large number of topics, lots of content in the topics or a combination of the two.

Collapsed Topics format example


Download

You can download the format from the Modules and Plugins Database or by going to GitHub and cloning the repository alternatively by selecting one of the downloads for your version of Moodle if the database is unavailable. Full installation instructions are in the included 'Readme.txt' file.

Installing

Please follow the instructions in the supplied 'Readme.txt' file and if desired, follow this video:

<mediaplayer>http://www.youtube.com/watch?v=ydFdES-pKYc</mediaplayer>

Overview

For an overview please see this video:

<mediaplayer>https://www.youtube.com/watch?v=c9NaEAPPC5E</mediaplayer>

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.

Course Format


Setting the Toggle Text

Tick off 'Use 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).

Summary description Moodle 2.2


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

Since versions 1.9.8.1, 2.0.5.1, 2.1.5.1, 2.2.3.1 and 2.3.3.1 for Moodle 1.9.14+, 2.0.5+, 2.1.2+, 2.2+ and 2.3+ respectively, which were released on the 5th March 2012 the format now incorporates a means of customising the 'elements' and 'structure' of the course within Moodle 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 decending order are displayed below execpt 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...

Topic text 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.

FAQ

Q. How do I report an issue with Collapsed Topics?

A. Raise an issue on Moodle Tracker or post a discussion on the Moodle Course Formats Forum

Q. Is Collapsed Topics Moodle 2.0, Moodle 2.1, Moodle 2.2, Moodle 2.3, Moodle 2.4 & Moodle 2.5 compatible?

A. Yes. It incorporates a change where the section name of the topic summary is used instead of the summary itself to form the words on the toggle.

Credits

Collapsed Topics has been developed by and is maintained by Gareth Barnard with invaluable input from:

See also

  • Collapsed Topics is the Modules and plugins database page for downloads and more information on this module. There are versions for Moodle 1.9, 2.0, 2.1, 2.2, 2.3 , 2.4 and 2.5. The Moodle 1.8 version for reference and legacy use is available from GitHub and in the downloads.
  • Discussions: please create or find a discussion topic in the Moodle Course Formats Forum
  • Bugs can be reported on Moodle Tracker