Global Functionality
Tags
Ghost supports two types of tags: regular or “public” tags and internal tags.
Public Tags
Regular tags that are visible to visitors. They appear on posts, in tag archives. They can be used for navigation and to assemble different posts together. Examples of good internal tags could be:
SalesLeadershipAI
The tags are important and should be defined carefully.
Internal Tags
Tags prefixed with # that are hidden from visitors. They are only visible in Ghost Admin and are used for organizing content. There are two types:
#zz-xxx— structural/system tags. Thezz-prefix sorts them to the bottom of the tag list in Ghost Admin, keeping public tags at the top. Used for home page sections, catalog items, etc.#xxx— role tags (nozz-prefix). Used to assign a functional role to a page, e.g.#member-benefit.
LinkedIn Publishing
Posts can be automatically published to LinkedIn when they go live in Ghost.
Requirements:
- The post visibility must be set to Public (members-only posts are never pushed)
- The post must have the internal tag
#linkedin-personal
How to publish to LinkedIn:
- Write your post as usual
- In the post settings (gear icon), add the internal tag
#linkedin-personal - Make sure visibility is set to Public
- Publish — the post is automatically sent to LinkedIn within seconds
What appears on LinkedIn:
| Ghost field | LinkedIn post |
|---|---|
| Title | First line of the post |
| Excerpt (or custom excerpt) | Body text |
| Post URL | Appended below the excerpt |
| Feature image | Uploaded as the post image (falls back to link preview if no image) |
Note: LinkedIn publishing is one-way and immediate. Updating or unpublishing a Ghost post does not change or remove the LinkedIn post.
Navigation Menus
The primary navigation is configured under Settings → Navigation → Primary. Use the >, +, and - conventions to build the menu:
| Label format | Meaning |
|---|---|
Academy > |
Parent — top-level item with a dropdown |
> Workshop |
Child — nested inside the preceding parent’s dropdown |
About |
Regular — standalone item, no dropdown |
+ Tribe > |
Member-only parent — only visible when logged in (Juneberry color) |
+ > Downloads |
Member-only child — nested under the preceding member-only parent |
- Join the Tribe |
Visitor-only — only visible when NOT logged in (Oceanside color) |
Children must immediately follow their parent. A new parent or regular item ends the previous group.
Icons in navigation labels
Any nav item (including member-only and visitor-only items) can display an icon by adding [icon] after the + or - prefix and before the label:
| Syntax | Result |
|---|---|
+ [fa-ship] Tribe > |
Font Awesome icon (fa-solid fa-ship) |
+ [/assets/images/logo/AS_Boat-v01.svg] Tribe > |
Custom image from theme assets |
- Font Awesome: use
[fa-xxx]— browse icons at fontawesome.com/icons - Custom image: use the full asset path starting with
/assets/ - Icons work on parents, children, and standalone items
- Omit
[icon]entirely if no icon is needed
Custom settings
Settings related to the header buttons
Ghost Admin → Settings → Design → Site-wide
| Setting | Default | Description |
|---|---|---|
member_button_text |
Members | Text on the member button shown in the home page hero (logged-in members) |
Home Page Functionality
Sections
The home page (index.hbs) has several sections that each use ‘sub-pages’ to get their content from. They find these pages based on internal tags:
| # | Label | Tag(s) | Purpose |
|---|---|---|---|
| 1. | Hero / Book-Promote block | #zz-book |
Book promotion section, home page hero, with cover and description |
| 2. | The Triangle | #zz-as-triangle & #zz-as-triangle-pillar |
The Pillars (Character, Competence, Communication) |
| 3. | The Academy | #zz-academy & #zz-academy-service-offer |
Service offering cards such as Breakfast, Counsel |
| 4. | Featured Posts | n.a. | Posts marked as ‘Featured’ |
| 5. | Contact | #zz-contact |
Contact section header (title, excerpt, content) |
Each of these sections only use the first part, the ‘introduction’ part, of the content of each subpage. This introduction part is all the content above the first occurrence of a horizontal line. Note that the pages themselves will not show this introduction part. Also, the first divider will but cut off.
Tip 1: Insert horizontal lines in the Ghost editor by typing
---or clicking on a+sign and selectDividerfrom the list
Tip 2: If you need a visible divider in a post or page, so without triggering truncation, start the page with an additional divider at the top. It will be cut off when rendering the page.
Regular Site Pages
Regular pages on the site can stand on their own. They can be a sub-page of the home page but do not have to be.
Hero Color Templates
To change the hero section background color on a regular page, use the Template dropdown in Ghost’s Page Settings (instead of the old #zz-hero-* internal tags which are now deprecated).
How to use: In the page editor, open Page Settings (gear icon), scroll down to Template, and select one of the hero color templates from the dropdown.
| Template | Hero Color | Accent Bar |
|---|---|---|
| Default | Ocean Blue | Gold |
| Hero: Primary (Ocean Blue) | Ocean Blue | Gold |
| Hero: Secondary (Gold) | Gold | Ocean Blue |
| Hero: Highlight (Rose/Berry) | Rose/Berry | Gold |
| Hero: Accent (Violet) | Violet | Gold |
| Hero: Warning (Burnt Umber) | Burnt Umber | Gold |
| Catalog | (uses page default) | — |
| Posts listing | (uses page default) | — |
Feature Image Caption Directives (Pages)
The feature image caption field on pages can also be used for layout directives. These are detected by the theme and are not displayed to visitors.
| Directive | Effect |
|---|---|
[no-border-radius] |
Removes the rounded corners from the page hero feature image |
How to use: In the page editor, click on the featured image, find the Caption field below the image, and enter the directive.
Card Icons via Feature Image Caption
Transform offer cards can display a Font Awesome icon above the title. To add an icon:
- In the page editor, click on the featured image and find the Caption field
- Enter the icon name in the pattern
[fa-icon-name], e.g.[fa-graduation-cap] - The theme’s JavaScript will detect this pattern and render the corresponding Font Awesome icon
Rules:
- The caption must contain only the icon pattern — nothing else (e.g.
[fa-handshake]) - The
fa-prefix is required; the full class name maps to Font Awesome Solid icons (fa-solid) - If the caption does not match the
[fa-xxxx]pattern, it is hidden on the card - Font Awesome must be loaded on the site (added in the theme’s
default.hbshead)
Common icons for services:
[fa-graduation-cap]— Academy / Training[fa-handshake]— Counsel / Consulting[fa-microphone]— Keynote / Speaking[fa-calendar-days]— Events[fa-book-open]— Book / Reading
Browse all available icons at fontawesome.com/icons.
Special “Posts” Pages
To have a page show a list of Posts, select the Posts template for that page (custom-posts). This will render the page header and content, followed by a grid of post cards. It will only show posts that either are public or match the user’s tier/membership.
Post filtering
To only show Posts with a certain tag, add one primary public tag to the Post listing page (‘primary’ means it has to be the first Tag)
Post listing usage
- Create a Ghost page
- Set template to Posts
- Set a public tag as primary (e.g.
academy) - Now only Posts matching this tag will appear below the page content
For post pages it is not required, but it is good idea to mark each Posts page with the
#zz-post-listinginternal tag. This will enable additional functionality such as the display in a catalog.
Special Catalog Pages
Catalog Page
By assigning the custom template Catalog, a page becomes a listing of cards with of catalog items. The catalog items are pages tagged with an internal primary tag indicating the function of the catalog, for example #member-benefit.
The first tag of the catalog page determines which pages are pulled up as cards and are shown in the list.
Catalog pages can show two types of cards:
- Regular cards
- Post listing cards, showing the latest 3 posts
Catalog Item Pages
Catalog item pages are either regular pages or post listing pages (see above). Each catalog page should have the same internal tag as the catalog (#member-benefit in the example above).
Just like other regular ‘content providing’ pages, only the part above the first occurrence of a horizontal divider, the description, will appear in the cards on the catalog page. And just like in regular pages, on the catalog item page itself this description will cut off.
The catalog shows a posts card for any catalog item page tagged with
#zz-post-listing— the page's public primary tag filters which posts appear in the list. Pages without#zz-post-listingshow as a regular card.
Usage
- Create a new Ghost page and select the
Catalogtemplate. - Give this page an internal tag that will group the catalog, for example
#member-benefit. Note that this primary tag is required as without it, there no items will appear in the catalog. - Create a new Ghost page for each Catalog Item; apply the same
#member-benefittag so it joins the catalog - The catalog page will now list only the items sharing that internal tag