Theme settings guide
Blogga, setting by setting.
Blogga is a quiet personal blog theme for Ghost. It has twenty controls in Ghost Admin: the typeface, the colour scheme, the greeting, the feed layout, the featured style and the details of a post. Its one colour is Ghost’s own accent colour. Every setting has a default that already looks right, so most sites only change a few.
Where the settings live
The twenty settings are in Ghost Admin, in one place:
Settings→Design & branding→Customize→Theme
Ghost groups them into Site wide, Homepage and Post, the three groups used below. Your publication icon and accent colour live one tab over, in Ghost’s own Brand settings, and fonts are on the Typography tab.
Changes preview live and nothing goes public until you press Save.
First hour
Just activated the theme? These steps make it look like the demo.
- Set the accent colour. Under Brand, pick a strong, saturated colour. The demo uses electric ultramarine, #3F33F0. Ghost’s default pink shows until you change it. Pale colours such as yellow, mint or pink are handled automatically.
- Add your icon and description. The publication icon appears beside the site title and in the greeting, so use a square image of at least 512 × 512 px. The site description becomes the large greeting at the top of the homepage, so write one or two sentences in your own voice.
- Build the navigation. The primary navigation sits at the right of the header and folds behind a menu button on phones. Four to six items works best, for example /tag/essays/, /tag/notes/ and /about/. Put Archive, Topics, Contact, RSS and Privacy in the secondary navigation, which becomes the footer links.
- Pick a feed layout. Ledger is the default. Switch to Journal for thumbnails and excerpts, or Grid for cards.
- Feature a post. Open a post, switch on Feature this post in its settings, and it is pinned above the index.
- Turn on members under Settings → Membership if you want subscribe forms, a paywall and comments. Blogga styles all of them.
All twenty settings
Each setting is listed with its internal key, its control type and its default.
Site wide
Applies across the whole site.
Serif sets headlines and reading text in Newsreader. Sans sets them in Instrument Sans. Dates, navigation, buttons and captions are always Instrument Sans.
Where it appears: every page.
If you choose heading or body fonts in Ghost’s Typography settings, those are used instead.
System follows each visitor’s device and adds a light and dark toggle to the header, remembering their choice. Light or Dark forces one scheme for everyone and hides the toggle.
Where it appears: every page, and the header toggle.
The scheme is set before the page paints, so there is no flash of the wrong one.
Keeps the header in view as visitors scroll.
Where it appears: the header.
Replaces the default copyright line at the bottom of the footer.
Where it appears: the bottom of the footer.
Empty shows your site title, a copyright sign and the year.
The heading above the newsletter form in the footer.
Where it appears: the footer.
Leave it empty to hide the form. It only appears when members are on, and it is hidden from signed-in members.
Homepage
Applies to the homepage, and the feed layout also to tag and author pages.
Greeting sets your site description large at the top of the homepage, with your publication icon beside it. Compact shows a small version. Off leaves the greeting out.
Where it appears: the top of the homepage.
If the site description is empty there is no greeting to show.
Ledger sets one row per post, with the title on the left and the date on the right. Journal adds a tag, date and short excerpt, and a thumbnail when the post has an image. Grid shows cards three across on desktop, with a large date card for posts that have no image.
Where it appears: the homepage, tag pages and author pages.
One layout is used across the whole site, so it reads as a single document.
Off pins nothing. Strip pins up to three featured posts above the index as slightly larger rows. Spotlight lifts the newest into a wide, image-led feature and lists the others as rows beneath it.
Where it appears: the top of the homepage.
Mark posts as Featured in their settings. Featured posts are removed from the index below, so nothing appears twice. Give the newest one a feature image for the Spotlight.
Hangs the year as a large light numeral in the margin of the index, where the year changes.
Where it appears: the Ledger and Journal layouts.
Without JavaScript every row simply shows its full date.
Adds a short excerpt under each title in the Ledger layout.
Where it appears: the Ledger layout.
Journal and Grid always show an excerpt.
Pages uses Newer and Older links. Load more adds a button that appends the next posts to the page in place.
Where it appears: the bottom of the index.
Page 2 onwards uses the same index without the greeting and featured posts.
Post
Applies to posts and the lists that link to them.
Shows the estimated reading time in the meta line.
Where it appears: posts and lists.
Always shows the author’s name in the meta line.
Where it appears: the post header.
A byline appears automatically on posts with more than one author.
A contents list built from the Heading 2 and Heading 3 blocks, shown on posts with three or more headings.
Where it appears: the top of long posts.
It needs a little JavaScript.
A thin progress bar along the top of the window while reading.
Where it appears: posts.
Lets readers click an image in a post to view it large.
Where it appears: images inside posts.
Copy link, Bluesky, X, LinkedIn and email links after the article, set as plain text links.
Where it appears: the end of a post.
Copy link tells screen readers when it has worked.
Links to the previous and next posts after the article.
Where it appears: the end of a post.
Up to three “Read next” posts after the article, found through the post’s primary tag.
Where it appears: the end of a post.
The heading above the subscribe form after a post.
Where it appears: the end of a post.
Leave it empty to hide the form. It is hidden from signed-in members and when members are off.
How the homepage builds itself
Featured posts are never listed twice, and blocks with nothing to show disappear. From top to bottom:
- The greeting: your site description, set large, with your icon beside it.
- Featured posts: up to three posts marked Featured, pinned above the index as a strip or a Spotlight.
- The index: every other post, in the Feed layout you chose, grouped by year in the Ledger and Journal layouts.
- Pagination: Newer and Older links, or a Load more button.
Removing the featured posts from the index uses a little JavaScript. Without it, a featured post shows in both places.
Extra pages
Blogga includes four page templates. Open a page’s settings (the gear icon in the editor) and choose one from the Template menu, then add the page to your navigation under Settings → Navigation. Any text you write on the page appears above the list.
| Template | Use it for |
|---|---|
| Default | An ordinary page. |
| custom-narrow | Centred prose with no title bar: a good fit for About or Now pages, where the writing should simply begin. |
| custom-archive | Every post, newest first, grouped by year in the ledger. It shows the latest 100 posts, the most Ghost returns in one request. |
| custom-tags | Every topic (tag) with its description and post count, busiest first. |
| custom-authors | Every author who has published, with avatar, bio and post count. |
Writing for Blogga
- Featured posts. A featured post gets a small accent dot in the index and, depending on Featured style, is pinned above it.
- Standfirst. A post’s Excerpt (in the post settings) is the large grey line under the title, and the text under the title in Journal, Grid and the Spotlight. Without one, Ghost’s automatic excerpt is used in lists.
- Primary tag. The first tag is the one shown in the meta line and used to find related posts.
- Headings. Heading 2 and Heading 3 form the contents list, and every heading gets a small # link for deep linking when hovered.
- Callouts and quotes. The accent callout is tinted with your accent colour; the other colours are quiet tints. A normal quote has a hairline and an opening quote mark, and the alternative quote style is set larger and centred for pull quotes.
- Code. Add a code card and choose a language. It is highlighted when the page loads, with a Copy button on every block. JavaScript, TypeScript, CSS, HTML, Bash, JSON, YAML, Python, PHP, Ruby, Go, Rust, SQL, Markdown, diff and Handlebars are supported.
- Wide and full-width images. Use the image card’s width controls. Wide images break out of the column and full-width images run edge to edge.
- Members-only posts. A small padlock marks them in every list. Add the Public preview divider in the editor to choose where the free opening ends.
Every editor card is styled: image (normal, wide and full), gallery, bookmark, callout, toggle, button, product, file, audio, video, signup, header, embed, both quote styles, code, tables and dividers.
Recommended image sizes
| Image | Recommended |
|---|---|
| Feature image | 2000 × 1125 px (16:9), at least 1600 wide. Shown wide at the top of a post and as the Spotlight. The Journal thumbnail (4:3) and Grid card (3:2) crop to the centre, so keep the subject central. |
| Tag image | 1600 × 686 px (21:9). Optional; shown above the tag’s name. |
| Author cover image | 1600 × 686 px (21:9). Optional; shown on the author page. |
| Author profile image | 600 × 600 px, square. Shown as a circle. |
| Publication icon | 512 × 512 px, square. Shown as a circle beside the site title. |
| Content images | Any size, up to 2000 px wide. Ghost resizes them. |
Members, comments and search
Blogga uses Ghost’s native memberships, so there is nothing extra to install.
- Portal. The Sign in, Account and Subscribe links in the header use Ghost’s Portal. Signed-in members see Account, and the subscribe prompts disappear.
- Subscribe forms appear after each post and in the footer, never both on the same screen. Empty each one’s text setting to turn it off.
- Paywall. Members-only and paid-only posts show the free preview, then a quiet sign-up or upgrade notice.
- Comments appear under each post when they are enabled in Ghost.
- Search opens from the button in the header and uses Ghost’s built-in search.
- Recommendations, when enabled in Ghost, appear in the footer under “Elsewhere”.
Beyond the settings
Fonts
Newsreader and Instrument Sans are bundled with the theme and loaded from your own site, so Blogga makes no request to a font service. If you choose a heading or body font under Typography, Ghost loads it from Bunny Fonts and Blogga switches to it cleanly. Leave Typography on “Theme default” for no third-party font requests at all.
Translations
Fixed wording such as “Read next”, “Contents” and “Copy link” is listed in locales/en.json, along with the messages in the theme’s JavaScript. To change a phrase, or translate the theme, edit that file (or copy it to your language code, such as locales/de.json), set the publication language in Settings → General, and upload the theme again. The interface is laid out left to right.
Small changes
For small tweaks, such as extra CSS, use Ghost’s Code Injection under Settings → Advanced so theme updates stay easy. Do not remove {{ghost_head}}, {{ghost_foot}} or the asset helpers. Ghost depends on them.
Updating
Download your current theme as a backup, upload the new ZIP, check the homepage, one post and one tag page, then activate it. Ghost asks whether to overwrite the existing theme; say yes. Your settings are kept, and new settings take their defaults. If you have edited the theme’s files, keep a copy of your changes first, because the upload replaces them. See the main documentation for the full steps.
Troubleshooting
The site is pink
Ghost’s default accent colour is pink. Set your own under Settings → Design & branding → Brand → Accent colour.
There are no Subscribe or Sign in links
Turn on memberships under Settings → Membership → Access and allow anyone to sign up. The links and forms are hidden when members are off.
The homepage has no greeting
The greeting is your site description. Add one under Settings → General → Title & description, and check that Intro style is not Off.
The footer has no signup form
Members must be on, and Footer signup text must not be empty. The form is also hidden from signed-in members.
The contents list is missing
The post needs at least three Heading 2 or Heading 3 blocks, and Show table of contents must be on.
A page template is not in the list
The Template menu appears in the page’s settings once Blogga is the active theme. If it is missing, upload the theme again.
The archive stops at 100 posts
That is the most Ghost returns in a single request. Use tags, topics or search to reach older posts.
I cannot find the theme settings panel
Blogga must be the active theme, not merely uploaded. Activate it under Settings → Design & branding → Change theme, then reload Ghost Admin. Custom settings appear under Customize → Theme.
Still stuck?
Email [email protected] with your Ghost version, the page URL and a screenshot. If you have customised the theme, say what you changed. Support covers installing Blogga, its documented settings and confirmed defects, and replies usually come within two business days.
For installation, updates and licensing, see the main documentation. For release notes, see the changelog.