Skip to content

Moments

The Moments page is for short thoughts and images. It is intended for quick daily updates without the title and metadata required by a full post.

Publishing a Moment

Store moment files in src/content/dynamic/. Each Markdown file becomes one moment. The only required frontmatter field is published; use location to add an optional place:

yaml
---
published: 2026-07-15 16:15:29
location: China
---

The weather is great today, so I went out for hot pot.

The time is displayed as written in frontmatter. A timezone label calculated from siteConfig.timezone is appended after the date. When provided, location is shown beside the published time.

You can also create a moment from the command line:

bash
pnpm new-dynamic The weather is great today
pnpm new-d A quiet evening at home

Moments support regular Markdown syntax. Images are automatically arranged at the bottom of the content and support grid, carousel, and lightbox views.

Pinned Moments

Add pinned: true to the frontmatter to pin a moment. Pinned moments are displayed first:

yaml
---
published: 2026-07-15 16:15:29
pinned: true
---

This is a pinned moment.

Moment Configuration

Configure the page in src/config/dynamicConfig.ts:

ts
export const dynamicConfig = {
	title: "",
	description: "",
	profileUrl: "/about/",
	showComment: true,
	itemsPerPage: 20,
	apiUrl: "/api/dynamic.json",
	memos: {
		enable: false,
		apiUrl: "https://memos.example.com",
		parent: "users/your-username",
	},
};
OptionDescription
titlePage title. Uses the i18n translation when empty
descriptionPage description. Uses the i18n translation when empty
profileUrlDestination shared by the moment avatar and name; supports local paths and full URLs
showCommentWhether to show a comment entry for each moment
itemsPerPageNumber of moments shown per page
apiUrlMoments data API URL. Defaults to /api/dynamic.json. Ignored when memos.enable is true

TIP

Memos introduced a breaking change in version 0.30.0.

When the version of your deployed Memos service is ≥ 0.30.0, you need to set the environment variable:

MEMOS_INSTANCE_URL=https://memos.example.com

The environment variable MEMOS_INSTANCE_URL must be strictly consistent with memos.apiUrl.

Memos Data Source

Supports connecting to a Memos instance for real-time data:

ts
memos: {
	enable: true,
	apiUrl: "https://memos.example.com",
	parent: "users/xiaye",
},
OptionDescription
enableWhether to enable Memos data source
apiUrlMemos instance URL
parentUser identifier to filter moments for a specific user

When enabled, the client fetches data directly from the Memos API in real-time, supporting pinned sync and image attachments. Memos location.placeholder is mapped to the moment location.

Custom API URL

apiUrl supports two formats:

  • Relative path (default): "/api/dynamic.json" — uses the locally built JSON file
  • Absolute URL: "https://firefly.cuteleaf.cn/api/dynamic.json" — uses a third-party endpoint

The third-party endpoint must return the following JSON structure:

json
[
  {
    "id": "dynamic-id",
    "published": 1721059200000,
    "html": "<p>Moment content HTML</p>",
    "images": [
      { "alt": "Image description", "src": "/path/to/image.jpg" }
    ],
    "searchText": "Plain text for search",
    "pinned": false,
    "location": "Guangxi"
  }
]

TIP

The sidebar "Latest Moments" widget also fetches data from this URL, making it easy to integrate with a unified third-party backend.

The page switch is in src/config/siteConfig.ts:

ts
pages: {
	dynamic: true,
}

When disabled, the Moments page, navigation entry, and Moments sidebar widget are hidden.