Libguides – back-end/front-end (3)

In the last blog on Libguides this year I just wanted to show a little bit of what is going on “under the hood” with “forcing” things to look in a certain way around the possibilities and constraints of Libguides.

Our school got a great new brand update last year, and this meant that we needed to update our colour scheme for our Libguides. The only issue how-ever is that our corporate colour red, is wonderful for many things, but there are some cautionary notes in its use on websites, including it being tiring on the eyes (particularly red with white text). In addition, young children like bright colours and different colours, so I wanted a way to introduce some colour into the Libguides without  disrespecting the hard work and thought that had gone into our branding. The way I did this was by using, our marketing designed, UOI logos and their colours in the UOI guides – which are the most frequently used sites by our students.  There I had some great colours to work with.

Screen Shot 2017-12-20 at 11.15.47

The question was how to do this without throwing away all the work I’d done previously on the guides?

This was done by using a “front-end” / “back-end” trick. i.e. all the original guides were still where they’d been, with one guide per grade for all UOI’s (the back-end), however the new front-end incorporated the colours of the UOI, the larger fonts, the missing breadcrumbs etc, that I’ve mentioned in this blog.

WWA G4 front end

On the left you can see the final product – in this case the “Who we are” units for all the grades, highlighting G4.

There are two ways of doing the “front-end/back-end” thing.

1. Redirect

The first way is to create a page that then is redirected to another page on another guide.


  • You maintain the formatting and particular style of the page on the other guide, while still having a tab on the current guide to that page. For example, on each page of the UOI guides I have a “back to TK library” page, that isn’t actually so much a “page” as a quick link back to the main page. (I still need to work out how to make that a little home icon rather than the cumbersome script!)
  • You can use the same page multiple times on lots of guides without any extra work
  • You can use the same page for different target groups.


  • Your viewers are suddenly taken out of one “reality” (e.g. a UOI guide) into another reality (your home page); so you need to “open in a new tab” and then you get the tab proliferation issue
  • The page you open into won’t have the same look and feel as the guide they left.

Below I’ve put a few screen shots as to how to realise this option. And what it looks like


2. Mapped page

With this option you actually insert a page from another guide, and it takes on the style / look and feel of the guide you’re adding it to. This is the option I used for the UOI guides. That way each page would have the coloured tabs depending on the UOI colour, the large font, etc.


  • You don’t have to “reinvent” the wheel if you have otherwise good content in existing guides, but they don’t look so great.
  • You get to keep “standard” Libguide variable column types in the same guide (i.e. one page can have 4 columns, one 3, one 2 etc.)


  • Unless you’re pretty rigorous in your adherence to some kind of uniformity in style, you could end up with a guide that is a hodge-podge of style and content – this is something I’m trying to clean up now – each time we move onto a new UOI, I spend some time “cleaning up” the back end so it conforms to the new layout.
  • You cannot map a page that has a weird and wonderful formatting to a guide that has a plain vanilla style sheet

See the images below how to realise this – I’ve deliberately mapped a page that has special formatting to a “normal” page to show how it doesn’t work well!


Finally to end off, here are a few shots of what the mapped G4 guide looks like “behind the scenes”


For the librarians in Singapore, I’ll be hosting a few sessions in the evenings on how to create this type of Libguide in January. So contact me if you’d like to join in.  Free of charge, the only obligation is to contribute to the work on one of our ISLN committees and take your new-found knowledge and spread it forward.

Leave a Reply

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

You are commenting using your 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 )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.