Making this exhibition

Exhibition plan:
There are lots of ways to display exhibition material. I wanted to use some different for the postcards instead of just adding a gallery of images. The free tools from KnightLab allowed me to show off different aspects of the postcard collection.Although this is a blogging platform, I wanted to use the pages instead of posts as I wanted to create a menu and I did not want to be restricted to the default post 'behaviour' and template.


Platform: Blogger
Theme: Contempo

Theme customisations:

Background: I did not add an image so my background choices were made under the 'Advanced' section.

Advanced: A lot of the sections are to change the font colour, style and size - I selected my font style and colour here and made sure it was consistent across all the different sections.
Background - I selected the height and colour of the grey box behind the title. You can put an image here too and add blurring which can look quite well.
Width - I played around with this so that the sidebar was hidden and the site looked the same on all browsers.

Gadgets: You can change these at the 'Layout' section on the left hand panel of the dashboard (discussed below). If you do notice something not working, check that both the Layout and Gadgets selections are the same as sometimes one will have the box ticked while the other doesn't.

Layout: I used this feature to select and customise my Gadgets.
Favicon - I made a squared version of our library logo as a favicon.
Sidebar (Top) - I inserted a logo for branding.
Sidebar (Bottom) - looking at the site on different browsers I saw that the sidebar disappeared on Chrome but was present on Firefox. I wanted consistency so I widened it so that it collapsed by default. If it was going to collapse I didn't want my main menu there but had to put something there so, I used the 'About us' gadget to put in contact information. I also added share buttons (from AddThis - see below) using the HTML/JavaScript gadget and called it '© 2017 Glucksman Library, University of Limerick.' as a work-around.
Footer -  I included a copyright statement.

Editing the Layout

Pages and Posts:
The search function on Blogger only searches posts, not pages. As a result, if you use pages as I did here, visitors will not be able to search for content. To get around this (and because it was a small exhibition with only a few pages) I duplicated the pages and made each one a post with the same title. I then went into 'Settings' on the left hand panel of the dashboard, under 'Search preferences', I set up redirects under the 'Errors and Redirections' > 'Custom redirects' by just adding the page URL as a redirect for the relevant post URL.That meant I could use the post list feature on the front page to give a 'menu' effect (under 'Layout' > Page Body > Blog posts, I unticked all boxes and restricted to three posts).

The featured post is 'Creating an Online exhibition' and this points to a blog post. The theme does not display a menu on a post so instead I manually added a menu at the bottom of the post.

To get around (again) the post list displaying text snippets I inserted page breaks at the top of the post.

I included three different features from KnightLab (see more details below) to display my postcards. I did all the work at the KnightLab project side and just had to paste a piece of code into my pages. To do this I switched to the HTML editor on my page and pasted the code, which was wrapped in an <iframe tag, where on the page I wanted it to display. If I needed to change the size or look, I just went back to the KnightLab project page to adjust itand copied the new code over instead.

Embed code in page

External features:

AddThis

I added share buttons with 'AddThis'. I created an account on AddThis and followed the steps to add a new 'Tool'. I customised my buttons, in this case a floating bar, and copied the code from AddThis to paste into my site. Even though the bar is floating, you have to add it to the sidebar gadget for adding HTML/JavaScript. You need to give it a title but the text will just sit there. To get around this (and when you are using free versions you have to be able to compromise and cheat) I added some copyright text. Visitors to the site will not know that there is anything amiss about that text but it solves a problem for me.











Search engine optimisation:
Blogger is a Google product and this is incredibly useful when you are thinking about optimising your site for search engines (typically Google). Using my Google account profile I went to Google Search Console and verified my site. I also added Google Analytics to my site under 'Settings' > 'Other' > Google Analytics by creating a profile and pasting the Tracking ID from Google Analytics into my site. It should start with a UA-.

Image Display Plugins:
KnightLab have developed some really cool projects to help you easily display your material in ways that you might have considered out of your reach coding-wise. I used three of them on this site but there are others. The work is done at the project side and you are given a piece of code, with all the information needed to display the feature, to paste into your site.

TimelineJS - this is probably the one requiring most (but not difficult) work. You follow the template given to create a Google Sheet with the text (and imagery if desired) to create a timeline. You paste the URL of the Google Sheet into the project and a piece of code is generated. The spreadsheet used for making the timeline on this exhibition is available at - https://docs.google.com/spreadsheets/d/18035Xjse0-F_vm7YFEZBgMtx6HoDpY13EZ7XJnzK__8/edit#gid=0. Copy and paste this URL into the Timeline creator and preview the result.

StoryMapJS - Click on 'Make a StoryMap' and follow the instructions to create your narrative. When you are finished, click 'Share' on the top right corner and scroll down to get the code to embed.

JuxtaposeJS - Follow the instructions to upload and describe your images. Then click 'Publish' to get the code to embed.