How to increase the width of the Book module's reading area (Moodle 1.9.15)

Peter Skoda (http://skodak.org) and Mojmir Volf are the authors of the Book resource. The Book resource is one of the major reasons why I love Moodle. It's a brilliant resource because it allows me to group related articles and webpages in a nice package. Something like the HTML frameset objects which were very common during the early days of HTML and the Internet. In short, I can't live without it. And neither can most of you Moodlers reading this I would reckon.

The challenge: 
Recently I was using the Book resource to encapsulate articles on http://www.sewwhatinc.com. I was doing this work as part of my teaching of MIS at Stamford College Malacca, specifically a case study on Sew What? Incorporated. So anyway, I discovered that I wanted to increase the width of the reading area of the Book resource. Why would I want to do that? I was embedding a Dell webpage into a book chapter and I found that

1. I couldn't view the embedded webpage's entire width within the book
2. the embedded content did not fit inside the right area of the book resource. The embedded website needed horizontal scroll bars (hmmm....) at the bottom of the display area in order for me to view the Dell site in its entirety.

When you click on a link on the TOC (Table of Contents) in a book, you would want to view the right-hand-side content easily, and with no fuss. In this case, using the mouse to scroll left was very irritating.


BTW, here's the embedded code that I used in the reading area.


<table cellspacing="0" style="width:100% !important;background:#999 !important;padding:0px !important;margin:0px !important;border:0px !important;border-collapse:collapse !important"><tr><td style="background:#999 !important;padding:1px !important;margin:0px !important;border:0px !important;"><iframe src="http://www.dell.com/html/us/segments/bsd/case_studies/sew/index.html" scrolling="yes" frameborder="0" style="display:block !important;width:100% !important;height:400px !important;background:#D4D0C8 !important;padding:0px !important;margin:0px !important;border:0px !important;"><a href="http://moodurian.com/">Moodurian.com</a>; (iframes required)</iframe></td></tr></table>


The embedded code worked, but unfortunately the content did not fit nicely inside the Book's reading area.
What to do?


The solution: 
After about 20 minutes of poking around the book module code, I discovered that by editing the file /mod/book/settings.php, I could increase the width simply by reducing the width of the OC (Table of Contents). I added the code '30'=>'30','80'=>'80', in the first line of code, AND changed the tocwidth to '30'.

Contents of settings.php:


$choices = array('30'=>'30','80'=>'80','140'=>'140', '160'=>'160', '180'=>'180', '200'=>'200',
                                     '220'=>'220', '240'=>'240', '260'=>'260', '280'=>'280', '300'=>'300');


$settings->add(new admin_setting_configselect('book_tocwidth', get_string('book_tocwidth', 'book'),
                   get_string('tocwidth', 'book'), '30', $choices));

Next, I went to Site Administration | Modules | Activities | Book and changed the Table of Contents width from the default 140 to a much narrower 30 characters.

The result:
I got the effect that I wanted. The embedded website fit nicely within the Book module. No more horizontal scroll bars!

Now that's what I call a nice layout for my Book content! Maximum space for the reading area. Satisfaction indeed.

Was the information on this post useful for you? I hope it was. KNOWLEDGE SHARED IS KNOWLEDGE GAINED.



Frankie Kam
Melaka, Malaysia

If you like this post or site
a small donation would be nice but would last only a day,
otherwise leaving a comment (or a compliment) below will last me a month!