🔥 📝 Fixed #148 Add English language support.

assets/css/_common/outline/footer/index.scss

@@ -49,15 +49,15 @@
       }
 
       .flag-icon-zh-cn  {
-        background-image: url("/imgs/flags/zh-CN.png");
+        background-image: url("/imgs/flags/zh-cn.svg");
       }
   
       .flag-icon-en-us {
-        background-image: url("/imgs/flags/en-US.png");
+        background-image: url("/imgs/flags/en-us.svg");
       }
   
       .flag-icon-fr-fr {
-        background-image: url("/imgs/flags/fr-FR.png");
+        background-image: url("/imgs/flags/fr-fr.svg");
       }
     }
 

assets/js/3rd/others/translate.js

@@ -1,9 +0,0 @@
-/* Google translate plugin */
-NexT.plugins.others.translate = function() {
-  const element = '#gtranslate';
-  if (!NexT.utils.checkDOMExist(element)) return;
-  NexT.utils.lazyLoadComponent(element, function() { 
-    window.translateelement_styles='/css/google-translate.min.css'; 
-    NexT.utils.getScript('/js/3rd/google-translate.min.js');
-  });
-}

exampleSite/content/post/01-hello-world/index.en-us.md

@@ -0,0 +1,60 @@
+---
+title:  "Hello world"
+description:  "Quickly describe the basic usage of Hugo website building."
+
+date: 2025-01-25T19:12:32+08:00
+lastmod: 2025-01-25T19:12:32+08:00
+
+categories:
+  - Start building website
+
+tags:
+  - Hugo
+  - Start now
+
+url: demo/hello-world.html
+toc: true
+weight: 2
+---
+
+> Use the keyword `weight` to top the article.
+
+[Hugo](https://gohugo.io/), It is currently the fastest website construction framework in the world and one of the most popular open-source static site generators. With its astonishing speed and flexibility, Hugo has once again made website construction interesting.
+
+<!--more-->
+
+## Quick Start
+
+### Publish a new article
+
+```shell
+$ hugo new hello-world.md
+```
+
+More information: [Content format](https://gohugo.io/content-management/formats/)
+
+### Start service
+
+```shell
+$ hugo server
+```
+
+More information: [Hugo Service Command Line](https://gohugo.io/commands/hugo_server/)
+
+### Generate static files
+
+```shell
+$ hugo
+```
+
+More information: [Hugo website building](https://gohugo.io/commands/hugo/)
+
+### Deploy to server
+
+```language
+$ hugo deploy
+```
+
+More information: [Hugo Release](https://gohugo.io/commands/hugo_deploy/)
+
+Good luck, I believe you will love Hugo's journey of building a website!

exampleSite/content/post/02-external-link/index.en-us.md

@@ -0,0 +1,36 @@
+--- 
+title:  "Welcome to the Hugo NexT organization"
+description: "Hugo NexT is a theme specifically designed for the Hugo engine, maintaining simplicity, ease of use, and powerful functionality! "
+Keywords: "Hugo, NexT, organization"
+
+date: 2025-01-25T20:59:12+08:00
+lastmod: 2025-01-25T20:59:12+08:00
+
+categories:
+  - Example
+tags:
+  - Hugo
+  - NexT
+
+expand: true
+extlink:  https://gitee.com/hugo-next/hugo-theme-next/
+
+weight: 1
+---
+
+Welcome to the Hugo NexT documentation site! It is from [Theme NexT](https://theme-next.js.org/) The transplanted one is [Hugo](https://gohugo.io/) The high- quality and elegant theme created maintains its easy- to- use features and powerful functionality.
+
+
+
+## User Guide
+
+Setting up a NexT theme is easy. Simply follow the documentation to quickly create your personal website!
+
+## Feedback
+
+- Visit the Awesome NexT list to share plugins and tutorials with other users.
+- Join our Gitter chat.
+- Add or improve translations within seconds.
+- Report one in GitHub Issues :bug: .
+- Apply for a new feature on GitHub.
+- Request a vote for the most popular feature.

exampleSite/content/post/02-external-link/index.md

@@ -14,10 +14,7 @@ tags:
 
 expand: true
 extlink: https://gitee.com/hugo-next/hugo-theme-next/
-#comment:
-# enable: false
-#toc: false
-#url: "external-link.html"
+
 weight: 1
 ---
 

exampleSite/content/post/03-markdown-syntax/index.en-us.md

@@ -0,0 +1,222 @@
+---
+Title: "Markdown Syntax Support"
+description:  Describe the various markdown syntax and effect displays supported by NexT themes
+isCJKLanguage: false
+
+publishDate: 2025-01-25T20:52:18+08:00
+lastmod: 2025-01-25T20:52:18+08:00
+
+author: Mainroad
+originLink:  https://mainroad-demo.netlify.app/demo/basic-elements/
+
+categories:
+  - Example
+  - Markdown Syntax
+ 
+tags:
+  - Markdown
+  - Grammar
+
+toc: false
+draft: false
+url: demo/markdown-syntax.html
+---
+
+Only use this article to test whether the various syntax written in the content of the `Markdown` file is supported when building a website using the `Hugo` engine in the `NexT` theme, and demonstrate the actual effect.
+
+<!--more-->
+
+## Title Style
+
+Let's start with all possible headings, where the `<h1>` - `<h6>` elements in HTML represent six different levels of heading styles, with `<h1>` being the maximum heading`< H6>` is the minimum title, with the following effect:
+
+# Title 1
+## Title 2
+### Title 3
+#### Title 4
+##### Title 5
+###### Title 6
+
+
+## Paragraph format
+
+According to [W3C](https://www.w3.org/)Defined [HTML5 Specification](https://www.w3.org/TR/html5/dom.html#elements)，**HTML documents consist** of elements and text. The composition of each element consists of a [Start marker](https://www.w3.org/TR/html5/syntax.html#syntax), for example:`< body>` ， And [End Mark](https://www.w3.org/TR/html5/syntax.html#syntax), for example:`</ body>` . 
+
+(*Some start and end markers may be omitted in certain situations and implied by other markers*.)
+
+Elements can have attributes that control how they work. For example, hyperlinks are formed using the `a` element and its `ref` attribute.
+
+### Markdown syntax
+
+```markdown
+! [Image Description] (Image Address)
+```
+![hugo-next-primary](//hugo-next.github.io/imgs/logo/hugo-next-primary.png)
+
+### HTML IMG tags
+
+```html
+<img src="Image Address" width="Width" height="Height"/>
+```
+
+<img src="//hugo-next.github.io/imgs/logo/hugo-next-secondary.png" width="150"/>
+
+### SVG format
+
+```html
+<svg>xxxxxx</svg>
+```
+
+<svg class="canon" xmlns=" http://www.w3.org/2000/svg " overflow="visible" viewBox="0 0 496 373" height="373" width="496"><g fill="none"><path stroke="#000" stroke-width=".75" d="M.599 372.348L495.263 1.206M.312.633l494.95 370.853M.312 372.633L247.643.92M248.502.92l246.76 370.566M330.828 123.869V1.134M330.396 1.134L165.104 124.515"></path><path stroke="#ED1C24" stroke-width=".75" d="M275.73 41.616h166.224v249.05H275.73zM54.478 41.616h166.225v249.052H54.478z"></path><path stroke="#000" stroke-width=".75" d="M.479.375h495v372h-495zM247.979.875v372"></path><ellipse cx="498.729" cy="177.625" rx=".75" ry="1.25"></ellipse><ellipse cx="247.229" cy="377.375" rx=".75" ry="1.25"></ellipse></g></svg>
+
+## List type
+
+### Ordered List
+
+1. The first element
+2. The second element
+3. The third element
+
+### Unordered List
+
+* List elements
+* Another element
+* And other elements
+
+### Nested List
+
+Using HTML's `ul` element to implement.
+
+<ul>
+  <li>First item</li>
+  <li>Second item
+    <ul>
+      <li>Second item First subitem</li>
+      <li>Second item second subitem
+        <ul>
+          <li>Second item Second subitem First sub-subitem</li>
+          <li>Second item Second subitem Second sub-subitem</li>
+          <li>Second item Second subitem Third sub-subitem</li>
+        </ul>
+      </li>
+      <li>Second item Third subitem
+        <ol>
+          <li>Second item Third subitem First sub-subitem</li>
+          <li>Second item Third subitem Second sub-subitem</li>
+          <li>Second item Third subitem Third sub-subitem</li>
+        </ol>
+    </ul>
+  </li>
+  <li>Third item</li>
+</ul>
+
+### Custom List
+
+Custom lists (table lists) are also supported through HTML's `dl` element.
+
+<dl>
+  <dt>Hugo directory structure</dt>
+  <dd>assets</dd>
+  <dd>hugo.toml</dd>
+  <dd>content</dd>
+  <dd>data</dd>
+  <dd>theme</dd>
+  <dd>static</dd>
+  <dt>Hugo Template</dt>
+  <dd>Basic Template</dd>
+  <dd>List Template</dd>
+  <dd>Single page template</dd>
+</dl>
+
+## Block reference
+
+
+The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.
+
+> Quoted text.
+> This line is part of the same quote.
+> Also you can *put* **Markdown** into a blockquote.
+
+Blockquote with a citation.
+
+<blockquote>
+  <p>My goal wasn't to make a ton of money. It was to build good computers. I only started the company when I realized I could be an engineer forever.</p>
+  <footer>— <cite>Steve Wozniak</cite></footer>
+</blockquote>
+
+According to Mozilla's website, <q cite="https://www.mozilla.org/en-US/about/history/details/">Firefox 1.0 was released in 2004 and became a big success.</q>
+
+## Table
+
+Tables aren't part of the core `Markdown` spec, but `Hugo` supports them.
+
+| ID  | Make      | Model   | Year |
+| --- | --------- | ------- | ---- |
+| 1   | Honda     | Accord  | 2009 |
+| 2   | Toyota    | Camry   | 2012 |
+| 3   | Hyundai   | Elantra | 2010 |
+
+Colons can be used to align columns.
+
+| Tables      | Are           | Cool         |
+|:----------- |:-------------:| ------------:|
+| align: left | align: center | align: right |
+| align: left | align: center | align: right |
+| align: left | align: center | align: right |
+
+You can also use inline Markdown.
+
+| Inline     | Markdown  | In                | Table      |
+| ---------- | --------- | ----------------- | ---------- |
+| *italics*  | **bold**  | ~~strikethrough~~ | `code`     |
+
+## Code
+
+Use Markdown syntax to write code blocks:
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<title>Example HTML5 Document</title>
+</head>
+<body>
+<p>Test</p>
+</body>
+</html>
+```
+
+Use Hugo's `highlight` shortcode to write code blocks:
+
+{{< highlight html "hl_lines=2 5-7, linenostart=44" >}}
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<title>Example HTML5 Document</title>
+</head>
+<body>
+<p>Test</p>
+</body>
+</html>
+{{< /highlight >}}
+
+
+## Other stuff — abbr, sub, sup, kbd, etc.
+
+<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.
+
+H<sub>2</sub>O
+
+C<sub>6</sub>H<sub>12</sub>O<sub>6</sub>
+
+X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
+
+Press <kbd>X</kbd> to win. Or press <kbd><kbd>CTRL</kbd>+<kbd>ALT</kbd>+<kbd>F</kbd></kbd> to show FPS counter.
+
+<mark>As a unit of information in information theory, the bit has alternatively been called a shannon</mark>, named after Claude Shannon, the founder of field of information theory.
+
+Reference resources:
+
+- Refert from **Mainroad** theme [Basic Elements](https://mainroad-demo.netlify.app/post/basic-elements/)Content

exampleSite/content/post/03-markdown-syntax/index.md

@@ -40,7 +40,7 @@ url: demo/markdown-syntax.html
 
 ## 段落格式
 
-根据[ W3C ](https://www.w3.org/)定义的[ HTML5 规范](https://www.w3.org/TR/html5/dom.html#elements)，**HTML 文档由元素和文本组成**。每个元素的组成都由一个[开始标记](https://www.w3.org/TR/html5/syntax.html#syntax-start-tags)表示，例如： `<body>` ，和[结束标记](https://www.w3.org/TR/html5/syntax.html#syntax-end-tags)表示，例如： `</body>` 。（*某些开始标记和结束标记在某些情况下可以省略，并由其他标记暗示。*）
+根据[W3C](https://www.w3.org/)定义的[HTML5 规范](https://www.w3.org/TR/html5/dom.html#elements)，**HTML 文档由元素和文本组成**。每个元素的组成都由一个[开始标记](https://www.w3.org/TR/html5/syntax.html#syntax-start-tags)表示，例如： `<body>` ，和[结束标记](https://www.w3.org/TR/html5/syntax.html#syntax-end-tags)表示，例如： `</body>` 。（*某些开始标记和结束标记在某些情况下可以省略，并由其他标记暗示。*）
 元素可以具有属性，这些属性控制元素的工作方式。例如：超链接是使用 `a` 元素及其 `href` 属性形成的。
 
 ### Markdown 语法
@@ -48,14 +48,14 @@ url: demo/markdown-syntax.html
 ```markdown
 ![图像说明](图像地址)
 ```
-![hugo-next-primary](//lisenhui.gitee.io/imgs/hugo-next/logo/hugo-next-primary.png)
+![hugo-next-primary](//hugo-next.github.io/imgs/logo/hugo-next-primary.png)
 
 ### HTML IMG 标签
 
 ```html
 <img src="图像地址" width="宽度" height="高度" />
 ```
-<img src="//lisenhui.gitee.io/imgs/hugo-next/logo/hugo-next-secondary.png" width="150"/>
+<img src="//hugo-next.github.io/imgs/logo/hugo-next-secondary.png" width="150"/>
 
 ### SVG 格式
 
@@ -113,7 +113,7 @@ url: demo/markdown-syntax.html
 <dl>
   <dt>Hugo 目录结构</dt>
   <dd>assets</dd>
-  <dd>config.toml</dd>
+  <dd>hugo.toml</dd>
   <dd>content</dd>
   <dd>data</dd>
   <dd>theme</dd>
@@ -167,6 +167,8 @@ url: demo/markdown-syntax.html
 
 ## Code
 
+使用 Markdown 语法书写代码块：
+
 ```html
 <!DOCTYPE html>
 <html lang="en">
@@ -180,7 +182,9 @@ url: demo/markdown-syntax.html
 </html>
 ```
 
-{{< highlight html >}}
+使用Hugo自带的 `highlight` 短语标注代码块：
+
+{{< highlight html "hl_lines=2 5-7, linenostart=44" >}}
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -208,4 +212,4 @@ X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
 <mark>比特作为信息论中的信息单位，也被称为 shannon </mark>，以信息论领域的创始人 Claude shannon 的名字命名。
 
 参考：
-- 来自 **Mainroad** 主题的 [Basic Elements](https://mainroad-demo.netlify.app/demo/basic-elements/) 内容
+- 来自 **Mainroad** 主题的 [Basic Elements](https://mainroad-demo.netlify.app/post/basic-elements/) 内容

exampleSite/content/post/04-emoji-support/index.en-us.md

@@ -0,0 +1,203 @@
+---
+title:  Support Emoji emojis
+Description: "Usage guide for emojis in Hugo and NexT. "
+keywords: "Hugo,NexT,Emoji"
+
+date: 2025-01-25T21:18:52+08:00
+lastmod: 2025-01-25T21:18:52+08:00
+
+categories:
+  - Example
+  - Grammar
+
+tags:
+ - Facial expressions
+ - Emoji
+
+toc: true
+
+url: "demo/emoji-support.html"
+---
+
+Emojis can be enabled in various ways in the Hugo project.
+
+[`emojify`]( https://gohugo.io/functions/emojify/)The method can be called directly in the template, or use [Inline Shortcodes](https://gohugo.io/templates/shortcode-templates#inline -shortcodes).
+
+To use emojis globally, you need to [configure](https://gohugo.io/getting-started/configuration/) them on your website set `enableEmoji` to `true`,Then you can directly enter the emoji code in the article.
+
+<!--more-->
+
+They start and end with a **colon** and contain the Emoji **code**:
+
+```markdown
+Go camping! {:}tent:  I'll be back soon
+
+How happy! {:}joy:
+```
+
+The output effect presented is as follows:
+
+> Let's go camping :tent:  I'll be back soon.<br/>
+> I'm so happy :joy:
+
+The following symbol list is a very useful reference for emoji code.
+
+## Expressions and Emotions
+
+### Smiling face expression
+
+|Icon | Code | Icon | Code|
+| :-: | - | :-: | - |
+| :grinning: | `grinning` | :smiley: | `smiley` |
+| :smile: | `smile` | :grin: | `grin` |
+| :laughing: | `laughing` <br /> `satisfied` | :sweat_smile: | `sweat_smile` |
+| :rofl: | `rofl` | :joy: | `joy` |
+| :slightly_smiling_face: | `slightly_smiling_face` | :upside_down_face: | `upside_down_face` |
+| :wink: | `wink` | :blush: | `blush` |
+| :innocent: | `innocent` |  |  |
+
+### Love expression
+
+|Icon | Code | Icon | Code|
+| :-: | - | :-: | - |
+| :heart_eyes: | `heart_eyes` | :kissing_heart: | `kissing_heart` |
+| :kissing: | `kissing` | :relaxed: | `relaxed` |
+| :kissing_closed_eyes: | `kissing_closed_eyes` | :kissing_smiling_eyes: | `kissing_smiling_eyes` |
+
+### Tongue sticking expression
+
+|Icon | Code | Icon | Code|
+| :-: | - | :-: | - |
+| :yum: | `yum` | :stuck_out_tongue: | `stuck_out_tongue` |
+| :stuck_out_tongue_winking_eye: | `stuck_out_tongue_winking_eye` | :stuck_out_tongue_closed_eyes: | `stuck_out_tongue_closed_eyes` |
+| :money_mouth_face: | `money_mouth_face` | :money_mouth_face: | |
+
+
+### National and regional flags
+
+|Icon | Code | Icon | Code|
+| :-: | - | :-: | - |
+| :andorra: | `andorra` | :united_arab_emirates: | `united_arab_emirates` |
+| :afghanistan: | `afghanistan` | :antigua_barbuda: | `antigua_barbuda` |
+| :anguilla: | `anguilla` | :albania: | `albania` |
+| :armenia: | `armenia` | :angola: | `angola` |
+| :antarctica: | `antarctica` | :argentina: | `argentina` |
+| :american_samoa: | `american_samoa` | :austria: | `austria` |
+| :australia: | `australia` | :aruba: | `aruba` |
+| :aland_islands: | `aland_islands` | :azerbaijan: | `azerbaijan` |
+| :bosnia_herzegovina: | `bosnia_herzegovina` | :barbados: | `barbados` |
+| :bangladesh: | `bangladesh` | :belgium: | `belgium` |
+| :burkina_faso: | `burkina_faso` | :bulgaria: | `bulgaria` |
+| :bahrain: | `bahrain` | :burundi: | `burundi` |
+| :benin: | `benin` | :st_barthelemy: | `st_barthelemy` |
+| :bermuda: | `bermuda` | :brunei: | `brunei` |
+| :bolivia: | `bolivia` | :caribbean_netherlands: | `caribbean_netherlands` |
+| :brazil: | `brazil` | :bahamas: | `bahamas` |
+| :bhutan: | `bhutan` | :botswana: | `botswana` |
+| :belarus: | `belarus` | :belize: | `belize` |
+| :canada: | `canada` | :cocos_islands: | `cocos_islands` |
+| :congo_kinshasa: | `congo_kinshasa` | :central_african_republic: | `central_african_republic` |
+| :congo_brazzaville: | `congo_brazzaville` | :switzerland: | `switzerland` |
+| :cote_divoire: | `cote_divoire` | :cook_islands: | `cook_islands` |
+| :chile: | `chile` | :cameroon: | `cameroon` |
+| :cn: | `cn` | :colombia: | `colombia` |
+| :costa_rica: | `costa_rica` | :cuba: | `cuba` |
+| :cape_verde: | `cape_verde` | :curacao: | `curacao` |
+| :christmas_island: | `christmas_island` | :cyprus: | `cyprus` |
+| :czech_republic: | `czech_republic` | :de: | `de` |
+| :djibouti: | `djibouti` | :denmark: | `denmark` |
+| :dominica: | `dominica` | :dominican_republic: | `dominican_republic` |
+| :algeria: | `algeria` | :ecuador: | `ecuador` |
+| :estonia: | `estonia` | :egypt: | `egypt` |
+| :western_sahara: | `western_sahara` | :eritrea: | `eritrea` |
+| :es: | `es` | :ethiopia: | `ethiopia` |
+| :eu: | `eu` <br /> `european_union` | :finland: | `finland` |
+| :fiji: | `fiji` | :falkland_islands: | `falkland_islands` |
+| :micronesia: | `micronesia` | :faroe_islands: | `faroe_islands` |
+| :fr: | `fr` | :gabon: | `gabon` |
+| :gb: | `gb` <br /> `uk` | :grenada: | `grenada` |
+| :georgia: | `georgia` | :french_guiana: | `french_guiana` |
+| :guernsey: | `guernsey` | :ghana: | `ghana` |
+| :gibraltar: | `gibraltar` | :greenland: | `greenland` |
+| :gambia: | `gambia` | :guinea: | `guinea` |
+| :guadeloupe: | `guadeloupe` | :equatorial_guinea: | `equatorial_guinea` |
+| :greece: | `greece` | :south_georgia_south_sandwich_islands: | `south_georgia_south_sandwich_islands` |
+| :guatemala: | `guatemala` | :guam: | `guam` |
+| :guinea_bissau: | `guinea_bissau` | :guyana: | `guyana` |
+| :hong_kong: | `hong_kong` | :honduras: | `honduras` |
+| :croatia: | `croatia` | :haiti: | `haiti` |
+| :hungary: | `hungary` | :canary_islands: | `canary_islands` |
+| :indonesia: | `indonesia` | :ireland: | `ireland` |
+| :israel: | `israel` | :isle_of_man: | `isle_of_man` |
+| :india: | `india` | :british_indian_ocean_territory: | `british_indian_ocean_territory` |
+| :iraq: | `iraq` | :iran: | `iran` |
+| :iceland: | `iceland` | :it: | `it` |
+| :jersey: | `jersey` | :jamaica: | `jamaica` |
+| :jordan: | `jordan` | :jp: | `jp` |
+| :kenya: | `kenya` | :kyrgyzstan: | `kyrgyzstan` |
+| :cambodia: | `cambodia` | :kiribati: | `kiribati` |
+| :comoros: | `comoros` | :st_kitts_nevis: | `st_kitts_nevis` |
+| :north_korea: | `north_korea` | :kr: | `kr` |
+| :kuwait: | `kuwait` | :cayman_islands: | `cayman_islands` |
+| :kazakhstan: | `kazakhstan` | :laos: | `laos` |
+| :lebanon: | `lebanon` | :st_lucia: | `st_lucia` |
+| :liechtenstein: | `liechtenstein` | :sri_lanka: | `sri_lanka` |
+| :liberia: | `liberia` | :lesotho: | `lesotho` |
+| :lithuania: | `lithuania` | :luxembourg: | `luxembourg` |
+| :latvia: | `latvia` | :libya: | `libya` |
+| :morocco: | `morocco` | :monaco: | `monaco` |
+| :moldova: | `moldova` | :montenegro: | `montenegro` |
+| :madagascar: | `madagascar` | :marshall_islands: | `marshall_islands` |
+| :macedonia: | `macedonia` | :mali: | `mali` |
+| :myanmar: | `myanmar` | :mongolia: | `mongolia` |
+| :macau: | `macau` | :northern_mariana_islands: | `northern_mariana_islands` |
+| :martinique: | `martinique` | :mauritania: | `mauritania` |
+| :montserrat: | `montserrat` | :malta: | `malta` |
+| :mauritius: | `mauritius` | :maldives: | `maldives` |
+| :malawi: | `malawi` | :mexico: | `mexico` |
+| :malaysia: | `malaysia` | :mozambique: | `mozambique` |
+| :namibia: | `namibia` | :new_caledonia: | `new_caledonia` |
+| :niger: | `niger` | :norfolk_island: | `norfolk_island` |
+| :nigeria: | `nigeria` | :nicaragua: | `nicaragua` |
+| :netherlands: | `netherlands` | :norway: | `norway` |
+| :nepal: | `nepal` | :nauru: | `nauru` |
+| :niue: | `niue` | :new_zealand: | `new_zealand` |
+| :oman: | `oman` | :panama: | `panama` |
+| :peru: | `peru` | :french_polynesia: | `french_polynesia` |
+| :papua_new_guinea: | `papua_new_guinea` | :philippines: | `philippines` |
+| :pakistan: | `pakistan` | :poland: | `poland` |
+| :st_pierre_miquelon: | `st_pierre_miquelon` | :pitcairn_islands: | `pitcairn_islands` |
+| :puerto_rico: | `puerto_rico` | :palestinian_territories: | `palestinian_territories` |
+| :portugal: | `portugal` | :palau: | `palau` |
+| :paraguay: | `paraguay` | :qatar: | `qatar` |
+| :reunion: | `reunion` | :romania: | `romania` |
+| :serbia: | `serbia` | :ru: | `ru` |
+| :rwanda: | `rwanda` | :saudi_arabia: | `saudi_arabia` |
+| :solomon_islands: | `solomon_islands` | :seychelles: | `seychelles` |
+| :sudan: | `sudan` | :sweden: | `sweden` |
+| :singapore: | `singapore` | :st_helena: | `st_helena` |
+| :slovenia: | `slovenia` | :slovakia: | `slovakia` |
+| :sierra_leone: | `sierra_leone` | :san_marino: | `san_marino` |
+| :senegal: | `senegal` | :somalia: | `somalia` |
+| :suriname: | `suriname` | :south_sudan: | `south_sudan` |
+| :sao_tome_principe: | `sao_tome_principe` | :el_salvador: | `el_salvador` |
+| :sint_maarten: | `sint_maarten` | :syria: | `syria` |
+| :swaziland: | `swaziland` | :turks_caicos_islands: | `turks_caicos_islands` |
+| :chad: | `chad` | :french_southern_territories: | `french_southern_territories` |
+| :togo: | `togo` | :thailand: | `thailand` |
+| :tajikistan: | `tajikistan` | :tokelau: | `tokelau` |
+| :timor_leste: | `timor_leste` | :turkmenistan: | `turkmenistan` |
+| :tunisia: | `tunisia` | :tonga: | `tonga` |
+| :tr: | `tr` | :trinidad_tobago: | `trinidad_tobago` |
+| :tuvalu: | `tuvalu` | :taiwan: | `taiwan` |
+| :tanzania: | `tanzania` | :ukraine: | `ukraine` |
+| :uganda: | `uganda` | :us: | `us` |
+| :uruguay: | `uruguay` | :uzbekistan: | `uzbekistan` |
+| :vatican_city: | `vatican_city` | :st_vincent_grenadines: | `st_vincent_grenadines` |
+| :venezuela: | `venezuela` | :british_virgin_islands: | `british_virgin_islands` |
+| :us_virgin_islands: | `us_virgin_islands` | :vietnam: | `vietnam` |
+| :vanuatu: | `vanuatu` | :wallis_futuna: | `wallis_futuna` |
+| :samoa: | `samoa` | :kosovo: | `kosovo` |
+| :yemen: | `yemen` | :mayotte: | `mayotte` |
+| :south_africa: | `south_africa` | :zambia: | `zambia` |
+| :zimbabwe: | `zimbabwe` |  |  |

exampleSite/content/post/04-emoji-support/index.md

@@ -12,7 +12,9 @@ categories:
 
 tags:
  - 表情
- - emoji
+ - Emoji
+
+toc: true
 
 url: "demo/emoji-support.html"
 ---
@@ -26,7 +28,7 @@ Emoji 可以通过多种方式在 Hugo 项目中启用。
 
 <!--more-->
 
-它们以**冒号**开头和结尾，并且包含 emoji 的 **代码**：
+它们以**冒号**开头和结尾，并且包含 emoji 的 **简短代码**：
 
 ```markdown
 去露营啦! {:}tent: 很快就回来.
@@ -36,9 +38,8 @@ Emoji 可以通过多种方式在 Hugo 项目中启用。
 
 呈现的输出效果如下:
 
-去露营啦! :tent: 很快就回来。
-
-真开心! :joy:
+> 去露营啦! :tent: 很快就回来。<br/>
+> 真开心! :joy:
 
 以下**符号清单**是 emoji 代码的非常有用的参考。
 
@@ -54,7 +55,7 @@ Emoji 可以通过多种方式在 Hugo 项目中启用。
 | :rofl: | `rofl` | :joy: | `joy` |
 | :slightly_smiling_face: | `slightly_smiling_face` | :upside_down_face: | `upside_down_face` |
 | :wink: | `wink` | :blush: | `blush` |
-| :innocent: | `innocent` | | |
+| :innocent: | `innocent` |  |  |
 
 ### 爱意表情
 
@@ -70,7 +71,7 @@ Emoji 可以通过多种方式在 Hugo 项目中启用。
 | :-: | - | :-: | - |
 | :yum: | `yum` | :stuck_out_tongue: | `stuck_out_tongue` |
 | :stuck_out_tongue_winking_eye: | `stuck_out_tongue_winking_eye` | :stuck_out_tongue_closed_eyes: | `stuck_out_tongue_closed_eyes` |
-| :money_mouth_face: | `money_mouth_face` | | |
+| :money_mouth_face: | `money_mouth_face` | :money_mouth_face: | |
 
 
 ### 国家和地区旗帜
@@ -200,4 +201,4 @@ Emoji 可以通过多种方式在 Hugo 项目中启用。
 | :samoa: | `samoa` | :kosovo: | `kosovo` |
 | :yemen: | `yemen` | :mayotte: | `mayotte` |
 | :south_africa: | `south_africa` | :zambia: | `zambia` |
-| :zimbabwe: | `zimbabwe` | | |
+| :zimbabwe: | `zimbabwe` |  |  |

exampleSite/content/post/06-image-viewer/index.en-us.md

@@ -0,0 +1,40 @@
+---
+title:  "Image browsing Tool"
+description:  "By default, images within the article will be browsed. Clicking on an image will display a larger image, while clicking on a blank space will close it."
+Keywords: "image, image, browser, photo album"
+
+date: 2025-01-25T21:28:12+08:00
+lastmod: 2025-01-25T21:28:12+08:00
+
+categories:
+  - Example
+
+tags:
+  - Image
+  - Album
+  - Browse
+
+url: "demo/image-viewer.html"
+toc: false
+expired: true
+---
+
+This theme comes with an image browser function that supports browsing images that appear in the article area. Clicking on an image can view a larger image, while clicking on a blank space can close it. No need to configure any parameters, just add image information at the corresponding position in the article.
+
+<!--more-->
+
+The image browser referenced [fengyuanchen](https://fengyuanchen.github.io/) Developed [viewerjs](https://fengyuanchen.github.io/viewerjs/) Supports displaying image name, size, rotation, scaling, playback, and other functions. You can click on the following example image to view the experience:
+
+## Animals
+
+![cute-scottish-fold-cat](/demo/image-viewer/photos/preview_cute-scottish-fold-cat.jpg)
+![scottish-fold-kitten](/demo/image-viewer/photos/preview_scottish-fold-kitten.jpg)
+![hourses](/demo/image-viewer/photos/preview_horses.jpg)
+![owl-family-background](/demo/image-viewer/photos/preview_owl-family-background.jpg)
+
+## Scenery
+
+![luxury-resort-in-maldives](/demo/image-viewer/photos/preview_luxury-resort-in-maldives.jpg)
+![sea-shell](/demo/image-viewer/photos/preview_sea-shell.jpg)
+![the-arch-sunset](/demo/image-viewer/photos/preview_the-arch-sunset.jpg)
+![norway-autumn-landscape](/demo/image-viewer/photos/preview_norway-autumn-landscape.jpg)

exampleSite/content/post/06-image-viewer/index.md

@@ -14,7 +14,7 @@ tags:
   - 相册
   - 浏览
 
-url: "demo/image-viewer.html"
+url: "/demo/image-viewer.html"
 toc: false
 expired: true
 ---
@@ -27,15 +27,14 @@ expired: true
 
 ## 动物
 
-![cute-scottish-fold-cat](/demo/image-viewer/preview_cute-scottish-fold-cat.jpg)
-![scottish-fold-kitten](/demo/image-viewer/preview_scottish-fold-kitten.jpg)
-![hourses](/demo/image-viewer/preview_horses.jpg)
-![owl-family-background](/demo/image-viewer/preview_owl-family-background.jpg)
+![cute-scottish-fold-cat](/demo/image-viewer/photos/preview_cute-scottish-fold-cat.jpg)
+![scottish-fold-kitten](/demo/image-viewer/photos/photos/preview_scottish-fold-kitten.jpg)
+![hourses](/demo/image-viewer/photos/preview_horses.jpg)
+![owl-family-background](/demo/image-viewer/photos/preview_owl-family-background.jpg)
 
 ## 风景
 
-![luxury-resort-in-maldives](/demo/image-viewer/preview_luxury-resort-in-maldives.jpg)
-![sea-shell](/demo/image-viewer/preview_sea-shell.jpg)
-![the-arch-sunset](/demo/image-viewer/preview_the-arch-sunset.jpg)
-![norway-autumn-landscape](/demo/image-viewer/preview_norway-autumn-landscape.jpg)
-
+![luxury-resort-in-maldives](/demo/image-viewer/photos/preview_luxury-resort-in-maldives.jpg)
+![sea-shell](/demo/image-viewer/photos/preview_sea-shell.jpg)
+![the-arch-sunset](/demo/image-viewer/photos/preview_the-arch-sunset.jpg)
+![norway-autumn-landscape](/demo/image-viewer/photos/preview_norway-autumn-landscape.jpg)

exampleSite/content/post/07-custom-files/index.en-us.md

@@ -0,0 +1,78 @@
+---
+title:  "Support user-defined design"
+description:  "Users can customize file configurations to achieve personalized adjustments to the style and layout of the site"
+keywords: "custom,files,layout"
+
+date: 2025-01-25T21:12:32+08:00
+lastmod: 2025-01-25T20:59:12+08:00
+
+categories:
+  - Example
+
+tags:
+  - Customize
+  - Personalization
+  - Layout
+
+url: "demo/custom-files.html"
+toc: true
+---
+
+For users familiar with front-end development, personalized adjustments can be made to the style and layout of the site through custom file configuration. In terms of layout, it mainly supports the site overview section in the left sidebar, as well as the two positions at the bottom of the site, but the style reset can be anywhere on the entire site.
+
+## Open configuration parameters
+
+Firstly, it is necessary to clarify that the following parameters are configured in the `params` area of the configuration file:
+
+```yaml
+customFilePath:
+sidebar: custom_sidebar.html
+footer: custom_footer.html
+style: /css/custom_style.css
+```
+
+> [!WARNING]
+> **Attention:** The file names of `sidebar` and `footer` cannot be the same as their parameter names, otherwise it will affect the default layout design of the system. Remember!!!: smile:
+
+
+Then create two directories, 'layouts/partitions', in the root directory of the site to store custom layout design files. Additionally, create two directories,' static/css', in the root directory of the site to store custom CSS style files. After everything is ready, you can refer to the following steps to complete your design idea.
+
+## Sidebar design
+
+Create a new file with the suffix 'html' in the 'partitions' directory earlier, where you can write the design or content you want to express, such as introducing some third-party component content. The example is as follows:
+
+```html
+<div class="mydefined animated" itemprop="custom">
+<span>Support custom CSS and Sidebar layout now 💄💄💄</ span>
+</div>
+```
+
+Configure the path of the file to the corresponding parameters, please refer to the effect at the bottom of the left sidebar for the effect.
+
+## Footer design
+
+Create a new file with the suffix 'html' in the 'partitions' directory earlier, where you can write the design or content you want to express, such as introducing some third-party component content. The example is as follows:
+
+```html
+<div class="custom-footer">
+Website source code <a href=" https://github.com/hugo-next/hugo-theme-next/tree/develop/exampleSite/layouts/partials/custom-footer.html " target="_blank">here</a>
+</div>
+```
+
+Configure the path of the file to the corresponding parameters, please refer to the effect at the bottom of the site for the effect.
+
+## Custom Style
+
+Create a new file with the suffix 'css' in the' css' directory earlier, and then redefine the style of the site or add some custom style designs to reference when writing articles. The example is as follows:
+
+```html
+.custom-head5 {
+font-size: 1.2em;
+color: #ed6c24;
+font-weight: bold;
+}
+```
+
+Configure the path of the file to the corresponding parameters, and the effect reference is as follows:
+
+<span class="custom-head5"> I am customizing the title style effect. </span>

exampleSite/content/post/08-no-header-title/index.en-us.md

@@ -0,0 +1,45 @@
+---
+title:  "Articles without H1-6 header and comments"
+description:  "Used to test whether the directory navigation of an article will be directly closed and the comment function will be disabled without the H1-6 title header"
+keywords: "toc,header"
+
+date: 2025-01-29T19:45:16+08:00
+lastmod: 2025-01-29T19:45:16+08:00
+
+categories:
+  - Example
+tags:
+  - toc
+  - Title
+
+comment:
+enable: false
+url: "demo/no-header-title.html"
+expired: true
+---
+
+Liu Cixin's acceptance speech for the 2018 Clark Prize (excerpt from some content).
+
+> [!INFO]
+> Used to test whether the directory navigation of an article will be directly closed and the comment function will be disabled without the H1-6 title header.
+
+<!--more-->
+
+Good evening, gentlemen and ladies,
+
+I am honored to receive the Clarke Award for Imagination in Service to Society.
+
+This award is a reward for imagination, which is a human ability that seems to belong only to God, and its significance far exceeds our imagination. Historians have said that the reason why humans were able to establish civilization beyond other species on Earth is mainly because they were able to create things in their own brains that do not exist in reality. In the future, when artificial intelligence surpasses human intelligence, imagination may be our only advantage over them.
+
+Science fiction is a literature based on imagination, and the first one that left a deep impression on me was Arthur Clarke's works. Except for Jules Verne and George Wells, Clarke's works are the earliest Western modern science fiction novels to enter China. In the early 1980s, China published his works "2001: A Space Odyssey" and "Rendezvous With Rama". At that time, the Cultural Revolution had just ended, and the old life and beliefs had collapsed, while the new had not yet been established. Like other young people, I felt lost in my heart. These two books activated my imagination for the first time, and my thoughts suddenly became much broader, with the feeling of a small stream flowing into the sea. On the night I finished reading '2001: A Space Odyssey', I walked out of my house and looked up at the starry sky. At that time, the sky in China was not too polluted, and I could see the Milky Way. In my eyes, the starry sky was completely different from the past. For the first time, I had a sense of awe towards the vastness and mystery of the universe, which was a religious feeling. And later I read 'Rendezvous With Rama', which also amazed me at how imagination can be used to construct a vivid imaginary world. It was these feelings brought to me by Clarke that later made me a science fiction writer.
+
+Now, more than thirty years have passed, and I gradually realize that our generation born in China in the 1960s may be the luckiest people in human history, because there has never been a generation before that has witnessed such a huge change in the world around us. The world we live in now is completely different from the world we grew up in, and this change is accelerating. China is a country full of a sense of the future. China's future may be full of challenges and crises, but it has never been as attractive as it is now. This provides fertile soil for science fiction novels, which have received unprecedented attention in China. As a science fiction writer born in China in the 1960s, it is a stroke of luck.
+
+I look forward to one day, like those science fiction novels that once described the information age, science fiction novels that describe space travel will become mundane. At that time, Mars and the asteroid belt were boring places where countless people made a living; Jupiter and its numerous satellites have become tourist destinations, and the only obstacle preventing people from going there is the expensive price.
+
+But even at this time, the universe remains a vast and unimaginable existence, with the nearest stars still out of reach. The vast starry sky can always carry our infinite imagination.
+
+Thank you all.
+
+
+> [Click to read the full text](https://weread.qq.com/web/reader/ce032b305a9bc1ce0b0dd2akecc32f3013eccbc87e4b62e)

exampleSite/content/post/08-no-header-title/index.md

@@ -1,7 +1,6 @@
 ---
 title: "没有H1-6标题头和评论的文章"
 description: "用于测试在没有H1-6标题头时，文章的目录导航是否会直接关闭，并关闭评论功能。"
-summary: "用于测试在没有H1-6标题头时，文章的目录导航是否会直接关闭，并关闭评论功能，同时也是展现下有关于文章的摘要功能。"
 keywords: "toc,header"
 
 date: 2022-10-06T09:02:26+08:00
@@ -21,6 +20,7 @@ expired: true
 
 刘慈欣2018克拉克奖获奖感言（部分内容节选）。
 
+> [!INFO]
 > 用于测试在没有H1-6标题头时，文章的目录导航是否会直接关闭，并关闭评论功能。
 
 <!--more-->

exampleSite/content/post/09-syntax-highlighting/index.en-us.md

@@ -0,0 +1,188 @@
+---
+Title: "Hugo's Built in Chroma Grammar Highlighting"
+description:  Describe the various syntax and highlighting effects supported by Chroma
+Keywords: "Chroma, syntax, highlighting"
+
+date: 2025-01-29T20:09:52+08:00
+lastmod: 2025-01-29T20:09:52+08:00
+
+categories:
+  - Example
+  - Grammar
+tags:
+  - Grammar
+  - Highlight
+  - Chroma
+
+url: demo/syntax-highlighting.html
+---
+
+Hugo provides very fast syntax highlighting through Chroma, and now uses Chroma as code block highlighting support in Hugo. It is built into the Go language, and the speed is really, really fast. Most importantly, it is also compatible with the Pygments method we used before.
+
+The following verifies the rendering effect of code blocks in different languages and their correct highlighting through Hugo's built-in short code 'highlight' and 'Markodown' code blocks. For more information on optimizing syntax highlighting, please refer to the [Hugo Documentation](https://gohugo.io/getting-started/configuration-markup#highlight).
+
+<!--more-->
+
+## Programming language
+
+### GO
+
+```makrdown
+{{</* highlight go "linenos=table,hl_lines=8 15-17,linenostart=199" */>}}
+
+func GetTitleFunc(style string) func(s string) string {
+switch strings.ToLower(style) {
+case "go":
+return strings.Title
+case "chicago":
+return transform.NewTitleConverter(transform.ChicagoStyle)
+default:
+return transform.NewTitleConverter(transform.APStyle)
+}
+}
+
+{{</* / highlight */>}}
+```
+
+{{< highlight go "linenos=table,hl_lines=8 15-17,linenostart=199" >}}
+
+func GetTitleFunc(style string) func(s string) string {
+switch strings.ToLower(style) {
+case "go":
+return strings.Title
+case "chicago":
+return transform.NewTitleConverter(transform.ChicagoStyle)
+default:
+return transform.NewTitleConverter(transform.APStyle)
+}
+}
+
+{{< / highlight >}}
+
+### Java
+
+```java
+import javax.swing.JFrame;  // Importing class JFrame
+import javax.swing.JLabel;  // Importing class JLabel
+public class HelloWorld {
+public static void main(String[] args) {
+JFrame frame = new JFrame();           // Creating frame
+frame.setTitle("Hi!");                 // Setting title frame
+frame.add(new JLabel("Hello, world!"));// Adding text to frame
+frame.pack();                          // Setting size to smallest
+frame.setLocationRelativeTo(null);     // Centering frame
+frame.setVisible(true);                // Showing frame
+}
+}
+```
+
+### Python
+
+``` python
+print "Hello, world!"
+```
+
+### Git Comparison
+
+```diff {hl_lines=[4,"6-7"], linenos=true}
+*** /path/to/original ''timestamp''
+--- /path/to/new  ''timestamp''
+***************
+*** 1 ****
+! This is a line.
+--- 1 ---
+! This is a replacement line.
+It is important to spell
+-removed line
++new line
+```
+
+```diff {hl_lines=[4,"6-7"], linenos=false}
+*** /path/to/original ''timestamp''
+--- /path/to/new  ''timestamp''
+***************
+*** 1 ****
+! This is a line.
+--- 1 ---
+! This is a replacement line.
+It is important to spell
+-removed line
++new line
+```
+
+## File
+
+### Make file
+
+``` makefile {linenos=false}
+CC=gcc
+CFLAGS=-I.
+
+hellomake: hellomake.o hellofunc.o
+$(CC) -o hellomake hellomake.o hellofunc.o -I.
+```
+
+### Markdown document
+
+``` markdown
+**bold**
+*italics*
+[link](www.example.com)
+```
+
+## Data content
+
+### JSON data
+
+``` json
+{"employees":[
+{"firstName":"John", "lastName":"Doe"},
+]}
+```
+
+### XML Content
+
+``` xml
+<employees>
+<employee>
+<firstName>John</firstName> <lastName>Doe</lastName>
+</employee>
+</employees>
+```
+
+### SQL Query
+
+{{< highlight sql >}}
+
+SELECT column_name,column_name
+FROM
+Table
+WHERE column_name = "condition"
+{{< / highlight >}}
+
+### Auto guess code highlighted
+
+```
+.highlight {
+
+  //Other codes
+  ......
+
+  > .chroma {
+    position: relative;
+      
+    
+    //Fix code block overflow issue
+    pre {
+      overflow-wrap: break-word;
+      white-space: pre-wrap;
+      line-break: anywhere;
+      word-break: break-all; 
+      overflow-x: auto;
+    }
+  }
+}
+```
+
+
+In addition to the code highlighting listed above, it also supports highlighting in mainstream code languages such as C, C++, HTML, CSS, Shell scripts, etc., and can be tested for effectiveness on its own.

exampleSite/content/post/09-syntax-highlighting/index.md

@@ -165,21 +165,20 @@ WHERE column_name = "condition"
 ```
 .highlight {
 
-  // 其他代码
+  //Other codes
   ......
 
   > .chroma {
     position: relative;
+      
     
-   
-      // 修复代码块溢出问题
-      pre {
-        overflow-wrap: break-word;
-        white-space: pre-wrap;
-        line-break: anywhere;
-        word-break: break-all; 
-        overflow-x: auto;
-      }
+    //Fix code block overflow issue
+    pre {
+      overflow-wrap: break-word;
+      white-space: pre-wrap;
+      line-break: anywhere;
+      word-break: break-all; 
+      overflow-x: auto;
     }
   }
 }

exampleSite/content/post/10-math-formula/index.en-us.md

@@ -0,0 +1,259 @@
+---
+title:  Mathematical Formula Rendering
+description:  The theme supports mathematical formula rendering schemes for two different plugins, mathjs and katex
+keywords: "math,formula"
+
+date: 2025-01-29T20:50:02+08:00
+lastmod: 2025-01-29T20:50:02+08:00
+
+categories:
+  - ThirdParty
+  - Mathematical formulas
+tags:
+  - Mathematical formulas
+  - mathjax
+  - katex
+
+
+url: "demo/math-formula.html"
+math: mathjax
+---
+
+This theme supports two different schemes, `mathjax` and `katex`, and supports rendering mathematical formulas. You can choose according to your own needs.
+
+<!--more-->
+
+In the following example, [MathJax](https://www.mathjax.org/) will be used Plan to showcase rendering effects.
+
+{{< note info >}}
+
+- Create a new article using the `hugo new` command;
+- You can globally enable data formula rendering. Please configure the parameter `math: katex` or `math: mathjax` in the article front parameters;
+- Or configure the parameter to the header of the page where mathematical formulas need to be displayed.
+> reducing unnecessary resource loading consumption
+
+{{< /note >}}
+
+**Attention:** Use [Supported TeX Features](https://docs.mathjax.org/en/latest/input/tex/index.html) Online reference materials.
+
+## Example
+
+### Insider formula
+
+Quadratic formula:$ Ax ^ 2+bx+c=0 $(supports using ` \ $...)\$` Format of inline formulas
+
+Quadratic formula (line break display formula) $$ax ^ 2+bx+c=0$$
+
+The more complex formula is as follows:$ \lim^{x \to \infty}_{y \to 0}{\frac{x}{y}}$ 
+
+Other inline formulas display ( _score_ _expression_ ): \(\frac{1}{2}\) (Supports inline formula effects in `\(...\)` format)
+
+
+### Repeated scores
+
+$$
+\frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} \equiv 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}} {1+\frac{e^{-8\pi}} {1+\cdots} } } }
+$$
+
+
+### Sum mark
+
+$$
+\left(\sum_{k=1}^n a_k b_k \right)^2 \leq \left(\sum_{k=1}^n a_k^2 \right) \left(\sum_{k=1}^n b_k^2 \right)
+$$
+
+
+### Sum of geometric series
+
+I have divided the next two examples into several lines so that they perform better on mobile phones. That's why they contain '\ display style'. Alternatively, truncation can be performed using syntax similar to '\ showlines {x=a+b \ \ y=b+c}', as detailed in: [mathjax-issues2312](https://github.com/mathjax/MathJax/issues/2312)
+
+$$
+\displaystyle\sum_{i=1}^{k+1}i
+$$
+
+$$
+\displaystyle= \left(\sum_{i=1}^ {k}i \right) +(k+1)
+$$
+
+$$
+\displaystyle= \frac{k(k+1)}{2}+k+1
+$$
+
+$$
+\displaystyle= \frac{k(k+1)+2(k+1)}{2}
+$$
+
+$$
+\displaystyle= \frac{(k+1)(k+2)}{2}
+$$
+
+$$
+\displaystyle= \frac{(k+1)((k+1)+1)}{2}
+$$
+
+### Riding symbols
+
+$$
+\displaystyle 1 + \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots = 
+$$
+
+$$
+\displaystyle \prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})}, 
+\displaystyle\text{ for }\lvert q\rvert < 1.
+$$
+
+
+### Random number formula
+
+These are some linear mathematics:$ k_{n+1} = n^2 + k_n^2 - k_{n-1} $ ，  Then there are more texts.
+
+
+### Greek alphabet
+
+$$
+\displaylines{\Gamma\ \Delta\ \Theta\ \Lambda\ \Xi\ \Pi\ \Sigma\ \Upsilon\ \Phi\ \Psi\ \Omega
+\alpha\ \beta\ \gamma\ \delta\ \epsilon\ \zeta\ \\\\ \eta\ \theta\ \iota\ \kappa\ \lambda\ \mu\ \nu\ \xi \ \omicron\ \pi\ \rho\ \sigma\ \tau\ \upsilon\ \phi\ \chi\ \psi\ \omega\ \varepsilon\ \vartheta\ \varpi\ \varrho\ \varsigma\ \varphi}
+$$
+
+### Arrow
+
+$$
+\gets\ \to\ \leftarrow\ \rightarrow\ \uparrow\ \Uparrow\ \downarrow\ \Downarrow\ \updownarrow\ \Updownarrow
+$$
+
+$$
+\displaylines{\Leftarrow\ \Rightarrow\ \leftrightarrow\ \Leftrightarrow\ \mapsto\ \hookleftarrow
+\leftharpoonup\ \leftharpoondown\ \\\\\ \rightleftharpoons\ \longleftarrow\ \Longleftarrow\ \longrightarrow}
+$$
+
+$$
+\Longrightarrow\ \longleftrightarrow\ \Longleftrightarrow\ \longmapsto\ \hookrightarrow\ \rightharpoonup
+$$
+
+$$
+\rightharpoondown\ \leadsto\ \nearrow\ \searrow\ \swarrow\ \nwarrow
+$$
+
+
+## Symbols
+
+$$
+\surd\ \barwedge\ \veebar\ \odot\ \oplus\ \otimes\ \oslash\ \circledcirc\ \boxdot\ \bigtriangleup
+$$
+
+$$
+\bigtriangledown\ \dagger\ \diamond\ \star\ \triangleleft\ \triangleright\ \angle\ \infty\ \prime\ \triangle
+$$
+
+
+### Calculus
+
+$$
+\int u \frac{dv}{dx}\,dx=uv-\int \frac{du} {dx}v \, dx
+$$
+
+$$
+f(x) = \int_{-\infty}^\infty \hat f(\xi)\,e^{2 \pi i \xi x}
+$$
+
+$$
+\oint \vec{F} \cdot d\vec{s}=0
+$$
+
+
+### Lorenz equation
+
+$$
+\begin{aligned} \dot{x} & = \sigma(y-x) \\\\ \dot{y} & = \rho x - y - xz \\\\ \dot{z} & = -\beta z + xy \end{aligned}
+$$
+
+
+### Cross product
+
+This is feasible in KaTeX, but the separation of fractions is not very good in this environment.
+
+$$
+\mathbf {V}_1  \times \mathbf {V}_2  = \begin{vmatrix} \mathbf{i} & \mathbf{j} & \mathbf{k} \\\\ \frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\\\ \frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \end{vmatrix}
+$$
+
+Here is a solution: use additional classes of the "mfrac" class (no difference in the case of MathJax) to make the score smaller:
+
+$$
+\mathbf {V}_1  \times \mathbf {V}_2  = \begin{vmatrix} \mathbf{i} & \mathbf{j} & \mathbf{k} \\\\ \frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\\\ \frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \end{vmatrix}
+$$
+
+
+## Emphasize
+
+$$
+\hat{x}\ \vec{x}\ \ddot{x}
+$$
+
+
+### Elastic parentheses
+
+$$
+\left(\frac{x^2}{y^3}\right)
+$$
+
+
+### Scope of evaluation
+
+$$
+\left. \frac{x^3}{3}\right|_0^1
+$$
+
+
+### Diagnostic criteria
+
+$$
+f(n) = \begin{cases} \frac{n}{2}, & \text{if } n\text{ is even} \\\\ 3n+1, & \text{if } n\text{ is odd} \end{cases}
+$$
+
+
+### Maxwell's equations system
+
+$$
+\begin{aligned} \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\\\ \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\\\ \nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\\\ \nabla \cdot \vec{\mathbf{B}} & = 0 \end{aligned}
+$$
+
+
+## Statistics
+
+Fixed phrases:$$ \frac{n!}{k!(n-k)!} = {^n}C_k{n \choose k}$$
+
+### Score in Score
+
+$$
+\frac{\frac{1}{x}+\frac{1}{y}}{y-z}
+$$
+
+
+### Nth root
+
+$$
+\sqrt[n]{1+x+x^2+x^3+\ldots}
+$$
+
+
+### Matrix
+
+$$
+\begin{pmatrix} a_{11} & a_{12} & a_{13}\\\\ a_{21} & a_{22} & a_{23}\\\\ a_{31} & a_{32} & a_{33} \end{pmatrix}
+\begin{bmatrix} 0 & \cdots & 0 \\\\ \vdots & \ddots & \vdots \\\\ 0 & \cdots & 0 \end{bmatrix}
+$$
+
+
+## Punctuation marks
+
+$$
+f(x) = \sqrt{1+x} \quad (x \ge -1)
+f(x) \sim x^2 \quad (x\to\infty)
+$$
+
+Now use punctuation marks:
+
+$$
+f(x) = \sqrt{1+x}, \quad x \ge -1
+f(x) \sim x^2, \quad x\to\infty
+$$

exampleSite/content/post/10-math-formula/index.md

@@ -49,18 +49,21 @@ math: mathjax
 
 
 ### 重复的分数
+
 $$
 \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} \equiv 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}} {1+\frac{e^{-8\pi}} {1+\cdots} } } }
 $$
 
 
 ### 总和记号
+
 $$
 \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right)
 $$
 
 
 ### 几何级数之和
+
 我把接下来的两个例子分成了几行，这样它在手机上表现得更好。这就是为什么它们包含 `\displaystyle`。或者可使用类似 `\displaylines{x = a + b \\\ y = b + c}` 语法进行截断，具体信息可见：[mathjax-issues2312](https://github.com/mathjax/MathJax/issues/2312)
 
 $$
@@ -88,6 +91,7 @@ $$
 $$
 
 ### 乘记号
+
 $$
 \displaystyle 1 + \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots = 
 $$
@@ -99,17 +103,19 @@ $$
 
 
 ### 随文数式
+
 这是一些线性数学: $ k_{n+1} = n^2 + k_n^2 - k_{n-1} $ ， 然后是更多的文本。
 
 
 ### 希腊字母
+
 $$
 \displaylines{\Gamma\ \Delta\ \Theta\ \Lambda\ \Xi\ \Pi\ \Sigma\ \Upsilon\ \Phi\ \Psi\ \Omega
 \alpha\ \beta\ \gamma\ \delta\ \epsilon\ \zeta\ \\\\ \eta\ \theta\ \iota\ \kappa\ \lambda\ \mu\ \nu\ \xi \ \omicron\ \pi\ \rho\ \sigma\ \tau\ \upsilon\ \phi\ \chi\ \psi\ \omega\ \varepsilon\ \vartheta\ \varpi\ \varrho\ \varsigma\ \varphi}
 $$
 
-
 ### 箭头
+
 $$
 \gets\ \to\ \leftarrow\ \rightarrow\ \uparrow\ \Uparrow\ \downarrow\ \Downarrow\ \updownarrow\ \Updownarrow
 $$
@@ -129,6 +135,7 @@ $$
 
 
 ## 符号
+
 $$
 \surd\ \barwedge\ \veebar\ \odot\ \oplus\ \otimes\ \oslash\ \circledcirc\ \boxdot\ \bigtriangleup
 $$
@@ -139,6 +146,7 @@ $$
 
 
 ### 微积分学
+
 $$
 \int u \frac{dv}{dx}\,dx=uv-\int \frac{du}{dx}v\,dx
 $$
@@ -153,12 +161,14 @@ $$
 
 
 ### 洛伦茨方程
+
 $$
 \begin{aligned} \dot{x} & = \sigma(y-x) \\\\ \dot{y} & = \rho x - y - xz \\\\ \dot{z} & = -\beta z + xy \end{aligned}
 $$
 
 
 ### 交叉乘积
+
 这在KaTeX中是可行的，但在这种环境中馏分的分离不是很好。
 
 $$
@@ -173,30 +183,35 @@ $$
 
 
 ## 强调
+
 $$
 \hat{x}\ \vec{x}\ \ddot{x}
 $$
 
 
 ### 有弹性的括号
+
 $$
 \left(\frac{x^2}{y^3}\right)
 $$
 
 
 ### 评估范围
+
 $$
 \left.\frac{x^3}{3}\right|_0^1
 $$
 
 
 ### 诊断标准
+
 $$
 f(n) = \begin{cases} \frac{n}{2}, & \text{if } n\text{ is even} \\\\ 3n+1, & \text{if } n\text{ is odd} \end{cases}
 $$
 
 
 ### 麦克斯韦方程组
+
 $$
 \begin{aligned} \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\\\ \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\\\ \nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\\\ \nabla \cdot \vec{\mathbf{B}} & = 0 \end{aligned}
 $$
@@ -207,18 +222,21 @@ $$
 固定词组：$$\frac{n!}{k!(n-k)!} = {^n}C_k{n \choose k}$$
 
 ### 分数在分数
+
 $$
 \frac{\frac{1}{x}+\frac{1}{y}}{y-z}
 $$
 
 
 ### ｎ次方根
+
 $$
 \sqrt[n]{1+x+x^2+x^3+\ldots}
 $$
 
 
 ### 矩阵
+
 $$
 \begin{pmatrix} a_{11} & a_{12} & a_{13}\\\\ a_{21} & a_{22} & a_{23}\\\\ a_{31} & a_{32} & a_{33} \end{pmatrix}
 \begin{bmatrix} 0 & \cdots & 0 \\\\ \vdots & \ddots & \vdots \\\\ 0 & \cdots & 0 \end{bmatrix}
@@ -226,6 +244,7 @@ $$
 
 
 ## 标点符号
+
 $$
 f(x) = \sqrt{1+x} \quad (x \ge -1)
 f(x) \sim x^2 \quad (x\to\infty)

exampleSite/content/post/11-mermaid-charts/index.en-us.md

@@ -0,0 +1,193 @@
+---
+Title: "Mermaid Support Flowchart"
+keywords: "mermaid,flow,chart"
+
+date: 2025-01-29T21:01:13+08:00
+lastmod: 2025-01-29T21:01:13+08:00
+
+categories:
+  - ThirdParty
+  - Diagram sequence
+tags:
+  - Process diagram
+  - Timing diagram
+
+url: "demo/mermaid-charts.html"
+toc: true
+---
+
+
+This theme now supports the use of `Mermaid` to draw flowcharts, sequence diagrams, Gantt charts, state diagrams, relationship diagrams, and more in plain text format. With the gradual development of `Mermaid`, various types of diagrams will be introduced in the future. For more types and usage methods, please follow its official website:[https://mermaid-js.github.io/](https://mermaid-js.github.io/).
+
+<!--more-->
+
+## Instructions for use
+
+{{< note info >}}
+
+- Create a new article using the `hugo new` command
+- Write various types of diagrams using short code, with 2 built-in parameters: Align and bc (background color) can refer to the following usage examples
+
+{{< /note >}}
+
+## Process diagram
+
+```shell
+{{</* mermaid align="left" */>}}
+graph TD;
+A-->B;
+A-->C;
+B-->D;
+C-->D;
+{{</* /mermaid */>}}
+```
+
+{{< mermaid align="left" >}}
+graph TD;
+A-->B;
+A-->C;
+B-->D;
+C-->D;
+{{< /mermaid >}}
+
+## Timing diagram
+
+```shell
+{{</* mermaid bc="#eee"  */>}}
+sequenceDiagram
+participant Alice
+participant Bob
+Alice->>John: Hello John, how are you?
+loop Healthcheck
+John->>John: Fight against hypochondria
+end
+Note right of John: Rational thoughts <br/>prevail!
+John-->>Alice: Great!
+John->>Bob: How about you?
+Bob-->>John: Jolly good!
+{{</* /mermaid */>}}
+```
+
+{{< mermaid bc="#eee" >}}
+sequenceDiagram
+participant Alice
+participant Bob
+Alice->>John: Hello John, how are you?
+loop Healthcheck
+John->>John: Fight against hypochondria
+end
+Note right of John: Rational thoughts <br/>prevail!
+John-->>Alice: Great!
+John->>Bob: How about you?
+Bob-->>John: Jolly good!
+{{< /mermaid >}}
+
+## Class diagram
+
+```shell
+{{</* mermaid */>}}
+classDiagram
+Class01 <|-- AveryLongClass : Cool
+Class03 *-- Class04
+Class05 o-- Class06
+Class07 .. Class08
+Class09 --> C2 : Where am i?
+Class09 --* C3
+Class09 --|> Class07
+Class07 : equals()
+Class07 : Object[] elementData
+Class01 : size()
+Class01 : int chimp
+Class01 : int gorilla
+Class08 <--> C2: Cool label
+{{</* /mermaid */>}}
+```
+{{< mermaid >}}
+classDiagram
+Class01 <|-- AveryLongClass : Cool
+Class03 *-- Class04
+Class05 o-- Class06
+Class07 .. Class08
+Class09 --> C2 : Where am i?
+Class09 --* C3
+Class09 --|> Class07
+Class07 : equals()
+Class07 : Object[] elementData
+Class01 : size()
+Class01 : int chimp
+Class01 : int gorilla
+Class08 <--> C2: Cool label
+{{< /mermaid >}}
+
+## Gantt Chart
+
+```shell
+{{</* mermaid */>}}
+gantt
+dateFormat  YYYY-MM-DD
+title Adding GANTT diagram to mermaid
+excludes weekdays 2014-01-10
+
+section A section
+Completed task            :done,    des1, 2014-01-06,2014-01-08
+Active task               :active,  des2, 2014-01-09, 3d
+Future task               :         des3, after des2, 5d
+Future task2               :         des4, after des3, 5d
+{{</* /mermaid */>}}
+```
+{{< mermaid >}}
+gantt
+dateFormat  YYYY-MM-DD
+title Adding GANTT diagram to mermaid
+excludes weekdays 2014-01-10
+
+section A section
+Completed task            :done,    des1, 2014-01-06,2014-01-08
+Active task               :active,  des2, 2014-01-09, 3d
+Future task               :         des3, after des2, 5d
+Future task2               :         des4, after des3, 5d
+{{< /mermaid >}}
+
+## Entity Relationship Diagram
+
+```shell
+{{</* mermaid */>}}
+erDiagram
+CUSTOMER ||--o{ ORDER : places
+ORDER ||--|{ LINE-ITEM : contains
+CUSTOMER }|..|{ DELIVERY-ADDRESS : uses
+{{</* /mermaid */>}}
+```
+{{< mermaid >}}
+erDiagram
+CUSTOMER ||--o{ ORDER : places
+ORDER ||--|{ LINE-ITEM : contains
+CUSTOMER }|..|{ DELIVERY-ADDRESS : uses
+{{< /mermaid >}}
+
+## User Journey
+
+```shell
+{{</* mermaid */>}}
+journey
+title My working day
+section Go to work
+Make tea: 5: Me
+Go upstairs: 3: Me
+Do work: 1: Me, Cat
+section Go home
+Go downstairs: 5: Me
+Sit down: 5: Me
+{{</* /mermaid */>}}
+```
+{{< mermaid >}}
+journey
+title My working day
+section Go to work
+Make tea: 5: Me
+Go upstairs: 3: Me
+Do work: 1: Me, Cat
+section Go home
+Go downstairs: 5: Me
+Sit down: 5: Me
+{{< /mermaid >}}

exampleSite/content/post/12-shortcodes/index.en-us.md

@@ -0,0 +1,156 @@
+---
+title:  Custom phrase example
+description:  "Set commonly used block references, label cards, buttons, and other information as short codes for quick referencing"
+Keywords: "short code, short code"
+
+date: 2025-01-29T21:08:50+08:00
+lastmod: 2025-01-29T21:08:50+08:00
+
+categories:
+  - Example
+  - Grammar
+tags:
+  - ShortCode
+  - Grammar
+url: "demo/shortcodes.html"
+toc: true
+---
+
+Although the `Markdown` syntax is already very rich and can meet the vast majority of our writing needs, in order to better layout the content of the article in a more friendly way, a set of custom phrases has been designed for citation, which can be quickly referenced when used.
+
+<!--more-->
+
+## Block reference
+
+When quoting some classic quotes, this phrase can be used. The grammar reference is as follows:
+
+```markdown
+{{</* quote */>}}
+
+###  block quote
+
+Write down the words you want to express!
+{{</* /quote */>}}
+```
+
+Actual effect:
+
+{{< quote >}}
+
+Hope is indifferent to existence, indifferent to nothingness, just like the road on earth.
+
+
+In fact, there is no road on the ground, and with more people walking, it becomes a road.
+
+**Lu Xun**
+
+{{< /quote >}}
+
+## Information Block
+
+Support 'default'` The presentation of five different effects, including info, success, warning, and danger, with the following syntax reference:
+
+```markdown
+{{</* note [class] [no-icon] */>}}
+Write and express information
+Support Markdown syntax
+{{</* /note */>}}
+```
+
+Actual effect:
+
+{{< note default no-icon >}}
+
+###  Default Header without icon
+
+**Welcome** to [Hugo NexT!]( https://preview.hugo-next.eu.org )
+{{< /note >}}
+
+{{< note default >}}
+###  Default Header
+**Welcome** to [Hugo NexT!]( https://preview.hugo-next.eu.org )
+{{< /note >}}
+
+{{< note primary >}}
+###  Primary Header
+**Welcome** to [Hugo NexT!]( https://preview.hugo-next.eu.org )
+{{< /note >}}
+
+{{< note info >}}
+###  Info Header
+**Welcome** to [Hugo NexT!]( https://preview.hugo-next.eu.org )
+{{< /note >}}
+
+{{< note success >}}
+###  Success Header
+**Welcome** to [Hugo NexT!]( https://preview.hugo-next.eu.org )
+{{< /note >}}
+
+{{< note warning >}}
+###  Warning Header
+**Welcome** to [Hugo NexT!]( https://preview.hugo-next.eu.org )
+{{< /note >}}
+
+{{< note danger >}}
+###  Danger Header
+**Welcome** to [Hugo NexT!]( https://preview.hugo-next.eu.org )
+{{< /note >}}
+
+
+## Bilibili video
+
+```markdown
+{{</* bilibili BV1Sx411T7QQ */>}}
+perhaps
+{{</* bilibili id=BV1Sx411T7QQ */>}}
+```
+{{< bilibili id=BV1Sx411T7QQ >}}
+
+## Music player
+
+Based on [Player](https://github.com/DIYgod/APlayer) And [MatingJS](https://github.com/metowolf/MetingJS) The library implements a responsive music player embedded in the meeting, with automatically recognized music platform URLs, including:` Netease, Tencent, Kugou, Baidu, and Xiami platforms also support user-defined music sources. Other relevant parameter explanations are as follows:
+
+|Parameter Name | Default | Description|
+| :----: | :------: | :--- |
+| **id** | _Required_  | Music ID, which is the unique identifier of the music on the music platform |
+| **server** | _Required_  | Music platform, supports `netease`、 `tencent`、 `kugou`、 `baidu` and `xiami` |
+| **type** | _Required_  | Play type, currently supports `song` 、 `playlist`、 `album`、 `search` and `artist` |
+| **auto** | _Optional_  | Music address, only supports the platform in the server parameter |
+| **theme** | `#448aff`  | The theme color of the player defaults to `#448aff` |
+| **url** | Empty  |Custom music source URL, default to empty |
+| **name** | Empty | Music name, default to empty |
+| **artist** | Empty  | Music author, default to empty |
+| **cover** | Empty  | Music cover URL, default to empty |
+| **fixed** | `false` | Fixed player, default to `false` |
+| **mini** | `false`  | Display mini player, default to `false` |
+| **autoplay** | `false`  | Autoplay the music, default to `false` |
+| **loop** | `all`  | Loop playback, supports `all`、`one` and `none`，default to `all` |
+| **order** | `list`  | Play order `list` and `random`，default to `list` |
+| **volume** | `0.7`  | Volume, default is `0.7` |
+| **mutex** | `true` | When multiple pieces of music are playing, should only the current player be turned on，default to `true` |
+| **list-folded** | `false`  | List collapse, default is `false` |
+| **list-max-height** | `340px`  | The maximum height of the list is 340px by default |
+
+### Single playback
+
+```markdown
+{{</* music theme="#2980b9" server="tencent" type="song" id="002u4ZTb0CXmJA" mini="true" */>}}
+```
+
+{{< music theme="#2980b9" server="tencent" type="song" id="002u4ZTb0CXmJA" mini="true" >}}
+
+### List playback
+
+```markdown
+{{</* music server="netease" type="playlist" id="1982066521" list-max-height="140" */>}}
+```
+
+{{< music server="netease" type="playlist" id="1982066521" list-max-height="140px" >}}
+
+### Customize music source
+
+```markdown
+{{</* music url="/music/sky.mp3" name="Sky City" artist="Hayao Miyazaki" cover="/music/gongqijun.jpg" autoplay="true" */>}}
+```
+
+{{< music url="/music/sky.mp3" name="City of the Sky" artist="Hayao Miyazaki" cover="/music/gongqijun.jpg" autoplay="true" >}}

exampleSite/content/post/13-hugo-blockquote/index.en-us.md

@@ -0,0 +1,148 @@
+---
+title:  "Support block information emphasis annotation in Markdown documents"
+description:  "Added rendering of blockquote style in the new version of Hugo framework, supports custom style design, and implements a warning style similar to Github"
+keywords: "hugo,block,quote"
+
+date: 2025-01-29T21:24:02+08:00
+lastmod: 2025-01-29T21:24:02+08:00
+
+categories:
+  - Example
+  - Grammar
+tags:
+  - blockquote
+  - Hugo
+
+url: "demo/hugo-blockquote.html"
+toc: true
+expired: true
+---
+
+In the past, the `Hugo NexT` theme used to annotate block information through custom phrases. Recently, it has been discovered that `Hugo` has been updated from [v0.134.0](https://github.com/gohugoio/hugo/releases/tag/v0.134.0). From the beginning of the version, it is possible to support rendering Blockquote styles in Markdown documents through hook mode (which needs to be implemented by oneself), achieving warning style styles similar to Github. So 7 different styles were added to the `Hugo NexT` theme for users to choose from, and they could also customize icons and color configurations.
+
+
+<!--more-->
+
+
+Users can find the positions of the following two configuration items and adjust them according to their preferred style and color:
+
+```yaml
+#Config. yaml or hugo.toml
+postAlerts:
+info:
+icon: "circle-info"
+color: "#4A90E2"
+note:
+icon: "bell"
+color: "#17A2B8"
+help:
+icon: "circle-question"
+color: "#967ADC"
+error:
+icon: "circle-xmark"
+color: "#DC3545"
+warning:
+icon: "triangle-exclamation"
+color: "#F39C12"
+success:
+icon: "circle-check"
+color: "#32CD32"
+important:
+icon: "circle-plus"
+color: "#007BFF"
+```
+
+```yaml
+# i18n/zh-cn.yaml
+PostAlert:
+info     :  Information
+note     :  Attention
+help     :  'Help'
+error    :  Error
+warning  :  Warning
+success  :  'Success'
+important:  'Important'
+```
+
+The writing style and specific implementation effects in the Maarkdown document are as follows:
+
+## Information prompt
+
+```markdown
+> [!INFO]
+> HugoNexT theme supports custom style design, allowing you to achieve personalized design for your own site.
+```
+
+> [!INFO]
+> HugoNexT theme supports custom style design, allowing you to achieve personalized design for your own site.
+
+## Attention to information
+
+```markdown
+> [!NOTE]
+> The latest version of the `Hugo NexT` theme supports Blockquote rendering for Markdown documents, with 7 different styles to choose from or customize.
+```
+
+> [!NOTE]
+> The latest version of the `Hugo NexT` theme supports Blockquote rendering for Markdown documents, with 7 different styles to choose from or customize.
+
+## Help Information
+
+```markdown
+> [!HELP]
+> The HugoNexT theme provides complete example usage instructions and source code, making it easier to get started and use.
+```
+
+> [!HELP]
+> The HugoNexT theme provides complete example usage instructions and source code, making it easier to get started and use.
+
+## Warning message
+
+```markdown
+> [!WARNING]
+> The HugoNexT theme uses SCSS precompilation and requires downloading the official Hugo extended version for use.
+```
+
+> [!WARNING]
+> The HugoNexT theme uses SCSS precompilation and requires downloading the official Hugo extended version for use.
+
+## Error message
+
+```markdown
+> [!ERROR]
+> The `Hugo NexT` theme is only supported in Hugo v0.132.0 and above versions.
+```
+
+> [!ERROR]
+> The `Hugo NexT` theme is only supported in Hugo v0.132.0 and above versions.
+
+## Success message
+
+```markdown
+> [!SUCCESS]
+> Congratulations on successfully deploying the `Hugo NexT` theme. Please feel free to start your creative work.
+```
+
+> [!SUCCESS]
+>Congratulations on successfully deploying the `Hugo NexT` theme. Please feel free to start your creative work.
+
+## Important information
+
+```markdown
+> [!IMPORTANT]
+> The HugoNexT theme supports the use of external CDN services, but please ensure that your network is functioning properly and accessible to CDN services at this time.
+```
+
+> [!IMPORTANT]
+> The HugoNexT theme supports the use of external CDN services, but please ensure that your network is functioning properly and accessible to CDN services at this time.
+
+
+## Custom Title
+
+```markdown
+> [!Info]+Custom Title Description
+> The HugoNexT theme provides very open and flexible configurations, allowing users to customize according to their own ideas.
+```
+
+> [!Info]+Custom Title Description
+> The HugoNexT theme provides very open and flexible configurations, allowing users to customize according to their own ideas.

exampleSite/hugo.yaml

@@ -103,6 +103,9 @@ languages:
       
       postFooter:
         endLineTip: "~ End Line ~"
+      
+      rewardSets:
+        comment: '<i class="fa-solid fa-mug-hot"></i>  How about you buy me a coffee?ヾ(^▽^*)))'
 
 # 是否包含中文，日语，韩文
 # Whether contains Chinese, Japanese and Korean
@@ -271,10 +274,10 @@ params:
 
   # 用户自定义文件配置
   # Define custom file paths.
-  # customFilePath:
-  #   sidebar: custom_sidebar.html
-  #   footer: custom_footer.html
-  #   style: /css/custom_style.css
+  customFilePath:
+    sidebar: custom_sidebar.html
+    footer: custom_footer.html
+    style: /css/custom_style.css
 
   # 知识共享国际许可 4.0
   # 更多信息： https://creativecommons.org/about/cclicenses/

static/imgs/flags/en-us.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1235" height="650" viewBox="0 0 7410 3900"> <rect width="7410" height="3900" fill="#b22234"/> <path d="M0,450H7410m0,600H0m0,600H7410m0,600H0m0,600H7410m0,600H0" stroke="#fff" stroke-width="300"/> <rect width="2964" height="2100" fill="#3c3b6e"/> <g fill="#fff"> <g id="s18"> <g id="s9"> <g id="s5"> <g id="s4"> <path id="s" d="M247,90 317.534230,307.082039 132.873218,172.917961H361.126782L176.465770,307.082039z"/> <use xlink:href="#s" y="420"/> <use xlink:href="#s" y="840"/> <use xlink:href="#s" y="1260"/> </g> <use xlink:href="#s" y="1680"/> </g> <use xlink:href="#s4" x="247" y="210"/> </g> <use xlink:href="#s9" x="494"/> </g> <use xlink:href="#s18" x="988"/> <use xlink:href="#s9" x="1976"/> <use xlink:href="#s5" x="2470"/> </g> </svg>

static/imgs/flags/fr-fr.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="900" height="600"><rect width="900" height="600" fill="#ED2939"/><rect width="600" height="600" fill="#fff"/><rect width="300" height="600" fill="#002395"/></svg>

static/imgs/flags/zh-cn.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="900" height="600" viewBox="0 0 30 20"> <defs> <path id="s" d="M0,-1 0.587785,0.809017 -0.951057,-0.309017H0.951057L-0.587785,0.809017z" fill="#ffde00"/> </defs> <rect width="30" height="20" fill="#de2910"/> <use xlink:href="#s" transform="translate(5,5) scale(3)"/> <use xlink:href="#s" transform="translate(10,2) rotate(23.036243)"/> <use xlink:href="#s" transform="translate(12,4) rotate(45.869898)"/> <use xlink:href="#s" transform="translate(12,7) rotate(69.945396)"/> <use xlink:href="#s" transform="translate(10,9) rotate(20.659808)"/> </svg>

static/js/3rd/dn.txt

@@ -1,3 +0,0 @@
-https://unpkg.com/meting@2.0.1/dist/Meting.min.js
-https://unpkg.com/browse/aplayer@1.10.1/dist/APlayer.min.js
-https://unpkg.com/browse/aplayer@1.10.1/dist/APlayer.min.css