Resizing and centering Reverb
Research has shown that if a line length is too long it is difficult for the reader to follow. By default, Reverb's page width is the width of the screen on which the content is viewed. This tip shows how to fix the width (and center it).
The following files are modified:
- /Pages/css/connect.css
- /Pages/scripts/connect.js
I should mention that in my Reverb design, I have the TOC hidden at all times. In Target > Target Settings > WebWorks Reverb > Sidebar width have it set to 0. This hides the TOC unless the user clicks the TOC button. I did this because TOCs are not the most prevalent way users find information. They use search instead. Therefore, I use the screen real estate for content.
connect.css
To center the content on the page, set margin-left and margin-right to 'auto'. (I typically comment my changes and include the date when I made the change.)
div#presentation_div {
/* Changing margins. -Lief 28. April 2011 */
margin-left: auto;
margin-right: auto;
padding: 0px;
visibility: hidden;
}
connect.js
The file is too lengthy and the changes occur in a few places, so I am attaching the file. In it you'll see that I chose 940px as my page size. That was an arbitrary size chosen by me. You might choose 1024 or some other value.
skin.css
I am not including it here, but I also modify skin.css. It's unnecessary for this customization.
skin.css
I also modify .ww_skin_page_body in skin.css to provide a background color. This provides a visual boundary for the eye that can be helpful to offset your content page from the unused part of the screen.