Vesper documentation
An editorial magazine for evening culture: a newspaper masthead, a cover story with a top five, an agenda with big dates and a sunset line through every page.
Installation
- Download
vesper.zipfrom your purchase email or your purchases library. Do not unzip it. - In Ghost Admin, open Settings → Design & branding → Change theme.
- Click Upload theme, select the zip, then Activate.
Vesper requires Ghost 6 (self-hosted, or a Ghost(Pro) plan that allows custom themes).
Updating
Upload the new zip the same way and confirm the overwrite. Your content, navigation and theme settings are kept.
Import the demo content
The download includes vesper-demo.zip: posts, pages, tags, navigation and images.
- Use a new or empty site: importing over existing content creates duplicates. On a fresh Ghost, first delete the default content in Settings → Advanced → Danger zone → Delete all content.
- Open Settings → Advanced → Import/Export and import the zip (not just the JSON, or the images will be missing).
- Theme settings are not part of an import: set them in Design & branding (see the table below).
Homepage sections
| Section | Content comes from |
|---|---|
| Headline band | The 8 latest posts (hidden under 3), with the Ticker label. |
| Masthead | The site title in large italics (shrunk to fit one line) and the site description. A Ghost logo replaces the title. |
| Cover story | The latest post marked Featured, or the latest post. Removed from the latest stories. |
| Top five | Posts tagged #ranking, or the latest posts. |
| Agenda | Posts tagged #agenda, 4 at most. |
| Topic in three columns | The 3 latest posts of the tag whose slug you enter (Topic section tag). |
| Quote | The excerpt of the latest post tagged #quote. |
| Latest stories | Three columns, the first card wider, Load more. Keep 8 posts per page. |
# (type #picks in the Tags field of a post). Readers never see them and they have no public page; the theme uses them to pick content.18 Oct — Théâtre des Saules, Paris. 18–20 Oct and Fri 18 Oct work too. Without a date, the publication date is shown. Remove #agenda from past events.Appearance
Paper (default), Cassis (dark) or Auto, and an optional Logo for dark mode. Duotone images tints story images in light cassis and topaze, back to full colour on hover (photos stay in colour on touch screens; images inside posts are never changed). Accent tip: #FF5C34. Fonts: DM Serif Display, Instrument Serif and Libre Franklin.
All settings
| Setting | Tab | Default | What it does |
|---|---|---|---|
| Color scheme | Site-wide | Light | Default color scheme: Light (paper) or Dark (cassis). Readers can switch. |
| Logo for dark mode | Site-wide | — | Optional logo used on the dark (cassis) scheme |
| Duotone images | Site-wide | On | Story images in cassis & topaze duotone, back to full color on hover |
| Other social links | Site-wide | — | Extra social profile URLs, comma-separated (Pinterest, WhatsApp, GitHub...) |
| Show newsletter | Site-wide | On | Subscription block (sunset gradient) at the bottom of every page |
| Newsletter heading | Site-wide | Your evenings, sorted every Friday | Heading of the subscription block |
| Newsletter text | Site-wide | Films, concerts, plays and tables worth going out for — in one letter before the weekend. | Text of the subscription block |
| Show ticker | Homepage | On | Scrolling band of the latest headlines above the masthead |
| Ticker label | Homepage | Tonight | Label at the start of the scrolling band |
| Show cover story | Homepage | On | Cover story: the latest post marked as Featured (or the latest post) |
| Show ranking | Homepage | On | Numbered top five next to the cover story: posts tagged #ranking (or the latest posts) |
| Ranking title | Homepage | The week's five | Heading of the top five |
| Show agenda | Homepage | On | Agenda of posts tagged #agenda. Start the excerpt with the date: "18 Oct — Venue" |
| Agenda title | Homepage | Tonight & this week | Heading of the agenda |
| Show topic section | Homepage | On | Three latest posts of one tag, in three columns |
| Topic section tag | Homepage | cinema | Slug of the tag shown in three columns (e.g. cinema) |
| Show quote section | Homepage | On | Full-width quote: excerpt of the latest post tagged #quote |
| Show latest | Homepage | On | Grid of the latest posts with Load more |
| Table of contents | Post | On | Show a table of contents on posts with three or more headings |
Posts per page: 8 (set by the theme). Settings are in Settings → Design & branding → Customize, in the Site-wide, Homepage and Post tabs.
Navigation & social links
- Dropdowns: in Settings → Navigation, start a label with a dash (
-About) to put it in a dropdown under the item above. That parent item only opens the dropdown; its URL is not used. - Social accounts: X, Facebook, LinkedIn, Bluesky, Threads, Mastodon, TikTok, YouTube and Instagram come from Settings → General → Social accounts. Add any other profile in the Other social links setting (comma-separated URLs): Pinterest, WhatsApp, Telegram, Discord, GitHub, Dribbble, Behance, Spotify, Twitch, Snapchat, Reddit and Medium get their icon, any other URL gets a link icon.
- The RSS icon is added automatically.
Posts & pages
- Table of contents: added automatically to posts with three or more H2 headings (setting Table of contents).
- Full width page template: choose it in the page settings for landing pages.
- The page option Show title and feature image is respected.
- Every editor card is styled, including wide and full-width images, galleries, toggles, callouts, buttons and bookmarks.
Members & newsletter
The subscription block uses Ghost’s native members. It is hidden for signed-in members, and when sign-ups are off or invite-only (Settings → Membership).
Translation
Every text of the theme goes through Ghost’s translation system. Copy locales/en.json inside the theme to locales/fr.json (or your language code), translate the values, zip the theme again and upload it. Then set the language in Settings → General → Publication language.
FAQ
Why does the top five not show my most read posts?
Ghost does not count page views. The top five is an editorial choice: tag the posts you want with #ranking.
A section of the homepage does not appear.
Check its switch in Design & branding, then its content: every section hides itself when it has nothing to show (no Featured post, no post with the internal tag, an empty tag…).
Can I change the fonts?
Yes: the fonts chosen in Design & branding → Typography replace the theme’s heading and body fonts.