Moodle Tip: Using anchor links to create your own course page menu
Posted 02 Jun 2014 / 17I love Moodle. It is an amazing tool for delivering course content, assessments, and feedback to students. But if you are a power Moodle user, you know that it can take some instructor massaging to make it as user-friendly as your students prefer.
One of the things about Moodle that frustrates and confuses students is the way that different “sections” (usually “topics” or “weeks”) of the course display. There are actually two ways that you can display these “sections”:
- Show all sections on one page; or
- Show one section per page.
These two settings define the compromise that Moodle‘s “one main page” design implies: either you list all the content on one (often very long) page, or you isolate the pages. If you have a lot of content in each of your course sections, the scroll on your main page can get pretty insane if you use the “show all sections” setting (sometimes referred to as the “scroll of death“). That might make you think that “one section per page” setting would solve this scroll of death problem, but in my estimation it does not: students still have to scroll through a long menu list of sections to find their section of choice, and once they select a section navigation is limited to jumping back to that menu list or navigating to the previous or next section. Really all the “one section per page” setting does is allow students to click on and isolate a page, which does not really solve the scroll of death problem.
There are other features that have been built into Moodle to make it more navigable. For example, there is the “Navigation” tab, which features expandable hierarchical menus that allow navigation to a particular section when the “one section per page” setting is used. But to me this just creates more confusion. Now in addition to scrolling and clicking into a particular section there is also the option to find the section you want on these unwieldy menus. Like any other technology, you can train users to work around its shortcomings, but in my experience students do not get any training in how to use Moodle. Instead, they treat it like they treat their phones: play around until you figure out how it works. This means that our Moodle course pages need to be as intuitive as we can make them.
I really like the “all sections on one page” setting. I think that there is great value in having the entire course laid out in front of you, being reminded of where you have been and having the chance to look ahead to where the class is heading. But on my pages, scroll of death is more like scroll of excruciating execution. I have so much content in each of my sections (and in the header “section 0” area) that it is really frustrating to try to navigate down to the section you want right now. And because I have a lot of material in my header section, even if I use the setting “one section per page”, there is still a lot to scroll through to get to the “one section” you chose.
What I really needed was a quick way to navigate down to a particular section from the moment that the course page loaded. A serendipitous discovery lead me to the solution I was looking for.
Sometimes when you add or alter a particular item in one of your Moodle sections and then you hit the “Save and return to course” button, you end up not at the top of your page but at the section you were working on: very convenient! I say “sometimes” because this feature does not appear to consistently work, and I have not figured out the pattern that explains this inconsistency. But when it does work, it does so because the latest version of Moodle embeds anchor tags into each section of your course. These tags are numbered from one through however many sections you have included in your course.
If there are anchor tags there can be links, so it is very easy to set up links on your page that jump from section to section within the same long scroll of death page. What I needed was a simple navigation menu in my header section that would allow students to navigate down to the current week’s section. Making this menu as as easy as adding an HTML-coded “label” at the top of my course page.
Here’s the actual code that I use for my 15-topic Moodle courses:
<p><span style=”color: #6699cc;”><strong>Quick links to Week:</strong></span> <a href=”#section-1″>01</a> / <a href=”#section-2″>02</a> / <a href=”#section-3″>03</a> / <a href=”#section-4″>04</a> / <a href=”#section-5″>05</a> / <a href=”#section-6″>06</a> / <a href=”#section-7″>07</a> / <a href=”#section-8″>08</a> / <a href=”#section-9″>09</a> / <a href=”#section-10″>10</a> / <a href=”#section-11″>11</a> / <a href=”#section-12″>12</a> / <a href=”#section-13″>13</a> / <a href=”#section-14″>14</a> / <a href=”#section-15″>15</a></p>
What you end up with after you insert this code as a Moodle label is a little compact menu with clickable links for each of your topic weeks:
It does not matter how many “sections” your course uses; because Moodle automatically inserts anchor tags in the form “section-#” (where the “#” is the sequential number of the section), you can just add or subtract section links as necessary.
Although I use the “topics” format for all my Moodle course pages, I don’t see why you could not use this same technique to create a menu of course meeting times… you would just have to replace the simple weeks above (01, 02, etc.) with the dates of class meetings. I have not tested it, but it should work for “weeks” format in Moodle, as each week or topic is just treated as a numbered “section”.
The only thing to watch out for here is how “dumb” these section anchor tags are: they are just numbered from first to last, so if you rearrange the order of your sections the anchor links are going to change too. If you use my code above that’s not an issue, because “Topic 03” will always be the third topic no matter what section I place third. But if you use these anchor tag links to delineate names for each section, moving a section will break it from its proper link. So if you get fancy with your little top menu by using something other than the numbered sections on your menu, you will need to re-assign links every time you rearrange your sections. Not a big deal, but something to be aware of…
Have fun with this Moodle tip and comment below if you have questions.
A Major Post, Moodle, Teaching Tools
Hi
I’ve done something very similar with a course, but the problem I’m having is finding out how to put a link at the top of each section which takes the user back to the top of the page. Any suggestions would be gratefully received.