Checking your guides

Broken content

Check every page in each of your guides for any obvious problems such as content that has not copied across, error messages or any odd or unusual looking content. For example, something has gone wrong with this RSS feed:

Bad RSS feed

Responsive web design

One of the best features of our new LibGuides is that it is ‘web responsive’. No matter what sort of device you use, the screen will automatically re-size and reform to fit your screen size. It is possible that some elements in your guides will have a fixed size which won’t re-size properly on a mobile screen.

If it isn’t convenient to check all your guides on an iPad/mobile etc, one quick way to look for potential problems is to change the browser screen size on your computer. Click on the ‘resize’ button at the top right of your browser window

resize browser

Then drag the right-hand side of the window until it is approximately the width of an iPad or a mobile screen to get an idea what the guide may look like on these devices.

mobile view

Signs that there may be a problem on a smaller screen include a scroolbar at the bottom of the window (which indicates you have some content that is unable to resize)

scrollbar

You might also want to look out for photos that distort as the screen size changes:

Distorted photo

This is easy to fix. Edit the box containing the photo and click on the Source button. Then change the height and width of the photo to use a percentage % instead of a ‘fixed size’ pixel size. Use 100% if you want the photo to fill the width of the box or a smaller percentage if you want the photo to be smaller. E.g.

<p><a href=”http://www.flickr.com/photos/ramyraoof/5397614267/&#8221; title=”Demonstrators on Army Truck in Tahrir Square, Cairo by RamyRaoof, on Flickr”><img alt=”Demonstrators on Army Truck in Tahrir Square, Cairo” height=”375″ src=”http://farm6.static.flickr.com/5299/5397614267_944041c698.jpg&#8221; width=”500″ /></a></p>

becomes

<p><a href=”http://www.flickr.com/photos/ramyraoof/5397614267/&#8221; title=”Demonstrators on Army Truck in Tahrir Square, Cairo by RamyRaoof, on Flickr”><img alt=”Demonstrators on Army Truck in Tahrir Square, Cairo” height=”100%” src=”http://farm6.static.flickr.com/5299/5397614267_944041c698.jpg&#8221; width=”100%” /></a></p>

Guide Layout Options

You might want to consider changing your page layout. In some instances the 3 column layout has uneven column widths. In LibGuides v2 it is easier to keep your guide’s columns in proportion using the ‘Layout’ option. In the example below I adjusted the guide to use the 3 column 25, 50, 25 layout which is a little easier on the eye.

3 column 25 50 25

Migrated version –

3 column old layout

 

New 3 column layout:

3 column even layout

If you find any problems or any recommendations not included here, please let us know.

New book carousels

Finally, I’ve noticed that in Edit mode you cannot see the new book carousels. However, if you go to the Preview or Live version of the guide the carousel displays as normal. I have no idea why this happens but check your preview/live guide if you are concerned about the ‘missing’ carousel.

Advertisements
This entry was posted in LibGuides and tagged , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s