Skip to content
Switch branches/tags

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

Saurus Sims Tumblr Theme!

What Is This?

This project is a tumblr theme for Saurus Sims.

It was originally written using React, but unfortunately the Tumblr API uses rate limiting, and the blog became too popular for us to use the API. It's now been rewritten as a plain Tumblr theme, with some vanilla JavaScript for more custom features, including an integration with Contentful for some custom pages.

If there's time in future, I'll be creating a theme generator, so that the development experience for creating the Tumblr theme itself can approach the level of speed and comfort made possible by modern JS tooling!


Install dependencies by navigating to the theme directory and running yarn!

Copy the theme/src/secrets.example.js to a new file theme/src/secrets.js. Enter your Contentful access token and space id into this new file.

Note that you'll need to implement the correct data structure in Contentful for those features to work. If you'd like to do so, open an issue on the repo and I'll look into copying over the data structure so you can!

The theme uses webpack to bundle JavaScript, and includes a simple webpack-dev-server setup to make the development process fast. This includes multiple scripts for different sections of the theme:

  • yarn start:downloads - Renders the downloads page, which pulls data from Contentful.
  • yarn start:gallery - Renders a photoset layout, with gallery functionality available when you click on the images.
  • yarn start:masonry - Renders an example of the masonry layout, to confirm that updates to other parts of the theme do not break the masonry integration.
  • yarn start:photoset - Renders a photoset layout, with gallery functionality available when you click on the images.
  • yarn start:resources - Renders the resources page, which pulls data from Contentful.
  • yarn start:sims - Renders the sims page, which pulls data from Contentful.


Build the project via yarn build, and then install the files in theme/output just like any other Tumblr theme:

  • Copy/paste the theme.html into the Tumblr editor.
  • Upload the style.css and main.js files.
  • Update the link and script tags to point to the uploaded css and js files.
  • Click the publish button to publish the changes.

Tumblr Rejecting JavaScript File Uploads

Occasionally Tumblr rejects any JavaScript file uploads as "potentially malicious". The workaround for this is to link directly to a CDN-served version of the file via jsdelivr. It's best to pin the requested version of the file to a specific commit - for example:


It's preferable to just upload the file to Tumblr and serve it from there when possible though!