> For the complete documentation index, see [llms.txt](https://docs.themeupstudio.com/crimson/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.themeupstudio.com/crimson/homepage/homepage-sections.md).

# Homepage Sections

Crimson’s homepage is built from multiple “sections” stacked in a specific order. Each section can pull content from Ghost (posts, tags, authors), or from Crimson’s theme settings (Design → Theme settings).

If some sections look empty after activating the theme, it’s usually because your site doesn’t yet have enough **posts**, **featured posts**, or the required **tags/internal tags** (like `#trending` or `#editors-choice`).

### Homepage Layout Order

Typical section order in Crimson:

1. **Primary Header**
2. **Header Secondary**
3. **Trending News Ticker**
4. **Carousel**
5. **3 Column Hero**
6. **Tag Sections** (repeats for multiple tag slugs)
7. **Editor’s Choice** (after the 1st Tag section)
8. **Top Categories** (after the 2nd Tag section)
9. **Subscribe Form** (after every 4th Tag section)
10. **Top Authors** (after all Tag sections, at the end, just before Footer)
11. **Footer**

{% hint style="warning" %}
Note: Some of these appear only when enabled in settings and/or when content exists.
{% endhint %}

***

### Where to Configure Homepage Sections

You will mainly configure Crimson homepage behavior from two places:

#### 1) Ghost Navigation (Menus)

Go to: **Ghost Admin → Settings → Navigation**

* **Primary navigation** appears in the **Primary Header**
* **Secondary navigation** appears in the **Header Secondary** (when set to show secondary nav)

#### 2) Crimson Theme Settings

Go to: **Ghost Admin → Settings → Design → Theme Settings**\
This is where you enable/disable sections and choose sources like **Featured vs Latest**, tag slugs for sections, etc.

{% hint style="warning" %}
If you want to reorder sections, then you need to edit the theme code
{% endhint %}

***

### Primary Header

<figure><img src="/files/7ESRry3TB0x3JR2HgRdr" alt=""><figcaption><p>Primary Header</p></figcaption></figure>

#### What it shows

The top-most header typically contains:

* Brand logo
* Primary navigation (menu)
* Search icon
* Dark mode toggle
* Language switcher
* **Subscribe** button (or **Account** button if the visitor is logged in)

#### Where it gets content

* **Logo**: Ghost brand settings (publication logo)
* **Primary navigation**: Ghost Admin → Settings → Navigation
* **Search**: Native search UI
* **Dark mode**: Theme UI toggle (no Ghost setup required)
* **Language switcher**: Theme multilingual config (shown only if enabled/configured)
* **Subscribe/Account**: Ghost Members status (`@member`) and your portal/account link preference

{% hint style="success" %}
Read more about the above settings in [Custom Settings](/crimson/custom-settings/overview.md)
{% endhint %}

***

### Header Secondary

<figure><img src="/files/8Ytz0rtAtO9T0HMRUOrM" alt=""><figcaption><p>Header Secondary</p></figcaption></figure>

#### What it shows

A second header row that shows either:

* **Secondary navigation**, OR
* **Top Tags** (based on your theme setting)

#### Where it gets content

* **Secondary nav**: Ghost Admin → Settings → Navigation (Secondary)
* **Top Tags**: Ghost tags sorted by post count (usually excluding internal tags)

{% hint style="success" %}
Read more about this setting in [Secondary Navigation (Header)](/crimson/navigation/secondary-navigation-header.md)
{% endhint %}

***

### Trending News Ticker

<figure><img src="/files/FUyNRul6M4BElNTcVRAs" alt=""><figcaption><p>Trending News Ticker</p></figcaption></figure>

#### What it shows

A moving ticker (headline strip) that displays **post titles** for posts that have the internal tag `#trending`

#### Where it gets content

* Posts tagged with **internal tag** `#trending`

{% hint style="success" %}
Read more about this ticker in [Trending Ticker](/crimson/homepage/trending-ticker.md)
{% endhint %}

***

### Carousel

<figure><img src="/files/A7MYdotQIrqUD7iUUAZ1" alt=""><figcaption><p>Carousel</p></figcaption></figure>

#### What it shows

A carousel slider that displays **exactly 3 posts**.

You can choose the source as:

* **Featured posts**, OR
* **Latest posts**

#### Where it gets content

* **Featured**: posts marked “Featured” in Ghost
* **Latest**: most recent published posts

{% hint style="success" %}
Read more in [Carousel](/crimson/homepage/carousel.md) section.
{% endhint %}

***

### 3 Column Hero

<figure><img src="/files/T0PiC1BAPcDDamMIBzyr" alt=""><figcaption><p>3 Column Hero</p></figcaption></figure>

#### What it shows

A hero layout with 3 columns where each column can show:

* **Featured** or **Latest** posts (per-column setting)
* Additionally, the **right column** can optionally show posts from a **specific tag slug**.

#### Where it gets content

* Featured or Latest (per column)
* Optional filter: right column by a tag slug (example: `news`, `guides`, `reviews`)

{% hint style="success" %}
Read more about this in [3 Column Hero](/crimson/homepage/3-column-hero.md) section.
{% endhint %}

***

### Tag Sections (Repeated)

<figure><img src="/files/GovmnbLrVWOjwiKEQHWT" alt=""><figcaption><p>Tag Sections</p></figcaption></figure>

#### What it shows

Crimson can repeat “Tag sections” across the homepage. Each Tag section is built from a **tag slug** selected in theme settings.

Example:

* Tag section for `news`
* Tag section for `guides`
* Tag section for `reviews`

#### Where it gets content

* Posts that are assigned to the tag slug configured for that section.

{% hint style="success" %}
Read more about them in [Tag Sections](/crimson/homepage/tag-sections.md) section.
{% endhint %}

***

### Editor’s Choice

<figure><img src="/files/71vA6eDAflZSWul7KCPj" alt=""><figcaption><p>Editor's Choice</p></figcaption></figure>

#### What it shows

A curated section that appears **after the first Tag section**.

#### Where it gets content (typical options)

Editor’s Choice is powered by:

* A specific **internal tag** `#editors-choice`  added to a post.

{% hint style="success" %}
Read more about this in [Editor's Choice](/crimson/homepage/editors-choice.md) section.
{% endhint %}

***

### Top Categories

<figure><img src="/files/pQJlgWbssFrltyXbMfGy" alt=""><figcaption><p>Top Categories</p></figcaption></figure>

#### What it shows

A “Top Categories” block (usually tag cards) showing **top 4 tags** based on number of posts.

It appears **after the second Tag section**.

#### Where it gets content

* Ghost tags sorted by post count (public tags only)

{% hint style="success" %}
Read more about this in [Top Categories](/crimson/homepage/top-categories.md) section.
{% endhint %}

***

### Subscribe Form

<figure><img src="/files/3drZppWCcKBV2koeN5Gw" alt=""><figcaption><p>Subscribe Form</p></figcaption></figure>

#### What it shows

A newsletter/membership subscribe form that appears:

* after the **4th**, **8th**, **12th**… Tag section

#### Where it gets content

* Ghost Members subscribe flow (email signup)
* May open Portal or use embedded form depending on Crimson setup

{% hint style="success" %}
Read more on this in [Homepage Subscribe Forms & CTAs](/crimson/homepage/homepage-subscribe-forms-and-ctas.md) section.
{% endhint %}

***

### Top Authors

<figure><img src="/files/tNtAfBHwnMJ35TYxsWMQ" alt=""><figcaption><p>Top Authors</p></figcaption></figure>

#### What it shows

A Top Authors section (usually author cards) that displays the **Top 6 authors**, sorted by:

* number of published posts

This section appears **after all Tag sections end** and just before the **Footer**.

#### Where it gets content

* Ghost authors and their published post counts
* Crimson uses the Content API to load more, so it requires your Content API key setup for pagination.

{% hint style="success" %}
Read more about this in [Top Authors](/crimson/homepage/top-authors.md) section.
{% endhint %}

***

### Footer

<figure><img src="/files/KQ5DtyW8t4oblxpU3Bmf" alt=""><figcaption><p>Footer</p></figcaption></figure>

#### What it shows

The final section of the homepage, typically containing:

* Footer navigation links
* Brand Logo for Dark mode (Footer is always with dark background)
* Copyright text

#### Where it gets content

* Footer nav (Ghost Secondary navigation)
* Brand logo is fetched from the custom setting.

{% hint style="success" %}
Read more about adding logo in [Site-wide Settings](/crimson/custom-settings/site-wide-settings.md#logo-for-dark-mode) and adding Footer navigation in [Footer Navigation](/crimson/navigation/footer-navigation.md) sections.
{% endhint %}

***

### Common Setup Checklist (So Homepage Looks Like the Demo)

If your homepage looks empty, do this:

1. Publish at least **10–20 posts**
2. Create and assign tags properly
3. Mark at least **3 posts as Featured** (if using Featured in Carousel/Hero)
4. Add internal tags where needed:
   * `#trending` for ticker
   * `#editors-choice`  for editors choice section
5. Configure:
   * Primary + Secondary navigation
   * Homepage tag slugs list (enough to trigger subscribe form if you want it)