From 0545b1d0e51df9a76fc9fe0fcc6935e1c8efcd88 Mon Sep 17 00:00:00 2001 From: radishzzz Date: Wed, 26 Mar 2025 11:04:21 +0000 Subject: [PATCH] chore: update theme guide --- src/content/posts/Theme Guide-en.md | 148 ++++++++++----------- src/content/posts/Theme Guide-zh.md | 192 ++++++++++++++++++++++++++++ 2 files changed, 266 insertions(+), 74 deletions(-) diff --git a/src/content/posts/Theme Guide-en.md b/src/content/posts/Theme Guide-en.md index 9487cb8..ea4cf37 100644 --- a/src/content/posts/Theme Guide-en.md +++ b/src/content/posts/Theme Guide-en.md @@ -10,194 +10,194 @@ abbrlink: theme-guide Retypeset is a static blog theme based on the [Astro](https://astro.build/) framework. Inspired by [Typography](https://astro-theme-typography.vercel.app/), Retypeset establishes a new visual standard and reimagines the layout of all pages, creating a reading experience reminiscent of paper books, reviving the beauty of typography. Details in every sight, elegance in every space. +## Theme Configuration + Below is the theme configuration file [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) for Retypeset. -## Site +### Site -``` +```typescript site: { // site title - title: 'Retypeset', + title: 'Retypeset' // site subtitle - subtitle: 'Revive the beauty of typography', + subtitle: 'Revive the beauty of typography' // site description - description: 'Retypeset is a static blog theme based on the Astro framework. Inspired by Typography... - i18nTitle: true, // true, false + description: 'Retypeset is a static blog theme based on the Astro framework. Inspired by Typography...' + i18nTitle: true // true, false // author name - author: 'radishzz', + author: 'radishzz' // site url - url: 'https://retypeset.radishzz.cc', + url: 'https://retypeset.radishzz.cc' // favicon url // recommended formats: svg, png or ico - favicon: '/icon/favicon.svg', // or https://example.com/favicon.svg -}, + favicon: '/icon/favicon.svg' // or https://example.com/favicon.svg +} ``` -## Color +### Color -``` +```typescript color: { // default theme mode - mode: 'light', // light, dark + mode: 'light' // light, dark light: { // primary color // used for title, hover, etc // oklch color picker: https://oklch.com/ - primary: 'oklch(25% 0.005 298)', + primary: 'oklch(25% 0.005 298)' // secondary color // used for post text - secondary: 'oklch(40% 0.005 298)', + secondary: 'oklch(40% 0.005 298)' // background color - background: 'oklch(96% 0.005 298)', - }, + background: 'oklch(96% 0.005 298)' + }; dark: { // primary color // used for title, hover, etc // oklch color picker: https://oklch.com/ - primary: 'oklch(92% 0.005 298)', + primary: 'oklch(92% 0.005 298)' // secondary color // used for post text - secondary: 'oklch(77% 0.005 298)', + secondary: 'oklch(77% 0.005 298)' // background color - background: 'oklch(22% 0.005 298)', - }, -}, + background: 'oklch(22% 0.005 298)' + } +} ``` -## Font +### Font -``` +```typescript global: { // default language - locale: 'zh', // zh, zh-tw, ja, en, es, ru + locale: 'zh' // zh, zh-tw, ja, en, es, ru // more languages // not fill in the locale code above again - moreLocales: ['zh-tw', 'ja', 'en', 'es', 'ru'], // ['zh', 'zh-tw', 'ja', 'en', 'es', 'ru'] + moreLocales: ['zh-tw', 'ja', 'en', 'es', 'ru'] // ['zh', 'zh-tw', 'ja', 'en', 'es', 'ru'] // font styles for post text - fontStyle: 'sans', // sans, serif + fontStyle: 'sans' // sans, serif // date format for posts - dateFormat: 'YYYY-MM-DD', // YYYY-MM-DD, MM-DD-YYYY, DD-MM-YYYY, MONTH DAY YYYY, DAY MONTH YYYY + dateFormat: 'YYYY-MM-DD' // YYYY-MM-DD, MM-DD-YYYY, DD-MM-YYYY, MONTH DAY YYYY, DAY MONTH YYYY // gap between title and subtitle - titleGap: 2, // 1, 2, 3 -}, + titleGap: 2 // 1, 2, 3 +} ``` -## Comment +### Comment -``` +```typescript comment: { // enable comment system - enabled: true, // true, false + enabled: true // true, false // waline comment system // https://waline.js.org/en/ waline: { // server url - serverURL: 'https://retypeset-comment.radishzz.cc', + serverURL: 'https://retypeset-comment.radishzz.cc' // emoji url emoji: [ 'https://unpkg.com/@waline/emojis@1.2.0/tw-emoji', // 'https://unpkg.com/@waline/emojis@1.2.0/bmoji', // more emojis: https://waline.js.org/en/guide/features/emoji.html - ], + ] // gif search - search: false, // true, false + search: false // true, false // image uploader // bug: unable to hide image uploader icon - imageUploader: false, // true, false - }, -}, + imageUploader: false // true, false + } +} ``` -## SEO +### SEO -``` +```typescript seo: { // @twitter ID - twitterID: '@radishzz_', + twitterID: '@radishzz_' // site verification verification: { // google search console // https://search.google.com/search-console - google: 'AUCrz5F1e5qbnmKKDXl2Sf8u6y0kOpEO1wLs6HMMmlM', + google: 'AUCrz5F1e5qbnmKKDXl2Sf8u6y0kOpEO1wLs6HMMmlM' // bing webmaster tools // https://www.bing.com/webmasters - bing: '64708CD514011A7965C84DDE1D169F87', + bing: '64708CD514011A7965C84DDE1D169F87' // yandex webmaster // https://webmaster.yandex.com - yandex: '', + yandex: '' // baidu search // https://ziyuan.baidu.com - baidu: '', - }, + baidu: '' + }; // google analytics // https://analytics.google.com - googleAnalyticsID: '', + googleAnalyticsID: '' // umami analytics // https://cloud.umami.is - umamiAnalyticsID: '520af332-bfb7-4e7c-9386-5f273ee3d697', + umamiAnalyticsID: '520af332-bfb7-4e7c-9386-5f273ee3d697' // follow verification // https://follow.is/ follow: { // feed ID - feedID: '', + feedID: '' // user ID - userID: '', - }, + userID: '' + }; // apiflash access key // automatically generate website screenshots for open graph images // get your access key at: https://apiflash.com/ - apiflashKey: '', -}, + apiflashKey: '' +} ``` -## Footer +### Footer -``` +```typescript footer: { // social links links: [ { name: 'RSS', - url: '/rss.xml', // rss.xml, atom.xml + url: '/rss.xml' // rss.xml, atom.xml }, { name: 'GitHub', - url: 'https://github.com/radishzzz/astro-theme-retypeset', + url: 'https://github.com/radishzzz/astro-theme-retypeset' }, { name: 'Twitter', - url: 'https://x.com/radishzz_', + url: 'https://x.com/radishzz_' }, // { - // name: 'Email', - // url: 'https://example@gmail.com', + // name: 'Email'; + // url: 'https://example@gmail.com' // } - ], + ]; // year of website start - startYear: 2024, -}, + startYear: 2024 +} ``` -## Preload +### Preload -``` +```typescript preload: { // link prefetch // docs: https://docs.astro.build/en/guides/prefetch/#prefetch-strategies - linkPrefetch: 'viewport', // hover, tap, viewport, load + linkPrefetch: 'viewport' // hover, tap, viewport, load // comment server url - commentURL: 'https://retypeset-comment.radishzz.cc', + commentURL: 'https://retypeset-comment.radishzz.cc' // image hosting url - imageHostURL: 'https://image.radishzz.cc', + imageHostURL: 'https://image.radishzz.cc' // custom google analytics js // for users who route analytics javascript to a customized domain // See https://gist.github.com/xiaopc/0602f06ca465d76bd9efd3dda9393738 - customGoogleAnalyticsJS: '', + customGoogleAnalyticsJS: '' // custom umami analytics js // for users who deploy umami on their own, or route analytics javascript to a customized domain // see https://github.com/umami-software/umami/discussions/1026 - customUmamiAnalyticsJS: 'https://js.radishzz.cc/jquery.min.js', -}, -// PRELOAD SETTINGS >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> END + customUmamiAnalyticsJS: 'https://js.radishzz.cc/jquery.min.js' } -``` \ No newline at end of file +``` diff --git a/src/content/posts/Theme Guide-zh.md b/src/content/posts/Theme Guide-zh.md index 750896e..94bb0bb 100644 --- a/src/content/posts/Theme Guide-zh.md +++ b/src/content/posts/Theme Guide-zh.md @@ -9,3 +9,195 @@ abbrlink: theme-guide --- Retypeset 是一款基于 [Astro](https://astro.build/) 框架的静态博客主题，中文名为重新编排。本主题以 [活版印字](https://astro-theme-typography.vercel.app/) 为设计灵感，通过建立全新的视觉规范，对所有页面进行重新编排，打造纸质书页般的阅读体验，再现版式之美。所见皆为细节，方寸尽显优雅。 + +## 主题配置 + +以下是 Retypeset 的主题配置文件 [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts)（待翻译）。 + +### Site + +```typescript +site: { + // site title + title: 'Retypeset' + // site subtitle + subtitle: 'Revive the beauty of typography' + // site description + description: 'Retypeset is a static blog theme based on the Astro framework. Inspired by Typography...' + i18nTitle: true // true, false + // author name + author: 'radishzz' + // site url + url: 'https://retypeset.radishzz.cc' + // favicon url + // recommended formats: svg, png or ico + favicon: '/icon/favicon.svg' // or https://example.com/favicon.svg +} +``` + +### Color + +```typescript +color: { + // default theme mode + mode: 'light' // light, dark + light: { + // primary color + // used for title, hover, etc + // oklch color picker: https://oklch.com/ + primary: 'oklch(25% 0.005 298)' + // secondary color + // used for post text + secondary: 'oklch(40% 0.005 298)' + // background color + background: 'oklch(96% 0.005 298)' + }; + dark: { + // primary color + // used for title, hover, etc + // oklch color picker: https://oklch.com/ + primary: 'oklch(92% 0.005 298)' + // secondary color + // used for post text + secondary: 'oklch(77% 0.005 298)' + // background color + background: 'oklch(22% 0.005 298)' + } +} +``` + +### Font + +```typescript +global: { + // default language + locale: 'zh' // zh, zh-tw, ja, en, es, ru + // more languages + // not fill in the locale code above again + moreLocales: ['zh-tw', 'ja', 'en', 'es', 'ru'] // ['zh', 'zh-tw', 'ja', 'en', 'es', 'ru'] + // font styles for post text + fontStyle: 'sans' // sans, serif + // date format for posts + dateFormat: 'YYYY-MM-DD' // YYYY-MM-DD, MM-DD-YYYY, DD-MM-YYYY, MONTH DAY YYYY, DAY MONTH YYYY + // gap between title and subtitle + titleGap: 2 // 1, 2, 3 +} +``` + +### Comment + +```typescript +comment: { + // enable comment system + enabled: true // true, false + // waline comment system + // https://waline.js.org/en/ + waline: { + // server url + serverURL: 'https://retypeset-comment.radishzz.cc' + // emoji url + emoji: [ + 'https://unpkg.com/@waline/emojis@1.2.0/tw-emoji', + // 'https://unpkg.com/@waline/emojis@1.2.0/bmoji', + // more emojis: https://waline.js.org/en/guide/features/emoji.html + ] + // gif search + search: false // true, false + // image uploader + // bug: unable to hide image uploader icon + imageUploader: false // true, false + } +} +``` + +### SEO + +```typescript +seo: { + // @twitter ID + twitterID: '@radishzz_' + // site verification + verification: { + // google search console + // https://search.google.com/search-console + google: 'AUCrz5F1e5qbnmKKDXl2Sf8u6y0kOpEO1wLs6HMMmlM' + // bing webmaster tools + // https://www.bing.com/webmasters + bing: '64708CD514011A7965C84DDE1D169F87' + // yandex webmaster + // https://webmaster.yandex.com + yandex: '' + // baidu search + // https://ziyuan.baidu.com + baidu: '' + }; + // google analytics + // https://analytics.google.com + googleAnalyticsID: '' + // umami analytics + // https://cloud.umami.is + umamiAnalyticsID: '520af332-bfb7-4e7c-9386-5f273ee3d697' + // follow verification + // https://follow.is/ + follow: { + // feed ID + feedID: '' + // user ID + userID: '' + }; + // apiflash access key + // automatically generate website screenshots for open graph images + // get your access key at: https://apiflash.com/ + apiflashKey: '' +} +``` + +### Footer + +```typescript +footer: { + // social links + links: [ + { + name: 'RSS', + url: '/rss.xml' // rss.xml, atom.xml + }, + { + name: 'GitHub', + url: 'https://github.com/radishzzz/astro-theme-retypeset' + }, + { + name: 'Twitter', + url: 'https://x.com/radishzz_' + }, + // { + // name: 'Email'; + // url: 'https://example@gmail.com' + // } + ]; + // year of website start + startYear: 2024 +} +``` + +### Preload + +```typescript +preload: { + // link prefetch + // docs: https://docs.astro.build/en/guides/prefetch/#prefetch-strategies + linkPrefetch: 'viewport' // hover, tap, viewport, load + // comment server url + commentURL: 'https://retypeset-comment.radishzz.cc' + // image hosting url + imageHostURL: 'https://image.radishzz.cc' + // custom google analytics js + // for users who route analytics javascript to a customized domain + // See https://gist.github.com/xiaopc/0602f06ca465d76bd9efd3dda9393738 + customGoogleAnalyticsJS: '' + // custom umami analytics js + // for users who deploy umami on their own, or route analytics javascript to a customized domain + // see https://github.com/umami-software/umami/discussions/1026 + customUmamiAnalyticsJS: 'https://js.radishzz.cc/jquery.min.js' +} +```