Course homepage: Difference between revisions

From MoodleDocs
(Expanding drag and drop to discuss moving elements on a course homepage)
m (screencast)
 
(226 intermediate revisions by 21 users not shown)
Line 1: Line 1:
{{Improve}}
{{Courses}}
A Moodle course can look very different depending on the theme and course format (layout). Standard themes are the [[Boost theme]] and the Classic theme.


{{Course appearance}}
{{MediaPlayer | url =https://youtu.be/gxyJ__ij38U?feature=shared | desc = 4.4 course page improvements}}


There are several formats for a course homepage (see below). Most course formats have [[Blocks (teacher) | block areas]] on the left and right sides, with course activity modules and [[Resources]] grouped by [[Course sections | sections]] in the center column.
====Parts of a course ====
1. Course navigation. These provide a quick way for the teacher to access important aspects of the course. The More link takes you to, for example, the Content and Question banks and Course reuse which incorporates Backup, Restore, Import, Reset and Copy.


2. Course index. This is a scrollable, collapsible drawer that displays course sections and elements. As you move up and down the central course area, your location is highlighted in the Course index. Clicking on an item in the Course index will open it up directly in the course central area. Sections in the course index can be collapsed or expanded in bulk from the kebab menu.


== Standard view of a blank course==
3. Edit mode toggle. An easy way to toggle edit mode on and off.
Generally speaking, the first or top section is not numbered and was designed for general information and to contain activities and resources useful during the course.  Most courses will have at least one additional [[Course sections | section]].


The look of your course homepage also depends on which block areas you choose to appear using the Blocks field. All of the blocks can be moved up or down or to the other outside column according to one's liking.  Activities and resources can be moved to any place within the center column.  And the HTML editor can turn a plain homepage of text into a visual riot if required.
4. Block drawer. This is not visible until you have enabled edit mode and added a block. The block drawer can be collapsed and expanded as a user preference.


Here are basic elements of a course page and links to Moodle documentation.
[[Image:Course edit on new 3w.JPG|thumb|600px|none|Example of Weekly format, teacher view, edit off - [https://docs.moodle.org/en/images_en/d/dc/Course_edit_on_new_3w.JPG full resolution here]]]


===Parts of a course homepage===
5. [[Course formats|Course sections]]
Using the above image, here are the parts of a course homepage.  It is possible to move and hide parts of the page, so not all courses will look like this.
{| style="width:75%; height:200px" border="1"
|-
| Column left || [[Course sections]]-Center || Column right
|-
|-
| *1 [[Course_settings#Full_name|Course full name]] || *7 Section header & [[News forum|News topic]] || *10 [[Log in|Login information]]
|- 
| *2 [[Course_settings#Short_name|Navigation bar]] ||*8 Current week - First section || *11 [[Getting_started_for_teachers#Editing_course_section|Edit on button]]
|-
| *3 [[Course_settings#Summary|Course description]]|| *9 Future week  - Second section|| *12 [[Latest News block|Latest news]]
|-
| *4 [[Participants|Participant list]]||  || *13 [[Upcoming Events block|Upcoming events]]
|-
| *5 [[Forum module|Forum list]]||  || *14 [[Recent Activity block|Recent activity]]
|-
| *6 [[Course administration block|Course administration block]] ||  ||
|}


==Examples of course formats==
Here is where the learning materials are displayed. This element may be arranged in one or multiple weeks, topics, forums or other (non-standard) layouts.


===Topic format example===
6. Collapse all. Sections can be collapsed and expanded individually or you can use the Collapse all link to collapse them all at once.
[[Image:Course top topic mu1.jpg|thumb|300px|none|Example of Topic format.  Click on image to enlarge]]
====Classic theme====
This is a downloaded version of demo.moodle.org, using the Topic course format.
1.[[Navigation block]]


===Weekly format example===
Normally visible on all pages, this block helps you find your way around the course and site.
[[Image:Course top weekly mu1.jpg|thumb|300px|none|Example of Weekly format, teacher viewing as student]]
This is a downloaded version of demo.moodle.org, using the weekly course format.
===Social format example===
[[Image:Course top social mu1.jpg|thumb|300px|none|Example of Social format.  Click on image to enlarge]]
This is a downloaded version of demo.moodle.org, using the Social course format.  The existing activities  seemed to disappear.  The teacher added two forums and a student added a third popular topic.


===Other format examples===
2.[[Administration block]]
There are also [[SCORM/AICC module|SCORM]] and [[LAMS]] course formats.


==Course themes==
Again, normally visible on all pages, this block gives different levels of access to teachers and students.
Some sites may allow teachers to select [[Themes |themes]] for their courses that are different from the Moodle site homepage. A theme can effect colours, font sizes and page layouts.


In [[Course settings#force|course settings]], Teachers will see a "Force theme" drop down menu in the general section that contains a list of available themes.   Non-editing teacher can not alter this setting.  The default course theme is the site theme or the category theme.
3. Turn editing on
A clearly visible button allows you to turn editing on and off.


The site administrator or course manager should look at [[Theme_settings]] or Administration>Configuration>Variables (older versions of Moodle) and change the allowcoursethemes to yes.
4. [[Course formats|Course sections]]


==Moving elements on your course's homepage==
Here is where the learning materials are displayed. This element may be arranged in one or multiple weeks, topics, forums or other (non-standard) layouts.


There are some variations in how you move things around on your course's homepage. Moving whole Blocks (the regions to the side(s) of the screen) is different from moving Sections (the central stack of regions in Topic or Weekly format where the main content is displayed) or their individual resources and activities.
5. Collapse all. Sections can be collapsed and expanded individually or you can use the Collapse all link to collapse them all at once.


===To move a whole Block===
6.[[Blocks|Side blocks]]
#Turn Editing On and *click and release* the Block's crossed arrows icon. Place holders - zones with a dashed border - appear on the screen indicating the possible areas where your Block can appear.
#Click the placeholder where you want the Block appear. On course area homepages, you can move Blocks from one side to the other, but not into the middle.
#The block should now appear in the location you chose.


===To move a Section===
Side blocks can be added when the editing is turned on. Which blocks you see depend on what the administrator has selected and what you as teacher choose to add.
To move a Topic or Week section:
#click and hold its crossed arrows icon
#without releasing, drag it up or down to its required position; this may take a little practice


===To move a Resource or Activity===
To move an individual Resource or Activity within or between sections:
#click and hold its crossed arrows icon
#without releasing, drag it up or down to its required position; different from moving a Section, you will see a skinny horizontal line - when this displays where you want your element to appear, then you can release.


==Tips and tricks==
===View a single course section===
===Make your course home page look more like a regular webpage===
{{New features}}
Often when a course has a lot of content, students and teachers find the long scrolling tedious and would prefer a 'neater' appearance with hyperlinks to sections in a similar way to the way pages on websites work.
*With edit mode off, all users can click a section heading to access one particular section in its own page.
* With edit mode on, teachers can click View  from the three dots on the right to access just that section.


*Anchors/section links can help. But the course page can still be long.
[[File:viewsection.png|center|alt=View a single section when edit mode enabled]]
*Hiding the activities shortens the list for students, but then they can not be selected by students.


One method which might be useful is to put the activities into sections which are then made 'unseen' to the student.
===Edit a course section===
# Enable Edit mode/turn editing on
#Quickly rename sections from the pencil icon.


''Basic Example''
===Duplicate a course section===
*Set the number of topics in the course setting to 1 more than students will see.
# Enable Edit mode/turn editing on.
**For example, you plan on the students being able to see 6 topics, set it for 7.
# From the three dots to the right of the section name, click Duplicate.
*Add activities in topic 7, such as a quiz (in our example)
*Get the url of your quiz
**Copy it and keep it somewhere (such as notepad) for later use
*Go back to course admin>settings and change your topic/weeks to 6
**Or one fewer than you had before
*The section with your quiz will no longer be on the page that the student sees
*In another section, make a hyperlink to the quiz using its url
**You can also put it in a topic summary, label or
**as a resource (link to a file or website)


You will find that the quiz is accessible to students even though the section does not physically appear on the course page for the students. You have shortened the page.
===Get a permalink to a course section===
# Enable Edit mode/turn editing on.
# From the three dots to the right of the section name, click Permalink.
===Move a course section===
'''Note:'''The ability to move course sections is controlled by the capability [[Capabilities/moodle/course:movesections|moodle/course:movesections]], which is allowed for the default role of teacher. See also the section below on Bulk editing.
#Enable edit mode/turn editing on
#Drag and drop the section either from the course central area or the Course index to your chosen location.
If your course is long you can also drag from the central area to a location in the Course index, and/or you can click the three dots next to a section, select Move and choose the location to move it to.


''More advanced example''
===Add course sections===
*There is a youtube video that gives an example of how to do this [http://uk.youtube.com/watch?v=XtHPUh_BaxM here]
#Enable edit mode/turn editing on.
*You can actually set up your whole course using this method.
#Scroll to the bottom of the course page and click Add section or Add week, depending on the course format you are using.
*Set  your course to have two topics (or more if you wish)
[[File:addsectionweek.png|center]]
*Ignore topic 1 - do not place anything in it.
*In topic 2, use the resource: ''Compose a webpage'' to make webpages relating to your units of work/topics
*Add all your resources to topic 2
*Copy the resources urls into the relevant webpage as hyperlinks
*In topic 0, the course summary make hyperlinks -or better- images hyperlinked - to each webpage which contains the activities of that unit/topic
*Go back to course settings and set the number of visible topics to 1.


The student will only see the top of the page. When they click on a link in the header, they are taken to the hidden webpage resources, where they select the resource or activity they wish. This creates a very short visual page but keeps all the course material within the course.
===To delete a course section===
With the editing turned on, click the 'Edit' link to the right of the course section you wish to delete and then, from the menu that displays, click 'X Delete'. You will be prompted to confirm your wish to delete the section and its contents. Note that all activities inside the section and their user data will also be deleted. Use the [[Recycle bin]] to reverse this if you do it by mistake.


Note: The method in Moodle 2.0 will be slightly different. See MDL-24316 for details.


==See also==
==Add activities and resources==
To add an activity or resource to the course, first enable edit mode and then


*[[Course sections]] - some information about weekly and topic sections
Either...
*[[Blocks (teacher)]] - some links to different types of blocks
*Click on the course page wherever you want to add your activity. This will open up the [[Activity chooser]], allowing you to select your activity or resource.
*[[Adding/editing_a_course]] for more information about a course
*For Administrators - Administration block, configuration, variables and interface [[Theme_config#Course_themes |settings]].


[[es:course/view]]
*Click 'Add an activity or resource' to open the activity chooser. Double-click to add an activity or resource; click the i for more information and click the star icon to add it to a separate, starred tab.
[[fr:Page de cours]]
Alternatively, certain resources and activities may be added using drag and drop:
[[ru:Главная страница курса]]
*To add a [[File|file]], simply drag and drop it onto the course section where you'd like it to appear
*To add a [[Folder|folder of files]], simply zip the folder then drag and drop it onto the course section where you'd like it to appear, answer 'Unzip files and create folder' to the popup dialogue, then click the upload button
*To add a [[SCORM module|SCORM package]], simply drag and drop it onto the course section where you'd like it to appear, answer 'Add a SCORM package' to the popup dialogue, then click the upload button.
 
==Group mode==
With edit mode on, when you hover over an activity or resource supporting groups, a group mode icon appears. Click on it and a modal window will display allowing you to select visible/separate or no groups. You can also access Group mode options from the activity actions submenu (three dots to the right).
[[File:groumodeicons.png|center]]
Students do not see these icons.
 
==Indent activities or resources==
If allowed by admin (see [[Course formats]]) teachers can move an activity or resource once to the right. This indentation is also reflected in the course index.
 
===Move activities or resources===
#Enable edit mode/turn editing on
#Drag and drop the item either from the course central area or the Course index to your chosen location.
If your course is long you can also drag from the central area to a location in the Course index, and/or you can click the three dots next to a item, select Move and choose the location to move it to. See also the section on Bulk editing.
 
With edit mode on, from the actions submenu (three dots) to the right of an activity, the setting 'Availability' displays when clicked a modal window allowing a teacher to:
**show on the course page.
**hide on the course page.
**make available but don't show (if stealth mode is enabled).
Once a choice has been made, as a teacher you can then edit it directly from under the item:
[[File:availabilitydirect.png|center]]
==Bulk edit activities, resources or sections==
*With edit mode enabled, click the link Bulk actions near the top right of the screen.
*Checkboxes will appear next to sections, resources and activities.
*Click the ones you want to edit and from the footer at the bottom, choose the action you want to take: Change availability, Duplicate, Move or Delete.
*'''Note:''' For sections, the option to duplicate is not present as you duplicate sections individually from the action menu (three dots) to the right of its name.
==Blocks==
The Boost and Classic themes only only displays blocks on the right, although contributed themes might display them on the left.
 
To add a block to the course page
#Enable Edit mode top right.
#Expand the block drawer and click Add block. Select your block.
To move a block
#With Edit mode on, click the crosshair icon on a block.
#While keeping the block selected, drag it to where you want to position it and let go.
==Course homepage capabilities==
*[[Capabilities/moodle/course:sectionvisibility|Control section visibility]]
*[[Capabilities/moodle/course:setcurrentsection|Set current section]]
 
[[es:Página principal del curso]]
[[fr:Page d'accueil de cours]]
[[ja:コースホームページ]]
[[ja:コースホームページ]]
[[sk:kurz/prehľad]]
[[de:Kursseite]]
[[de:Kursseite]]

Latest revision as of 15:12, 21 April 2024

A Moodle course can look very different depending on the theme and course format (layout). Standard themes are the Boost theme and the Classic theme.

4.4 course page improvements

Parts of a course

1. Course navigation. These provide a quick way for the teacher to access important aspects of the course. The More link takes you to, for example, the Content and Question banks and Course reuse which incorporates Backup, Restore, Import, Reset and Copy.

2. Course index. This is a scrollable, collapsible drawer that displays course sections and elements. As you move up and down the central course area, your location is highlighted in the Course index. Clicking on an item in the Course index will open it up directly in the course central area. Sections in the course index can be collapsed or expanded in bulk from the kebab menu.

3. Edit mode toggle. An easy way to toggle edit mode on and off.

4. Block drawer. This is not visible until you have enabled edit mode and added a block. The block drawer can be collapsed and expanded as a user preference.


5. Course sections

Here is where the learning materials are displayed. This element may be arranged in one or multiple weeks, topics, forums or other (non-standard) layouts.

6. Collapse all. Sections can be collapsed and expanded individually or you can use the Collapse all link to collapse them all at once.

Classic theme

1.Navigation block

Normally visible on all pages, this block helps you find your way around the course and site.

2.Administration block

Again, normally visible on all pages, this block gives different levels of access to teachers and students.

3. Turn editing on A clearly visible button allows you to turn editing on and off.

4. Course sections

Here is where the learning materials are displayed. This element may be arranged in one or multiple weeks, topics, forums or other (non-standard) layouts.

5. Collapse all. Sections can be collapsed and expanded individually or you can use the Collapse all link to collapse them all at once.

6.Side blocks

Side blocks can be added when the editing is turned on. Which blocks you see depend on what the administrator has selected and what you as teacher choose to add.


View a single course section

New feature
in Moodle 4.4!

  • With edit mode off, all users can click a section heading to access one particular section in its own page.
  • With edit mode on, teachers can click View from the three dots on the right to access just that section.
View a single section when edit mode enabled

Edit a course section

  1. Enable Edit mode/turn editing on
  2. Quickly rename sections from the pencil icon.

Duplicate a course section

  1. Enable Edit mode/turn editing on.
  2. From the three dots to the right of the section name, click Duplicate.

Get a permalink to a course section

  1. Enable Edit mode/turn editing on.
  2. From the three dots to the right of the section name, click Permalink.

Move a course section

Note:The ability to move course sections is controlled by the capability moodle/course:movesections, which is allowed for the default role of teacher. See also the section below on Bulk editing.

  1. Enable edit mode/turn editing on
  2. Drag and drop the section either from the course central area or the Course index to your chosen location.

If your course is long you can also drag from the central area to a location in the Course index, and/or you can click the three dots next to a section, select Move and choose the location to move it to.

Add course sections

  1. Enable edit mode/turn editing on.
  2. Scroll to the bottom of the course page and click Add section or Add week, depending on the course format you are using.
addsectionweek.png

To delete a course section

With the editing turned on, click the 'Edit' link to the right of the course section you wish to delete and then, from the menu that displays, click 'X Delete'. You will be prompted to confirm your wish to delete the section and its contents. Note that all activities inside the section and their user data will also be deleted. Use the Recycle bin to reverse this if you do it by mistake.


Add activities and resources

To add an activity or resource to the course, first enable edit mode and then

Either...

  • Click on the course page wherever you want to add your activity. This will open up the Activity chooser, allowing you to select your activity or resource.
  • Click 'Add an activity or resource' to open the activity chooser. Double-click to add an activity or resource; click the i for more information and click the star icon to add it to a separate, starred tab.

Alternatively, certain resources and activities may be added using drag and drop:

  • To add a file, simply drag and drop it onto the course section where you'd like it to appear
  • To add a folder of files, simply zip the folder then drag and drop it onto the course section where you'd like it to appear, answer 'Unzip files and create folder' to the popup dialogue, then click the upload button
  • To add a SCORM package, simply drag and drop it onto the course section where you'd like it to appear, answer 'Add a SCORM package' to the popup dialogue, then click the upload button.

Group mode

With edit mode on, when you hover over an activity or resource supporting groups, a group mode icon appears. Click on it and a modal window will display allowing you to select visible/separate or no groups. You can also access Group mode options from the activity actions submenu (three dots to the right).

groumodeicons.png

Students do not see these icons.

Indent activities or resources

If allowed by admin (see Course formats) teachers can move an activity or resource once to the right. This indentation is also reflected in the course index.

Move activities or resources

  1. Enable edit mode/turn editing on
  2. Drag and drop the item either from the course central area or the Course index to your chosen location.

If your course is long you can also drag from the central area to a location in the Course index, and/or you can click the three dots next to a item, select Move and choose the location to move it to. See also the section on Bulk editing.

With edit mode on, from the actions submenu (three dots) to the right of an activity, the setting 'Availability' displays when clicked a modal window allowing a teacher to:

    • show on the course page.
    • hide on the course page.
    • make available but don't show (if stealth mode is enabled).

Once a choice has been made, as a teacher you can then edit it directly from under the item:

availabilitydirect.png

Bulk edit activities, resources or sections

  • With edit mode enabled, click the link Bulk actions near the top right of the screen.
  • Checkboxes will appear next to sections, resources and activities.
  • Click the ones you want to edit and from the footer at the bottom, choose the action you want to take: Change availability, Duplicate, Move or Delete.
  • Note: For sections, the option to duplicate is not present as you duplicate sections individually from the action menu (three dots) to the right of its name.

Blocks

The Boost and Classic themes only only displays blocks on the right, although contributed themes might display them on the left.

To add a block to the course page

  1. Enable Edit mode top right.
  2. Expand the block drawer and click Add block. Select your block.

To move a block

  1. With Edit mode on, click the crosshair icon on a block.
  2. While keeping the block selected, drag it to where you want to position it and let go.

Course homepage capabilities