Next and Previous buttons

Next and Previous buttons

by Gustav W Delius -
Number of replies: 19

A look at my logs had shown me that most of my users always go back to the course front page before going on to the next resource. A little informal survey confirmed that most users had not noticed that they can flip though the course with the next and previous buttons at the top right of the Moodle screens.

In an attempt to improve the situation, I am proposing two additional buttons in the footer of each Moodle page. After all it is at the bottom of the page that users would usually expect the button bringing them to the next page. Also the design of the arrows in the attached screenshot makes them more noticeable than the < and > buttons at the top.

Attachment buttons.gif
Average of ratings: -
In reply to Gustav W Delius

Re: Next and Previous buttons

by Przemyslaw Stencel -
Nice idea!

And a good point about the fact that users usually expect "back" and "forward" buttons at the bottom of the page.

The < and > buttons at the top could then be replaced with your icons (for the sake of consistency and to avoid confusion).
Average of ratings: -
In reply to Przemyslaw Stencel

Re: Next and Previous buttons

by Sue Edwards -
Been wandering the site for an hour looking for the answer to this. Alas, couldn't find what I wanted.

Can someone please tell me where can I access those next/prev buttons so I can change the look of them? (In plain English for Dummies, please?)

Thanks in advance.
Average of ratings: -
In reply to Sue Edwards

Re: Next and Previous buttons

by Daryl Hawes -
Sue,
The next/prev buttons, aka left and right, are found in the pix folder.
Naviaget to moodle/pix/t/ and find left.gif and right.gif.
If you are using a theme that supports custom pix they'll be in the them folder at
moodle/themes/(yourcustomthemename)/pix/t/
(Edited: unless of course you meant OTHER next/prev buttons...) smile
Average of ratings: -
In reply to Daryl Hawes

Re: Next and Previous buttons

by Sue Edwards -

Hi Daryl,

I'd found those but they don't look anything like the ones that appear on my site (on the left and right of the course navigation drop-down). So maybe the theme I'm using (and have changed a lot) doesn't allow these to be changed? Surely not! The pics I'm seeing on the site must be somewhere!

Cheers...

Average of ratings: -
In reply to Sue Edwards

Re: Next and Previous buttons

by Gustav W Delius -
Those buttons are not images. They are just ordinary form buttons with < or > as button text. If you want to change that you havet to change the variables $backmod and $nextmod in the navmenu() function in lib/weblib.php.
Average of ratings: -
In reply to Gustav W Delius

Re: Next and Previous buttons

by Sue Edwards -

Thanks heaps for that. I obviously don't know much PHP but from what I can gather, I can't see where these functions are defined in this file - only where they're used to do something. Any more hints from anyone please?

I'm was an assembler and cobol programmer (20 years ago) and have forgotten most of it. Haven't done any real programing in 20 years! PHP looks so convoluted to me! I know it's probably not but I'm getting very cranky with it.

What I'm trying to do is to get the buttons to look exactly like what you demonstrated in the above post. I'm finding that people testing for me, are missing the buttons at the top, until it's pointed out to them.

Average of ratings: -
In reply to Sue Edwards

Re: Next and Previous buttons

by Gustav W Delius -

Here are the detailed instructions:

In the file lib/weblib.php search for the lines

    if ($backmod) {
        $backmod = "<form action=\"$CFG->wwwroot/mod/$backmod->mod/view.php\" target=\"$CFG->framename\">".
                   "<input type=\"hidden\" name=\"id\" value=\"$backmod->cm\" />".
                   "<input type=\"submit\" value=\"&lt;\" /></form>";
    }
    if ($nextmod) {
        $nextmod = "<form action=\"$CFG->wwwroot/mod/$nextmod->mod/view.php\" target=\"$CFG->framename\">".
                   "<input type=\"hidden\" name=\"id\" value=\"$nextmod->cm\" />".
                   "<input type=\"submit\" value=\"&gt;\" /></form>";
    }

and replace them with

    if ($backmod) {
        $backmod = "<a href=\"$CFG->wwwroot/mod/$backmod->mod/view.php?id=$backmod->cm\" target=\"$CFG->framename\">".
                   "<img src=\"$CFG->pixpath/t/left.gif\" alt=\"<\" /></a>";
    }
    if ($nextmod) {
        $nextmod = "<a href=\"$CFG->wwwroot/mod/$nextmod->mod/view.php?id=$nextmod->cm\" target=\"$CFG->framename\">".
                   "<img src=\"$CFG->pixpath/t/right.gif\" alt=\"<\" /></a>";
    }

