Webinar on enabling and customizing the Mirage 2 responsive XMLUI for DSpace repository

What repository administrators and managers, technology staff and librarians need to know about enabling and customizing the Mirage 2 responsive XML User Interface for DSpace repository

You are here


Hilton Gibson (Stellenbosch University, South Africa)
May 2016

DSpace free and open source software has two user interfaces (UI) to select from: JSPUI and XMLUI. This webinar, offered by EIFL, the Institute of Development Studies and Stellenbosch University, will help you enable and customize the Mirage 2 responsive XMLUI for DSpace repository.

Today, people frequently access the internet using mobile devices such as smart phones and tablet computers. Therefore, it is essential that your DSpace repository offers a good user experience for these devices. Mirage 2 theme implements this capability by providing a distinct look for each of the three different categories of screen sizes: mobile phone, tablet and desktop.

Hilton Gibson (Stellenbosch University, South Africa) shares useful tips on:

  • Mirage 2: Theme requirements
  • Preparing server for the Mirage 2 theme
  • Installing theme build software
  • Building/compiling the Mirage 2 theme
  • Customising Mirage 2 - Common Elements, Front Page Text, Palette (Colours), Typography (Fonts), Banner Logo, Institutional Branding, Document Structure (swapping the left and right parts of the site or defining custom sizes for responsive layouts), Footer Design, Extra Customisation (creating themes per collection with the XMLUI, creating custom buttons and using absolute font settings) and Live Webapp Quick Changes.

For your convenience, Hilton Gibson has made available his repository SUNScholar Mirage 2 theme on github.


Speak to your institution's communication or marketing department to determine the palette to use on your repository. A nice clear font, free of copyright or patents, is a really good way to create a crisp looking website. We settled on the free Ubuntu font for our repository. The banner logo at the top of the web site is the section of theme that gets the most attention. We changed our banner to use a transparent background colour so that it is easy to change the banner background colour via CSS. And make sure that your logo size is good otherwise, the site may not scale properly on a small screen size.

Hilton Gibson (Stellenbosch University, South Africa)