The new feature in Moodle 3.4 "New links below course items & a ‘jump to’ menu means faster and more intuitive navigation of activities" (see Moodle 3.4 has landed with a strong focus on usability).
How do you disable that?
I tried Site Admin -> Appearance -> Navigation, but not there and no where else seemed an obvious place to look for it.
Cheers,
Morag
Hello, Morag-- Did you ever find a settings-based solution to this?
I find it troubling that quizzes have this jump to menu at the bottom of every quiz page, tempting students to navigate away from the exams they're taking, then when time runs out the attempts are locked in limbo.
Is the CSS option of hiding .m-t-2 and .m-b-1 the best option?
Thanks for making me feel not-alone in thinking this is an (at least) occasionally problematic improvement.
Would be nice if this could be removed as a standard option.
Please find a solution for that.
Yes, same problem here. I use quizzes a lot and that navigation menu/arrow below each and every single question is so confusing for students...
There's the 'Next Question' intuitive button and it is enough. Can't find a reason why someone needs a shortcut to jump to the next visible activity (which can be at the end of the course, like my case) instead of 'next question' which is used 99,9% of the times.
Very very annoying...
Is there any possibility to remove it?
Dear friends. I have found a (very) partial solution for the 'double'
button problem at the bottom of the quizzes (one –the good one– sending to 'next page'
and the other –the bad one– one sending to 'next activity').
This second one (it is a 3.4. feature) breaches one of the most sacred rules in web surfing and User Experience: "Don't send people to the same point using two different ways or buttons'. Users already know how to arrive to the next 'activity' on the course. They simply go back to main menu and then choose it. This 'next activity' option is a shortcut for experienced users, but quite a pain in the ass for newbies and for people on their smartphones or tablets (finger tapping on it is horrible, it's just beside the other one!)
Sorry for my English.
I mean the bad button is right next to the good one, which makes surfing on small screens or tap-based devices (finger on a tablet or a smartphone) very bad navigation experience.
This
message is only for people obssessed with clearity and useful
navigation experience. It's quite a time-expensive solution, but I
finally did it.
I am a quite obssessed person about UX and cleanness on the screen. Furthermore, the course I teach is for teachers (I mean, for people more used to create courses rather than to enrol on them as students, so, for them, I need Moddle to be the simplest as possible). If any of you have ever teach to teachers then you know how difficult can things become... oh God.
Well, then HOW TO DISABLE THE 'go-to-nex-activity' button below the quizzes.
I've realised that this button don't appear when the Quizz is the 'LAST' activity in the course. Or at least the last one 'visible.
So, there's two ways to disable the button:
1. Making the rest of the next activities in the course invisible or access-restricted (which sometimes is not possible, of course). In my case it is possible for most of them except for one one last activity at the very end of the course called 'Bibliography' which of course must be visible all time.
So, what's the other way.
2. The second possibility is based on the fact that this ugly and unnnecesary 'next' button cannot see LABELS! It doesn't consider labels as activities, so you can show a 'label' on the course with a link to the activity, so the second is always accessible, but at the same time keep it invisible for the 'bad button'. This can be done with an invisible SECTION (a section 'not shown' to students) that includes 'visible' activities. This apparently contradictive behaviour of Moodle is very very useful. I learnt about it here in another forum a couple of years ago: Visible activities kept on invisible sections still keep their 'link' usable, so, just make the most of it.
So, now i've moved my 'Bibliography' to the hidden section but kept as a 'visible' resource. (When moving to it, Moodle 'hides' the resource, you must manually change to 'visible' again). So students still can see a nice label with a nice book icon redirecting to the bibliography and access it by just clicking on it, but while they're answering quizzes there's nothing 'next' to the quizz activity, so the 'next' button dissapears.
I've included a screenshot below to show the different aspects between both: in the left side you can see the 'Next Page' blue button together with the 'next activity' button. In the right side you can see the clean version. More friendly to smartphones or tablets 'tap/finger'-navegability.
Thanks for reading
Yes, this would be super helpful for us too. It's frustrating to have these links display below each lesson, tempting (as was mentioned above) students to navigate off the page.
Any way you could share with us non-CSSers a simple way to add this to our own themes Elliott? Thanks!
Hi Elliott,
Can you tell me where you added the css to?
Thank you!
If you feel brave enough to edit the PHP, then edit '/lib/outputrenderers.php', find 'public function activity_navigation()' and add as the first line 'return '';' - e.g.
public function activity_navigation() {
return '';I've not tested but 99% sure it will work.
hi Gareth! Thanks for the suggestion.
My only question/reservation is that upon the next php update or patch, won't those changes disappear?
I know if I change (hack) the theme stylesheet I will run into the same issue, but I think the theme will see fewer updates and I have more control over those.
Thoughts?
Thanks so much!
Cheers from Chicago!
Hi Serko,
When you update Moodle, then yes, they will disappear.
You can override the 'activity_navigation()' method in the 'core_renderer' class in the theme, such as:
public function activity_navigation() {
return '';
}but clearly that's a more technical answer than my first.
G
I needed the ability to hide the jump to drop down box and was able to with the following css.
.course-XX .urlselect #jump-to-activity{display:none;}Replace the XX with the course id that is found in the url when viewing the course. This leaves the back and forward navigation but removes the drop down box and only for the one course.
I am using the Boost theme and I added this to the advanced settings of the theme in the Raw SCSS field.
Thank you Elliot!
I've been looking for this code for the last couple of days!!
Thank you Gareth Barnard for taking on Tiles course format!! This code and Tiles has solved ALL of my navigation issues.
Thank you All for being here, very helpful to know I am not alone.
.m-t-2.m-b-1 {display: none;}
In regards to my previous setup and in full disclosure I am running Moodle 3.6.1 on Ubuntu 16.04 LTS, Essential Theme.
The Tiles format clarified the order of operations my students needed to take, but the "helpful" navigation links betrayed the order and allowed students to stray and become lost. They won't or don't click "home"
Problem solved using
.m-t-2.m-b-1 {display: none;} in Custom CSS for the Essential Theme and the Tiles format (wasn't sure which one would work!)
I've been messing about with Moodle for some years and enjoy the flexibility this community has built.
Thanks again to Gareth for all his hard work.
If you want to suppress the "Jump To" menu (inc prev/next activity links) just for Quiz attempts, this CSS should work for you:
/* Hide Jump to Nav for Quiz Attempts */
#page-mod-quiz-attempt .m-t-2 {
display: none;
}
It can be added to Custom CSS setting in most themes (that support custom CSS).
Hope that helps, Rob.
Has a solution to this been found yet? My users are working through 'books' but getting confused by the unnecessary navigation (arrows and drop-down lists) at the bottom of the page ... not to mention the appearance during tests etc. !
Is it being removed or made optional with the current version?
Thanks.
To remove the nav from Book module, I modified the code provided above to this:
#page-mod-book-view .m-t-2 {
display: none;
}
Hello, do you know if is there any plan to turn the disabling of "links below course items & the ‘jump to’ menu" a standard feature, so that we were not obligated to change the code?
In my course, the students must follow the workflow for better understanding and results.
Thank you so much,
Claudio
A screenshot might help us understand which links. Have you tried the CSS fix above? Some of this might depend upon the theme that you are running, which is?
Hi Rick.
The question is will there be a proper setting for disabling these 'features'. CSS is always a bit of a hack ... needing some proficiency ... some bravery ... and trusting that the underlying CSS class names and id names will not change in the future.
The CSS that I have working at the moment looks like this:
I have included the text for copying below that.
// means ignore the rest of the line ... which is what is happening in the last line of the code ... I am fighting with the removal of the Calendar block and cannot seem to find a fix yet. This last line hides the entire navigation for everybody including admin!!! (why it is commented out!!!) Does anybody know if it is possible to inject CSS on a user group basis rather than a site theme basis?
// Inspect an element, use # for id="whatever", use . for class="whatever"
#sectionmenu {display:none;} // Hide Activity Drop-down
.urlselect {display:none;}
#next-activity-link {display:none;} // Hide Next Activity Button
#prev-activity-link {display:none;} // Hide Previous Activity Button
.paging {display:none;} // Hide 'All Courses' link on students courses page
.paging-morelink {display:none;} // ... the admin setting does not work
// .list-group {display:none;} // Hide the navigation items on the left (including for admin!!!)
Hi folks. I'm new to Moodle but finding it mostly intuitive so far. This issue though is annoying and frustrating me too for the same reasons mentioned thus far in the thread.
An additional problem I have with this 'Jump To' box is that the one in the theme I'm using (Moove) is really wide and therefore overlaps with the activity title if it's more than a few words long.
Here's a screenshot of a typical example. It just doesn't look professional, right?
This is how it looks if the next activity title is even longer:
And this is how it looks if the previous activity ('Discuss' in the image above) is also quite long:
All of this reduces the visual appeal and functionality of my course so it's quite disappointing that there isn't an option to remove (or resize or position). Sorry that I can't offer a solution but I thought I'd join the discussion and I really hope a simple, intuitive solution is found, which doesn't involve coding language!
Hi Andy,
Welcome.
Have you contacted Willian (moodle.org/plugins/theme_moove) about this?
Do you classify CSS as a 'coding language'? As I suspect it is one and where the solution could lie.
Cheers,
G
Hi G
Thanks for your welcome and helpful suggestion. I will contact Willian. I need to thank him for the many many great things about Moove before being critical about anything!
Yes, I'm afraid I do regard CSS as 'coding language'. It's just not something I've ever felt brave or smart enough to tackle. I really ought to though...
Andy, this problem occurs in the normal Boost theme. Actually, it has been on my list of things to report in Tracker as a feature improvement. (Still on my list, but moving up.) You can report it if you wish, but I will try to do so over the next several days.
With short names of resources and activities, the problem doesn't occur. But with longer names, it does occur. When screen size (width) is narrow, this problem will always occur.
I am not sure if the jump box should be above or below the other links. Your thoughts?
I created MDL-64935 for this problem. Please vote for it.
Nice to meet you Rick. I'm new to Moodle but you've appeared in pretty much everything I've searched on my learning journey so far!
I think the simplest solution is to not display the names of the previous and next activities. Just call them 'previous' and 'next'. The learner will soon discover what they're called by clicking the links!
Maybe so, but without names, these "next" and "previous" links become much less useful.
Consider this, one way (and there are probably many) to navigate to "any" activity or resource is to click on the course name in the "breadcrumb" trail, then on the activity. This takes a scroll up, and then TWO clicks.
The Jump To avoids having to scroll up, and one of the two clicks. So the Jump to is (well, maybe) 33% faster. This is good, and we are not proposing to change it.
Then there are these two navigation links. In theory, they allow ONE click navigation to the two items surrounding the one that you are on. So they are 66% faster than the first method, and 50% faster than the previous (Jump To) method. These are only good for stepping forward or backward. But if you don't have any idea or memory of what is next or previous, you risk a bad click, and you are back to one of the other methods. The risk is that you might need 25% (three) clicks instead of two. In my own case where I have four or five different courses running at the same time, with around 75 resources/activity links, I can't remember what is Next or Previous. These two links are useful only when I know what they link to.
But this is for me. Maybe others would be fine with "Next" and "Previous."
(I have thought about adding some custom CSS, but I don't know if CSS can move an element outside of its box. Somehow, I think that moving Jump To up or down will take some behind-the-scenes coding.)
Well, I was wrong about adding CSS. Here is a possible fix. Add this CSS to Boost's Raw SCSS textbox (Site Admin, Appearance, Themes, Boost.)
This seems to fix the problem. There might be more elegant ways to do this. (Gareth and Mary, if you are reading, your thoughts please.)
Andy, give this a try. If you have never added custom CSS, just copy these lines and paste them into the Raw SCSS textbox in your Boost theme.
/* Adjustment for the size and placement of the jump-to box */
#jump-to-activity.custom-select {
width: 50%;
margin: auto;
margin-top: 2rem;
}
Thanks Rick
I tried pasting that in the Raw SCSS box (in Boost and in the theme I'm using: Moove) but it didn't appear to make any difference to the 'Jump to' box, which remains unnecessarily wide. Thanks again though.
Andy, it sounds like you are not using Boost and instead using Moove. So I am not sure if my code would work in Moove.
If you pasted my code into the Boost theme, but are using Moove, Moove will not see code from another theme. But you can try switching to Boost just to see if the code works.
Cheers Rick
I've just tried this and the 'Jump to' box is the exact same width in Boost as it is in Moove... unnecessarily wide!
I then tried changing the 50% from your suggested copy-and-paste, to 10% and 90% to see if I could see what difference that would make but I couldn't spot anything, so I've probably done something wrong.
Oh well, this is all good practice for me learning to navigate my way around the system. Thanks again
Yes, good practice.
A screenshot showing this code pasted into the Raw SCSS textbox would help. Here is how mine looks. (You can see that I am in Boost, and you can see exactly where I am pasting it.)
Oh man, I'm such an idiot! I got so excited when I first found the term 'Raw SCSS' that I didn't think to scroll any further down. In fact, I pasted into the 'Raw initial SCSS'.
I'm so sorry for wasting your time in walking me through this due to my dumb error, but I REALLY appreciate you doing this. It works! It actually works! And, you know, even though I screwed up and needed you to hold my hand and walk me through it, the most important thing is it worked. My first experience of this type of thing is therefore a positive rather than a frustrating one. That is invaluable in the overall scheme of things.
So, it worked in both Boost and Moove. Here's how it looks in Moove with (40% width:
I have no idea how you figured this out, or how it works but it's really encouraging to know that this sort of thing is doable. I just have to learn how... and I will... eventually! I also see that you managed to get the titles on a separate row. This is perfect!!!
Thank Rick. I really, truly appreciate your help with this
See this presentation that I gave:
MoodleMoot2017 (US and Mountain), "Making Boost do MORE"
which is a bit of an update to this one:
MoodleMoot2016, "Customizing MORE to Improve Your Moodle’s Appearance"
Mary Evans and Gareth have been my great teachers!
Thanks Rick, I'll check them out when I have some time to focus. Got some big deadlines looming...
My videos that you will find in each of these presentations were designed using the "Pecha Kucha" technique, so you only need to find 6:40 minutes to listen to each. Yes, if you hear anything that you want to try, that will take some time. You can also download the videos to your smartphone and listen to them while traveling to work!
Thanks Rick
These are great videos. I have to admit, however, that my brain isn't quite ready for this. I need to learn the basics and probably overcome a deep-rooted (and probably unjustified) fear of coding before I am able to follow even very well presented, clear and concise videos such as yours.
If all goes according to plan, this will likely be my project next Winter. In the meantime, I have so many other things which require my focus, but I will keep my mind open and receptive to the little snippets of code I encounter over the coming months.
Thanks again for your support and encouragement. You are clearly a very talented and dedicated teacher
Andy, I am probably more of a dedicated student, which is why I hang out here on Moodle.org and see what I can learn from folks like you. Thanks.
Thanks Rick. This all makes sense. I guess I was thinking solely from the perspective of the student, for whom I don't think it's usually necessary to know the titles of the previous and following activities.
Yep, I understand. In some courses that force a sequential path thru assignments, students might want to progress to the "next" assignment. But in my courses, I let students jump around a little. I also jump around when grading.
Hi Andy,
No worries.
So can I just check that you're asking to have a software issue fixed without using code? Or is it a case that you mean that it needs to be fixed and you install the update?
Cheers,
Gareth
Hi Gareth
I'm not sure how to answer this question as I'm new here and don't really understand the etiquette of how to ask for help and what, if any, I'm entitled to ask for.
So, I wouldn't say that it's something which 'needs' to be fixed and then I can install the update. I sense that the onus is on me to learn how to use code but I'm not ready to do that just now so I will work within the existing framework and parameters and be grateful for all the amazing functionality which already exists.
I have a lot on my plate already but, once I've cleared some space, I will address my coding shortcomings - probably in the Autumn. I think, until then, I should be a passive forum participant. I really am a novice so it's not my place to be suggesting improvements when I don't yet understand how I can create my own improvements... it's like going to the greengrocers and asking for vegetables which are already washed and chopped!
I won't post anymore until I've learned at least the basics of html and css, but I'll hang around as I can learn a lot just reading the exchanges between you experienced and obviously highly skilled Moodlers.
Thanks again to you, to Rick and to all the other wonderfully helpful people in this forum
Hi Andy,
I think there has been a 'lost in translation' here as I thought you were asking for instructions to fix a software issue locally without using 'code', which left me baffled. So, please do ask questions and request things. If there is an issue to be addressed then it needs fixing. You don't have to know how to code etc.
It is better to ask a question than not know the answer. Also, please do suggest improvements as 'fresh eyes' are a good thing.
The only etiquette you need to follow is the 'site policy' -> moodle.org/mod/page/view.php?id=7080.
Kind regards,
Gareth
What I can bring to the table, however (and having now read the Code of Conduct - thanks for the link - where it specifically encourages us/me to say who I am and what I do!), is 12 years' experience as a distance learning and blended learning specialist, and teacher trainer, so I do at least have a very deep understanding of what students and teachers need. I also have a background in database design and information management, which gives me some useful transferable skills when it comes to building courses from scratch.
So, I will get involved, and I'll do my very best to learn from you all and to contribute to the community wherever and however I'm able.
Thanks again
Hello all,
I've been looking into hiding activity navigation for a plugin I'm working on. It looks like this is easier in Moodle 3.6 onwards, since there's a specific activity-navigation CSS class to target. However Moodle 3.5 hasn't reached end of life (at the time of writing), and it looks like the CSS classes it has on activity-navigation are presentation related (specifying a top margin of 2 and bottom margin of 1), so can't be assumed to be unique. In fact, these CSS classes (m-t-2 m-b-1) seem to appear together in the Moodle code base in three places:
And it's also possible these CSS classes could appear together in plugins. So hiding anything with the CSS classes "m-t-2 m-b-1" is too broad, and could potentially hide something unintended. On the other hand, there is a risk in being very specific with the CSS, that if something changes, the rule may no longer match, and the activity navigation may not be hidden. However I think it's better to take this risk than risk hiding something unintended, since the latter could be a bigger issue, and harder to trouble-shoot.
This CSS seems to work for me:
body.path-mod.pagelayout-incourse #page #page-content [role='main'] + .m-t-2.m-b-1,
body.path-mod.pagelayout-incourse #page #page-content .activity-navigation {display: none;
}
I tested with a few different Moodle versions, from 3.5 to a fairly recent copy of the 3.9 development version, and with a few different themes.
(I note that, in another comment, Martin took an alternative approach, and hid each part of the activity navigation separately.)
James, the m-t-2 and m-b-1 are nothing to do with the navigation, they relate to the bootstrap spacing of margins and padding - see https://getbootstrap.com/docs/4.0/utilities/spacing/ - and in the course template you refer to, present three columns at the bottom of your activity page. So yes, it will have unintended consequences if you override the css for those selectors.
The relevant selectors for the navigation for 3.5 are
Or if you writing your own plugin, you can probably override the template - see https://docs.moodle.org/dev/Templates#How_to_I_override_a_template_in_my_theme.3F
body.path-mod.pagelayout-incourse div.activity-navigation,
body.path-mod.pagelayout-incourse a#prev-activity-link,
body.path-mod.pagelayout-incourse label[for='jump-to-activity'],
body.path-mod.pagelayout-incourse select#jump-to-activity,
body.path-mod.pagelayout-incourse a#next-activity-link {
display: none;
}