You will probably want to use other images than right.gif and left.gif. Those are the icons usually used only for moving things right or left.

Average of ratings: -
In reply to Gustav W Delius

Re: Next and Previous buttons

by Petr Skoda -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers
I do not like this solution much.

These buttons would be usable only for resources, but for multipage activities (lessons, quizes, etc.) are not suitable. I do not like the idea of different footers for resources and activities.

I tried to solve the problem some other way and created book module instead.


Attachment book.gif
Average of ratings: -
In reply to Gustav W Delius

Re: Next and Previous buttons

by Martin Dougiamas -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
Hmm ... putting them in the bottom leads to a few problems I think, the main one being inconsistency since different activities will work differently (especially multi-page modules like Petr points out).

The way they are now (next to the menu) it's very clear that the buttons relate to whole activities, but putting them there in the footer it's less obvious.  It also tends to more of a page-turner feel which is not something I think we need to promote.

Since the problem is really that the users you asked had not noticed those existing buttons, I can see some other solutions:

  1. tell them .. smile  either directly in a post or intro tutorial, ... and remember Jon's cool floaty tutorial popups are not that far off.
  2. we can improve the styling of those top buttons if necessary ... they look good using my theme on my machine but I notice some other browsers make them less obvious.

Finally, if you really need it you could add this to just your own theme's footer.html without much trouble ...
Average of ratings: -
In reply to Martin Dougiamas

Re: Next and Previous buttons

by Ger Tielemans -

I vote for only change the styling:

I like the concept of the top trio with the dropdown in between as THE Moodle navigator and the "normal" buttons inside a resource like the book.

The point is that Moodle introduces several new handies, a normal webpage not offers.. Nice buttons can be more inviting, but using the same as in the resources could interfere... maybe leave it as it is?

Average of ratings: -
In reply to Ger Tielemans

Re: Next and Previous buttons

by Ray Lawrence -

The drop down list between these buttons displays the current resource / activity description everywhere except on the page where the resource / modules are listed - when it displays "Jump to...".

If you are viewing, say, a Forum is there having this information in the "Jump to..." list too? There are ample other sources of information to confirm your location.

How about having "Jump to..." as the default text displayed, it will then be clear what the prurpose of this feature is at all times and it will also be consistent with the equivalent navigational tool displayed when only a single topic is shown.

Average of ratings: -
In reply to Ray Lawrence

Re: Next and Previous buttons

by Gustav W Delius -
What a good suggestion! That makes things clearer and more consistent. And it only takes a few seconds to implement.
Average of ratings: -
In reply to Gustav W Delius

Re: Next and Previous buttons

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
Aieeeee Gustav, you have just saved me a whole bunch of time and trouble and effort. I have been putting in little hyperlinks by hand for people to move from one resource to another, which is a monumental fiddle and can get out of order very easily. Now I know about that link at the top and the idea of having a similar link at the bottom I will stop doing it.  If you are still here in York lets meet up and the beer/pizza/cofee/cake is on me for such a most excellent top tip.
Average of ratings: -
In reply to Marcus Green

Re: Next and Previous buttons

by Martin Dougiamas -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
Had you really never noticed the buttons up the top before?  surprise
Average of ratings: -
In reply to Martin Dougiamas

Re: Next and Previous buttons

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

Yes I had noticed them, may even have clicked on them but had not appreciated what they do. Goes to show that a good principle of HCI is to not over estimate the intelligence of the user. That idea it was phrased elegantly as "Don't make me think".

Average of ratings: -
In reply to Marcus Green

Re: Next and Previous buttons

by Martin Dougiamas -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
OK ... er ... wow!  wide eyes

Here's hoping the "Jump to..." in there makes a difference then!
Average of ratings: -
In reply to Martin Dougiamas

Re: Next and Previous buttons

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
It does, it does, the HCI of Moodle is a very, very powerful feature.I expect you know you are quite good at putting code together smile but you should not underestimate your interface design skills, Any fool can create an interface, many fools create hard to use interfaces, but smart designers create easy to use interfaces. 
Average of ratings: -