Hi.
Can anyone point me the way to extend to the right the width of the quiz question area? See image. Not asking for exact code, but any help would be appreciated. Have spent more than 2 hours on this with no success.
My theme's middle column width is a wee bit too narrow, squeezing
the question part. Hence I'm trying to increase the width so that more
text and images can fit horizontally.
Regards
Frankie Kam
Hi Frankie,
I would only be able to give an answer if I could use Chrome developer tools / Firebug on the theme. Is it Bootstrap based? Is the theme available somewhere? Is it for M2.5?
Cheers,
Gareth
The thing that surprises me is that no-one has ever made a theme where the grey info box it show above the blue question box, as a long horizontal strip, rather than on the left.
I think that would probably work better in responsive themes. Anyone up to the challenge?
Hi Tim,
Yes I am :D - please see attached screen shot done in Mutant Banjo. The custom css to add in the theme settings is:
.que .info {
float: none;
width: auto;
}
.que .info > div {
margin-left: 10px;
margin-right: 10px;
}
.que .info > div, .que .ablock > div, .que .answer > div {
display: inline;
}
.que .content {
margin: 0 0 0 0;
width: auto;
}
Copy / Paste version:
.que .info { float: none; width: auto; } .que .info > div { margin-left: 10px; margin-right: 10px; } .que .info > div, .que .ablock > div, .que .answer > div { display: inline; } .que .content { margin: 0 0 0 0; width: auto; }
The CSS might help you Frankie .
Cheers,
Gareth
Hi Frankie,
Really odd, but I tried to replicate the issue in Mutant Banjo and could not - please see attached image - so code would be helpful .
To make the Quiz Navigation block appear on the right as you have it I had to change the order of the regions array in the theme 'config.php' file even though the 'defaultregion' is 'side-post' to:
'incourse' => array(
'file' => 'columns3.php',
'regions' => array('side-post', 'side-pre'),
'defaultregion' => 'side-post',
Strange eh Tim ;)
Cheers,
Gareth
P.S. Vote for MDL-41595 to have sibling trackers to do the same in lesson and quiz .
Not strange at all Gareth, Tim explained some while ago that the order of the array is just as important as defining a default region. The fact is we are all like sheep and bleat and baaa and follow each other around.
But good on you for spotting that in this scenario.
Also this is interesting too.
I'm not a sheep, I'm a ferret as you'll see from the screen shot ;)
Yay!
Did you try it all on one line in the grey box?
Hi Tim,
No, as I thought being a heading it should be above, but then it did not take long to create the CSS so should be easily possible.
Cheers,
Gareth
Hi Gareth
I'm using a theme named Ergo on my Moodle 2.5 site. Thanks for the CSS code that moves the gray left section in one row, above the question section. It works but there is a side-effect. The multiple choice question and OU's Multiple response answer choices are no longer are aligned as a single column (as they should). Instead all answer choices are in one line.
Here's the multiple choice question, erm, rearranged in one line. I think the question will look better with a, b, c and d aligned in one column as they normally would.
Here's the Open University multiple response question, erm, again, rearranged in one line. I think the question will look better with the (a to e) choices aligned in one column as they normally would.
And here's the true-false question (rearranged horizontally due to the CSS code).
Got a fix for that?
Thanks for your CSS code so far. You are indeed a CSS guru.
Frankie Kam
Dear Frankie,
Please use the following shorter CSS:
.que .info {
float: none;
width: auto;
}
.que .info > div {
margin-left: 10px;
margin-right: 10px;
}
.que .info > div {
display: inline;
}
.que .content {
margin: 0 0 0 0;
width: auto;
}
Gareth
Hi Gareth
Awesome. Your code works. I really need to study CSS so that I can figure out why it works.
Thanks a bunch
Frankie Kam.
Hi Gareth
How do I shift the Quiz Navigation from the right (as is the case in my theme) to the top of the page, just below the Quiz info?
Above is a mockup - it's just a suggested layout. The reason for this request is it appears I will need more horizontal real-estate for my quiz contents. As it is with he Quiz Navigation (QN) on the left, I have limited horizontal space. If the QN were shifted to the top, I have more room to move my quiz elements around.
Regards
Frankie Kam
Hi Frankie,
The page layout in M2.5 for a Quiz appears to be 'incourse', the quiz navigation is a 'fake block' which is added by the module to the first block area defined in the array in 'config.php' file for that layout's list of blocks. In the case of 'Clean' that is 'side-pre':
// part of course, typical for modules - default page layout if $cm specified in require_login()
'incourse' => array(
'file' => 'columns3.php',
'regions' => array('side-pre', 'side-post'),
'defaultregion' => 'side-pre',
),
Although there are murmurings afoot to make it the 'defaultregion' as the I think the Book module has been changed. So therefore to get the navigation underneath the quiz you need to create a brand new block area (say 'fake') and change your 'incourse' layout to use it in the desired place and change your 'config.php' to something like:
// part of course, typical for modules - default page layout if $cm specified in require_login()
'incourse' => array(
'file' => 'columns3.php',
'regions' => array('fake', 'side-pre', 'side-post'),
'defaultregion' => 'fake',
),
So that it works and is future proof.
Cheers,
Gareth
Hi Gareth
Thanks for the reply.
> you need to create a brand new block area (say 'fake')
>
How do I do this - create a block area named 'fake'?
regards
Frankie
Dear Frankie,
If M2.5 then use the new 'blocks' method otherwise the old 'blocks_for_region'. So declare in your 'config.php' as above and edit the layout file and use something like:
echo $OUTPUT->blocks('fake', 'span3');
In the appropriate place like 'side-pre' / 'side-post' is used.
Gareth
Gareth,
That is not a 'fake' block that is what we describe as a custom block region. Fake blocks are hard coded using renderers.
Cheers
Mary
Hi Mary,
I know ;)
Sorry for the confusion, in this example the word 'fake' is used as the name of the new block area as the custom block region. It could easily have been 'fakeregion' or 'frankies' or 'frankiesregion' or 'fluffybunnyfoot' .
The example just creates a custom block region that is then setup in 'config.php' to be the region to use by the fake block functionality such that the Quiz module will use it for it's 'fake' navigation block.
I hope this makes sense.
Cheers,
Gareth
Hi Gareth
Thanks for your reply. Ah, I've never done this before. But I believe what you are suggesting that I do is related to
http://stackoverflow.com/questions/14748862/how-to-define-a-custom-block-regions-in-moodle-theme-designing
and
https://moodle.org/mod/forum/discuss.php?d=160567#p858808
eh?
Frankie Kam
Yes!
Thanks for the useful and helpful replies. In creating this most sacred code with the help of Obi-Wan-Google, why do I still feel like a blindfolded Luke Skywalker who attempts to use a lightsaber to deflect energy bolts from a floating drone?
Because you need to learn how to be one with the 'font' young one ;)
Dear Gareth,
I am new for moodle and I am not website developer who know much about coding. Would you like to tell me step by step this process (above) more detail with some example? The "same" question (Kishore Babu M. N.) below.
Thank you
Broto
Hi Broto,
Welcome to Moodle.
To be honest I don't have a step-by-step process written down as I used my skills as a software engineer to find the solution. This is what I did:
I don't really remember exactly how I did it, I just know I could repeat the process again if I needed to.
With the question "Do you have any idea, to turn Flag question link to button?" - would need to look into that and I have no business need to do so. A good set of links to learn from are:
If you want me to write a full blown step by step guide aimed at a beginner then I'd be happy to quote for my time.
Kind regards,
Gareth
Hi Frankie Kam, I am also in need of same appearance, the quiz navigation block should appear on the top. I have gone through these discussions but it is little bit confusing to me like adding fake block, etc as I am relatively new to Moodle Development architecture.
If you have already made the code changes for this appearance, could you please send me the code and the relevant files information?
Thank you very much.
Regards,
M. N. Kishore Babu.
Hi Kishore
I haven't tried coding the fake thingy as I am still swinging my light sabre around in the air. Haven't become one with the fon..Force yet.
Frankie Kam
Ok Frankie Kam. By the way, Do you have any idea, to turn Flag question link to button?
Regards,
M. N. Kishore Babu.
