Post Page

In Quick Start, we created an example article as below:

---
title: {{ replace .TranslationBaseName "-" " " | title }}
date: {{ .Date }}
lastmod: {{ .Date }}
author: Author Name
# avatar: /img/author.jpg
# authorlink: https://author.site
cover: /img/cover.jpg
# images:
#   - /img/cover.jpg
categories:
  - category1
tags:
  - tag1
  - tag2
# nolastmod: true
draft: true
---
 
Cut out summary from your post content here.
 
<!--more-->
 
The remaining content of your post.

There are some parameters in the front matter you can use to customize your post page (and also its summary).

View the below section to learn more about the parameters.

Parameters

Parameter	Description	Auto-generated
`title`	Title of the post	Yes
`date`	Date of the post	Yes
`lastmod`	Last modified date of the post	Yes
`author`	Author of the post, if it's not set, the global `author` will be used	No
`avatar`	Author's avatar	No
`authorlink`	Custom link for the current author	No
`cover`	Cover image of the post	No
`images`	Used in `og:image` meta tag	No
`categories`	Categories of the post	No
`tags`	Tags of the post	No
`nolastmod`	Disable the last modified date	No

Features

Alerts

Dream supports GitHub Alerts Markdown extension (opens in a new tab) compatible alerts. You can use it in your post like below:

> [!NOTE]
> Useful information that users should know, even when skimming content.
 
> [!TIP]
> Helpful advice for doing things better or more easily.
 
> [!IMPORTANT]
> Key information users need to know to achieve their goal.
 
> [!WARNING]
> Urgent info that needs immediate user attention to avoid problems.
 
> [!CAUTION]
> Advises about risks or negative outcomes of certain actions.

See https://g1en.site/posts/dream-post-features/ (opens in a new tab) for a live demo.

If you want to change the default title of the alerts, you can add a markdown attribute (opens in a new tab) named text like below:

> [!NOTE]
> The default alert title is changed to "Hello".
{text="Hello"}

To enable markdown attributes for block-level elements, you still need to set below configuration in your hugo.toml:

[markup]
[markup.goldmark.parser.attribute]
block = true

Mermaid Diagrams

Dream supports Mermaid (opens in a new tab) diagrams. You can use it in your post like below:

Markdown

```mermaid
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
```

Rendered as:

Social Comments About Page