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

See https://g1en.site/posts/dream-post-features/ for a live demo.

Alerts

Dream supports GitHub Alerts Markdown extension 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.

If you want to change the default title of the alerts, you can add a markdown attribute 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 diagrams. You can use it like below:

Markdown

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

Rendered as:

Mathematics

Dream supports mathematical equations and expressions by using MathJax. The implementation of this feature referred to https://gohugo.io/content-management/mathematics/.

To use this feature, you need to enable and configure the Goldmark passthrough extension in your site configuration:

[markup]
  [markup.goldmark]
    [markup.goldmark.extensions]
      [markup.goldmark.extensions.passthrough]
        enable = true
        [markup.goldmark.extensions.passthrough.delimiters]
          block = [['\[', '\]'], ['$$', '$$']]
          inline = [['\(', '\)']]

And then you can use it like below:

Markdown

```math
This is an inline \(a^*=x-b^*\) equation.
```
 
```math
These are block equations:
 
\[
\begin{aligned}
KL(\hat{y} || y) &= \sum_{c=1}^{M}\hat{y}_c \log{\frac{\hat{y}_c}{y_c}} \\
JS(\hat{y} || y) &= \frac{1}{2}(KL(y||\frac{y+\hat{y}}{2}) + KL(\hat{y}||\frac{y+\hat{y}}{2}))
\end{aligned}
\]
 
These are also block equations:
 
$$a^*=x-b^*$$
 
$$ a^*=x-b^* $$
 
$$
a^*=x-b^*
$$
```

Social Comments About Page