How do I add rotating taglines to a page?

Hey, y’all. I’m setting up a basic newsletter (the theme is Edition) and I kind of like the idea of having a different tagline every time the page loads. Think the NSFW webcomic Oglaf’s rotating taglines at the top of the page, or something similar.

Ideally, every time someone refreshes the page, the taglines would change: “Heat Death: Tomorrow’s Crises, Today.” “Heat Death: Who left this pipeline here?” “Heat Death: Do you want global warming? Because that’s how you get global warming.” That sort of thing.

My question: what would be the easiest way to do this in Ghost? I know that Squarespace has plugins that can do something like it. Are those cross-compatible at all?

Thanks a bunch!

You can use client side js to insert the tagline (which is what Oglaf seems to do as well)

  1. In your theme, create a div with id="tagline" where you want the tagline to go
  2. Use a script like this:
const taglines = [
'first tagline',
'second tagline',
'third tagline'
];

const tagline = Math.floor(Math.random() * taglines.length);
document.getElementById('tagline').textContent = tagline;
1 Like