I like Omeka. But I’m not much good at theme development or customization. John Stewart, on the DH Slack, showed me some Omeka sites he and his colleagues have been building (like this one and this one) that used static site generators to create lovely front page / splash pages, linking out to the exhibitions and collections. I was showing these to some of my current students who are working on Omeka projects as part of their MA theses; they liked them, and so we decided to give it a shot.
I initially thought it’d be a simple matter of putting the generated site in the top folder of the domain, and swapping in a new index.html. Turns out, a bit more complicated. John patiently walked me through what he did – thanks John! – and here are my notes for future reference.
We’re using Hugo to generate the static site. Because Jekyll is awful and why would you do that to yourself? We followed the Hugo Quickstart up to step three. At that point, we cd into our Hugo project’s themes folder, git clone a theme we liked, and copy its config.toml file from its ExampleSite folder into our main project folder. We adjusted the settings there the way we wanted until we got the site looking nice. The
hugo command generated the static site into the
public folder. Now, this is where things got a little complicated.
When Omeka serves up a site, it generates the look-and-feel from the files in the folder containing the current theme. That’s where our static site has to go. In our case, we were using the default Berlin theme. We’re also using Reclaim Hosting, so navigating around these folders is easy using the FileManager from the cPanel. Go to the relevant theme (for the purposes of this example, the Berlin theme), and you’ll see an
index.php file and a
css folder. We don’t want our static site to interfere with the Berlin theme inside our omeka site – we’re only messing around with making a nice splash page, remember – so we have to rename our generated css folder in the Hugo site, and then make sure the file paths in our
index.html file point correctly. So:
- once you’ve generated the static site, in the public folder of the Hugo project on your computer:
- rename the
- in the
index.phpfile, change the paths to your
- make sure the filepaths to your css2 folder are pointing to the right place:
<link rel="stylesheet" href="http://your-omeka-site.com/themes/berlin/css2/main.css"/>
- check your file for any other calls to that css2 folder and change them up accordingly
- zip the contents of the public folder into a zipfile
- rename the
- in the theme folder in your omeka installation (here, the Berlin theme),
- using the filemanager, upload the zip file into the theme folder
- extract all (right-click on the file).
And now you have a lovely splash page!
Banner image Andrew Neel, Unsplash