alyenc/hextra
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init
Some checks failed
Deploy Hugo site to Pages / build (push) Failing after 49s
Details
Deploy Hugo site to Pages / deploy (push) Has been skipped
Details

Browse Source
This commit is contained in:
alyenc 2025-01-21 03:27:23 +08:00
parent cb3373d500
commit a6aea0051a
125 changed files with 9 additions and 10944 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

224
exampleSite/assets/example.ipynb
View File

File diff suppressed because one or more lines are too long

BIN
exampleSite/assets/images/space.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 168 KiB

76
exampleSite/content/_index.fa.md
View File

@ -1,76 +0,0 @@
---
title: تم هگزترا
layout: hextra-home
---
{{< hextra/hero-badge >}}
<div class="hx-w-2 hx-h-2 hx-rounded-full hx-bg-primary-400"></div>
<span>آزاد، متن‌باز</span>
{{< icon name="arrow-circle-left" attributes="height=14" >}}
{{< /hextra/hero-badge >}}
<div class="hx-mt-6 hx-mb-6">
{{< hextra/hero-headline >}}
ساخت وب‌سایت‌های مدرن &nbsp;<br class="sm:hx-block hx-hidden" />با مارک‌داون و هیوگو
{{< /hextra/hero-headline >}}
</div>
<div class="hx-mb-12">
{{< hextra/hero-subtitle >}}
تم هیوگو سریع و دارای امکانات کامل&nbsp;<br class="sm:hx-block hx-hidden" />برای ایجاد وب‌سایت‌های استاتیک زیبا
{{< /hextra/hero-subtitle >}}
</div>
<div class="hx-mb-6">
{{< hextra/hero-button text="شروع کنید" link="docs" >}}
</div>
<div class="hx-mt-6"></div>
{{< hextra/feature-grid >}}
{{< hextra/feature-card
title="سریع و با امکانات کامل"
subtitle="ساده و آسان برای استفاده، در عین حال قدرتمند و غنی از ویژگی‌ها متنوع."
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]"
image="/images/hextra-doc.webp"
imageClass="hx-top-[40%] hx-left-[24px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="مارک‌داون تنها چیزی است که شما نیاز دارید"
subtitle="فقط با مارک‌داون بنویسید. تکمیل و کامل با کامپوننت‌های کد کوتاه."
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]"
image="/images/hextra-markdown.webp"
imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="جستجوی کامل متن"
subtitle="جستجوی متن کامل داخلی با FlexSearch، بدون نیاز به نصب موارد اضافی."
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]"
image="/images/hextra-search.webp"
imageClass="hx-top-[40%] hx-left-[36px] hx-w-[110%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(221,210,59,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="سبک مانند یک پر"
subtitle="برای استفاده از هگزترا به هیچ وابستگی یا Node.js نیاز نیست. با پشتیبانی از هیوگو، یکی از سریع‌ترین تولیدکنندگان سایت استاتیک، سایت شما را تنها در چند ثانیه با یک باینری می‌سازد."
>}}
{{< hextra/feature-card
title=" واکنش‌گرا با حالت تیره"
subtitle="در اندازه‌های مختلف صفحه نمایش عالی به نظر می‌رسد. پشتیبانی از حالت تیره داخلی، با تغییر خودکار براساس اولویت سیستم کاربر."
>}}
{{< hextra/feature-card
title="ساخت و میزبانی رایگان"
subtitle="با گیت‌هاب Actions بسازید و به صورت رایگان در گیت‌هاب Pages میزبانی کنید. یا می‌توانید آن را در هر سرویس میزبانی استاتیک میزبانی کنید."
>}}
{{< hextra/feature-card
title="چند زبانه آسان"
subtitle="فقط با افزودن پسوند محلی به پرونده مارک‌داون صفحات وب‌سایت چند زبانه ایجاد کنید. افزودن پشتیبانی i18n به سایت شما بصری است."
>}}
{{< hextra/feature-card
title="و خیلی بیشتر..."
icon="sparkles"
subtitle="برجسته‌کردن سینتکس / فهرست مطالب / سئو / RSS / LaTeX / Mermaid / سفارشی‌سازی / و موارد دیگر…"
>}}
{{< /hextra/feature-grid >}}

76
exampleSite/content/_index.ja.md
View File

@ -1,76 +0,0 @@
---
title: Hextra テーマ
layout: hextra-home
---
{{< hextra/hero-badge >}}
<div class="hx-w-2 hx-h-2 hx-rounded-full hx-bg-primary-400"></div>
<span>無料、オープンソース</span>
{{< icon name="arrow-circle-right" attributes="height=14" >}}
{{< /hextra/hero-badge >}}
<div class="hx-mt-6 hx-mb-6">
{{< hextra/hero-headline >}}
MarkdownとHugoで&nbsp;<br class="sm:hx-block hx-hidden" />モダンなウェブサイトを構築
{{< /hextra/hero-headline >}}
</div>
<div class="hx-mb-12">
{{< hextra/hero-subtitle >}}
美しい静的ウェブサイトを作るための&nbsp;<br class="sm:hx-block hx-hidden" />高速でバッテリー同梱型のHugoテーマ
{{< /hextra/hero-subtitle >}}
</div>
<div class="hx-mb-6">
{{< hextra/hero-button text="始める" link="docs" >}}
</div>
<div class="hx-mt-6"></div>
{{< hextra/feature-grid >}}
{{< hextra/feature-card
title="高速かつ多機能"
subtitle="シンプルで使いやすく、それでいて強力で豊富な機能を備えています。"
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]"
image="/images/hextra-doc.webp"
imageClass="hx-top-[40%] hx-left-[24px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="MarkdownだけでOK"
subtitle="Markdownだけで作成可能。ショートコードコンポーネントで充実させることもできます。"
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]"
image="/images/hextra-markdown.webp"
imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="全文検索"
subtitle="FlexSearchによる全文検索が内蔵されており、追加の設定は不要です。"
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]"
image="/images/hextra-search.webp"
imageClass="hx-top-[40%] hx-left-[36px] hx-w-[110%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(221,210,59,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="羽のように軽量"
subtitle="Hextraを使用するために依存関係やNode.jsは必要ありません。Hugoによって動力を得ており、単一のバイナリで数秒でサイトを構築できます。"
>}}
{{< hextra/feature-card
title="レスポンシブ対応とダークモード"
subtitle="さまざまな画面サイズで美しく見えます。内蔵のダークモードサポートにより、ユーザーのシステム設定に基づいて自動切り替えが可能です。"
>}}
{{< hextra/feature-card
title="無料で構築とホスティング"
subtitle="GitHub Actionsを使って構築し、GitHub Pagesで無料でホスティングできます。また、他の静的ホスティングサービスでもホスティング可能です。"
>}}
{{< hextra/feature-card
title="簡単な多言語対応"
subtitle="Markdownファイルにロケールサフィックスを追加するだけで多言語ページを作成できます。i18nサポートの追加も直感的です。"
>}}
{{< hextra/feature-card
title="さらに多くの機能"
icon="sparkles"
subtitle="構文ハイライト / 目次 / SEO / RSS / LaTeX / Mermaid / カスタマイズ可能 / など多数..."
>}}
{{< /hextra/feature-grid >}}

76
exampleSite/content/_index.md
View File

@ -1,76 +0,0 @@
---
title: Hextra Theme
layout: hextra-home
---
{{< hextra/hero-badge >}}
<div class="hx-w-2 hx-h-2 hx-rounded-full hx-bg-primary-400"></div>
<span>Free, open source</span>
{{< icon name="arrow-circle-right" attributes="height=14" >}}
{{< /hextra/hero-badge >}}
<div class="hx-mt-6 hx-mb-6">
{{< hextra/hero-headline >}}
Build modern websites&nbsp;<br class="sm:hx-block hx-hidden" />with Markdown and Hugo
{{< /hextra/hero-headline >}}
</div>
<div class="hx-mb-12">
{{< hextra/hero-subtitle >}}
Fast, batteries-included Hugo theme&nbsp;<br class="sm:hx-block hx-hidden" />for creating beautiful static websites
{{< /hextra/hero-subtitle >}}
</div>
<div class="hx-mb-6">
{{< hextra/hero-button text="Get Started" link="docs" >}}
</div>
<div class="hx-mt-6"></div>
{{< hextra/feature-grid >}}
{{< hextra/feature-card
title="Fast and Full-featured"
subtitle="Simple and easy to use, yet powerful and feature-rich."
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]"
image="images/hextra-doc.webp"
imageClass="hx-top-[40%] hx-left-[24px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="Markdown is All You Need"
subtitle="Compose with just Markdown. Enrich with Shortcode components."
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]"
image="images/hextra-markdown.webp"
imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="Full Text Search"
subtitle="Built-in full text search with FlexSearch, no extra setup required."
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]"
image="images/hextra-search.webp"
imageClass="hx-top-[40%] hx-left-[36px] hx-w-[110%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(221,210,59,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="Lightweight as a Feather"
subtitle="No dependency or Node.js is needed to use Hextra. Powered by Hugo, one of *the fastest* static site generators, building your site in just seconds with a single binary."
>}}
{{< hextra/feature-card
title="Responsive with Dark Mode Included"
subtitle="Looks great on different screen sizes. Built-in dark mode support, with auto-switching based on user's system preference."
>}}
{{< hextra/feature-card
title="Build and Host for Free"
subtitle="Build with GitHub Actions, and host for free on GitHub Pages. Alternatively it can be hosted on any static hosting service."
>}}
{{< hextra/feature-card
title="Multi-Language Made Easy"
subtitle="Create multi-language pages by just adding locales suffix to the Markdown file. Adding i18n support to your site is intuitive."
>}}
{{< hextra/feature-card
title="And Much More..."
icon="sparkles"
subtitle="Syntax highlighting / Table of contents / SEO / RSS / LaTeX / Mermaid / Customizable / and more..."
>}}
{{< /hextra/feature-grid >}}

76
exampleSite/content/_index.zh-cn.md
View File

@ -1,76 +0,0 @@
---
title: Hextra 主题
layout: hextra-home
---
{{< hextra/hero-badge >}}
<div class="hx-w-2 hx-h-2 hx-rounded-full hx-bg-primary-400"></div>
<span>免费 开源</span>
{{< icon name="arrow-circle-right" attributes="height=14" >}}
{{< /hextra/hero-badge >}}
<div class="hx-mt-6 hx-mb-6">
{{< hextra/hero-headline >}}
创建现代化网站&nbsp;<br class="sm:hx-block hx-hidden" />由 Markdown 和 Hugo 驱动
{{< /hextra/hero-headline >}}
</div>
<div class="hx-mb-12">
{{< hextra/hero-subtitle >}}
极速且全能的 Hugo 主题框架&nbsp;<br class="sm:hx-block hx-hidden" />为构建现代化的静态网站而生
{{< /hextra/hero-subtitle >}}
</div>
<div class="hx-mb-6">
{{< hextra/hero-button text="现在开始" link="docs" >}}
</div>
<div class="hx-mt-6"></div>
{{< hextra/feature-grid >}}
{{< hextra/feature-card
title="快速且功能全面"
subtitle="简单易用，功能强大丰富。"
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]"
image="/images/hextra-doc.webp"
imageClass="hx-top-[40%] hx-left-[24px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(194,97,254,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="Markdown 写作"
subtitle="只需使用 Markdown 进行编辑。多样的 Shortcode 组件开箱即用。"
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-lg:hx-min-h-[340px]"
image="/images/hextra-markdown.webp"
imageClass="hx-top-[40%] hx-left-[36px] hx-w-[180%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(142,53,74,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="全文搜索"
subtitle="内置 FlexSearch 全文搜索，无需额外设置。"
class="hx-aspect-auto md:hx-aspect-[1.1/1] max-md:hx-min-h-[340px]"
image="/images/hextra-search.webp"
imageClass="hx-top-[40%] hx-left-[36px] hx-w-[110%] sm:hx-w-[110%] dark:hx-opacity-80"
style="background: radial-gradient(ellipse at 50% 80%,rgba(221,210,59,0.15),hsla(0,0%,100%,0));"
>}}
{{< hextra/feature-card
title="轻如羽毛"
subtitle="使用 Hextra 无需依赖 Node.js。由 Hugo 提供支持，Hugo 是最快的静态网站生成器之一，只需一个二进制文件即可在数秒内创建网站。"
>}}
{{< hextra/feature-card
title="响应式布局，暗黑模式"
subtitle="适应不同的屏幕尺寸。内置暗黑模式支持，并根据用户的系统偏好自动切换。"
>}}
{{< hextra/feature-card
title="免费构建和托管"
subtitle="使用 GitHub Actions 进行构建，并在 GitHub Pages 上免费托管。也可以托管在任何静态托管服务上。"
>}}
{{< hextra/feature-card
title="多语言轻松实现"
subtitle="仅需通过在 Markdown 文件后添加语言代码即可创建多语言页面。向您的站点添加 i18n 支持直观易行。"
>}}
{{< hextra/feature-card
title="还有更多..."
icon="sparkles"
subtitle="代码高亮 / 目录 / SEO / RSS / LaTeX 公式 / Mermaid 图标 / 自定义 / 等等..."
>}}
{{< /hextra/feature-grid >}}

22
exampleSite/content/about/index.fa.md
View File

@ -1,22 +0,0 @@
---
title: درباره ما
toc: false
---
هگزترا به گونه‌ای طراحی شده است که یک موضوع ساده، سریع و انعطاف پذیر برای ساخت وب‌سایت‌های استاتیک مدرن باشد. این به ویژه برای وب‌سایت‌های مستندسازی مناسب است اما می‌تواند برای انواع مختلف سایت‌ها مانند وبلاگ‌ها، نمونه‌کار و موارد دیگر نیز استفاده شود.
Hugo مانند Jekyll، یک ایجادکننده سایت استاتیک است. چیزی که Hugo را متمایز می‌کند این است که یک باینری واحد است و نصب و اجرای آن بر روی پلتفرم‌های مختلف را آسان می‌کند. همچنین بسیار سریع و قابل اعتماد است و می‌تواند یک سایت را با هزاران صفحه در میلی‌ثانیه ارائه دهد.
هگزترا با ذهنیتی ساخته شده است که بر داشتن حداقل ردپا متمرکز شده است. برای شروع، هیچ وابستگی اضافی مانند بسته‌های Node.js لازم نیست. تنها چیزی که نیاز دارید یک پرونده پیکربندی YAML به همراه محتوای مارک‌داون شما است. بنابراین، شما می‌توانید به جای تنظیم ابزار، روی نوشتن محتوای با کیفیت تمرکز کنید.
## اعتبار
ترجمه فارسی مستندات توسط [گودرز جعفری](https://goudarzjafari.com/) انجام شده است.
هگزترا بدون ابزار و الهامات زیر ساخته نمی‌شود:
- [هیوگو](https://gohugo.io/)
- [Tailwind CSS](https://tailwindcss.com/)
- [Heroicons](https://heroicons.com/)
- [Nextra](https://nextra.vercel.app/)
- [Next.js](https://nextjs.org/)

20
exampleSite/content/about/index.md
View File

@ -1,20 +0,0 @@
---
title: About
toc: false
---
Hextra is designed to be a simple, fast, and flexible theme for building modern static websites. It is especially well-suited for documentation websites but can also be used for various types of sites, such as blogs, portfolios, and more.
Hugo, like Jekyll, is a static site generator. What sets Hugo apart is that it is a single binary, making it easy to install and run on various platforms. It is also extremely fast and reliable, capable of rendering a site with thousands of pages in milliseconds.
Hextra is built with a mindset focused on having a minimal footprint. To get started, no extra dependencies like Node.js packages are required; all you need is a single YAML configuration file, along with your Markdown content. Thus, we can focus on writing quality content instead of setting up tooling.
## Credits
Hextra cannot be built without the following tools and inspirations:
- [Hugo](https://gohugo.io/)
- [Tailwind CSS](https://tailwindcss.com/)
- [Heroicons](https://heroicons.com/)
- [Nextra](https://nextra.vercel.app/)
- [Next.js](https://nextjs.org/)

20
exampleSite/content/about/index.zh-cn.md
View File

@ -1,20 +0,0 @@
---
title: 关于
toc: false
---
Hextra 是一款简洁、快速、灵活的主题，适用于构建现代化静态站点。Hextra 特别适用于文档网站，但也可用于构建博客、个人网站等各种类型的网站。
Hugo 和 Jekyll 类似，是一个静态网站生成器。但与其他生成器不同，Hugo 只有单个可执行文件，这使得它可以轻松地在各种平台上安装和运行。Hugo 的运行速度非常快且可靠性高，能够在几毫秒内渲染数千页的网站。
Hextra 被设计为轻量级，具有最小化的内存占用。使用 Hextra 无需安装繁杂的依赖，比如 Node.js；相反，你只需要一个简单的 YAML 配置文件和 Markdown 内容。因此，我们可以专注于内容而非在配置环境上浪费精力。
## 鸣谢
Hextra 的设计离不开这些项目的支持和其提供的灵感：
- [Hugo](https://gohugo.io/)
- [Tailwind CSS](https://tailwindcss.com/)
- [Heroicons](https://heroicons.com/)
- [Nextra](https://nextra.vercel.app/)
- [Next.js](https://nextjs.org/)

10
exampleSite/content/blog/_index.fa.md
View File

@ -1,10 +0,0 @@
---
title: "وبلاگ"
---
<div style="text-align: center; margin-top: 1em;">
{{< hextra/hero-badge link="index.xml" >}}
<span>خوراک RSS</span>
{{< icon name="rss" attributes="height=14" >}}
{{< /hextra/hero-badge >}}
</div>

10
exampleSite/content/blog/_index.md
View File

@ -1,10 +0,0 @@
---
title: "Blog"
---
<div style="text-align: center; margin-top: 1em;">
{{< hextra/hero-badge link="index.xml" >}}
<span>RSS Feed</span>
{{< icon name="rss" attributes="height=14" >}}
{{< /hextra/hero-badge >}}
</div>

10
exampleSite/content/blog/_index.zh-cn.md
View File

@ -1,10 +0,0 @@
---
title: "博客"
---
<div style="text-align: center; margin-top: 1em;">
{{< hextra/hero-badge link="index.xml" >}}
<span>RSS 订阅</span>
{{< icon name="rss" attributes="height=14" >}}
{{< /hextra/hero-badge >}}
</div>

166
exampleSite/content/blog/markdown.fa.md
View File

@ -1,166 +0,0 @@
---
title: راهنمای استفاده سینتکس مارک‌داون
date: 2024-03-03
authors:
- name: imfing
link: https://github.com/imfing
image: https://github.com/imfing.png
- name: Octocat
link: https://github.com/octocat
image: https://github.com/octocat.png
- name: Goudarz Jafari
link: https://github.com/Goudarz
image: https://github.com/Goudarz.png
tags:
- Markdown
- مثال
- راهنمای
excludeSearch: true
---
این مقاله نمونه‌ای از سینتکس ابتدایی مارک‌داون را آموزش می‌دهد، که می‌توانید در پرونده‌های محتوای Hugo استفاده کنید.
<!--more-->
## سینتکس ابتدایی
### سرتیترها
```
# سرتیتر ۱
## سرتیتر ۲
### سرتیتر ۳
#### سرتیتر ۴
##### سرتیتر ۵
###### سرتیتر ۶
```
## سرتیتر ۲
### سرتیتر ۳
#### سرتیتر ۴
##### سرتیتر ۵
###### سرتیتر ۶
### تاکید
```text
*این متن کج خواهد بود*
_این متن هم کج خواهد بود_
**این متن توپر خواهد بود**
__این متن هم توپر خواهد بود__
_شما **می‌توانید** آنها را ترکیب کنید_
```
*این متن کج خواهد بود*
_این متن هم کج خواهد بود_
**این متن توپر خواهد بود**
__این متن هم توپر خواهد بود__
_شما **می‌توانید** آنها را ترکیب کنید_
### فهرست‌ها
#### مرتب نشده
```
* مورد ۱
* مورد ۲
* مورد ۱الف
* مورد ۲ب
```
* مورد ۱
* مورد ۲
* مورد ۱الف
* مورد ۲ب
#### مرتب شده
```
1. مورد ۱
2. مورد ۲
3. مورد ۳
1. مورد ۳الف
2. مورد ۳ب
```
1. مورد ۱
2. مورد ۲
3. مورد ۳
1. مورد ۳الف
2. مورد ۳ب
### عکس‌ها
```markdown
![آرم گیت‌هاب](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
```
![آرم گیت‌هاب](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
### پیوندها
```markdown
[هیوگو](https://gohugo.io)
```
[هیوگو](https://gohugo.io)
### بلوک نقل‌قول
```markdown
همانطور که نیوتن گفت:
> اگر فاصله دورتری را دیده‌ام با ایستادن بر شانه‌های غول‌ها بوده است.
```
> اگر فاصله دورتری را دیده‌ام با ایستادن بر شانه‌های غول‌ها بوده است.
### کد درون‌خطی
```markdown
`کد` درون‌خطی دارای `بک‌-تیک در اطراف` خود است.
```
`کد` درون‌خطی دارای `بک‌-تیک در اطراف` خود است.
### بلوک‌های کد
#### برجسته‌کردن سینتکس(Syntax)
````markdown
```go
func main() {
fmt.Println("Hello World")
}
```
````
```go
func main() {
fmt.Println("Hello World")
}
```
### جدول‌ها
```markdown
| عنوان | توضیحات |
| --------- | ----------- |
| سرتیتر | عنوان |
| پاراگراف | متن |
```
| عنوان | توضیحات |
| --------- | ----------- |
| سرتیتر | عنوان |
| پاراگراف | متن |
## منابع
- [سینتکس مارک‌داون](https://www.markdownguide.org/basic-syntax/)
- [مارک‌داون هیوگو](https://gohugo.io/content-management/formats/#markdown)

157
exampleSite/content/blog/markdown.md
View File

@ -1,157 +0,0 @@
---
title: Markdown Syntax Guide
date: 2020-01-01
authors:
- name: imfing
link: https://github.com/imfing
image: https://github.com/imfing.png
- name: Octocat
link: https://github.com/octocat
image: https://github.com/octocat.png
tags:
- Markdown
- Example
- Guide
excludeSearch: true
---
This article offers a sample of basic Markdown syntax that can be used in Hugo content files.
<!--more-->
## Basic Syntax
### Headings
```
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
```
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
### Emphasis
```text
*This text will be italic*
_This will also be italic_
**This text will be bold**
__This will also be bold__
_You **can** combine them_
```
*This text will be italic*
_This will also be italic_
**This text will be bold**
__This will also be bold__
_You **can** combine them_
### Lists
#### Unordered
```
* Item 1
* Item 2
* Item 2a
* Item 2b
```
* Item 1
* Item 2
* Item 2a
* Item 2b
#### Ordered
```
1. Item 1
2. Item 2
3. Item 3
1. Item 3a
2. Item 3b
```
### Images
```markdown
![GitHub Logo](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
```
![GitHub Logo](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
### Links
```markdown
[Hugo](https://gohugo.io)
```
[Hugo](https://gohugo.io)
### Blockquotes
```markdown
As Newton said:
> If I have seen further it is by standing on the shoulders of Giants.
```
> If I have seen further it is by standing on the shoulders of Giants.
### Inline Code
```markdown
Inline `code` has `back-ticks around` it.
```
Inline `code` has `back-ticks around` it.
### Code Blocks
#### Syntax Highlighting
````markdown
```go
func main() {
fmt.Println("Hello World")
}
```
````
```go
func main() {
fmt.Println("Hello World")
}
```
### Tables
```markdown
| Syntax | Description |
| --------- | ----------- |
| Header | Title |
| Paragraph | Text |
```
| Syntax | Description |
| --------- | ----------- |
| Header | Title |
| Paragraph | Text |
## References
- [Markdown Syntax](https://www.markdownguide.org/basic-syntax/)
- [Hugo Markdown](https://gohugo.io/content-management/formats/#markdown)

137
exampleSite/content/blog/markdown.zh-cn.md
View File

@ -1,137 +0,0 @@
---
title: Markdown 语法指南
date: 2020-01-01
authors:
- name: John Doe
link: https://example.com/johndoe
excludeSearch: true
---
这篇文章提供了一些基础的 Markdown 语法样例，这些可以在 Hugo 的内容文件中使用。
<!--more-->
## 基础语法
### 标题
```
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题
```
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题
```text
*这段文字将是斜体*
_这也将是斜体_
**这段文字将是粗体**
__这也将是粗体__
_你 **可以** 组合它们_
```
*这段文字将是斜体*
_这也将是斜体_
**这段文字将是粗体**
__这也将是粗体__
_你 **可以** 组合它们_
### 列表
#### 无序列表
* 项目 1
* 项目 2
* 项目 2a
* 项目 2b
#### 有序列表
1. 项目 1
2. 项目 2
3. 项目 3
1. 项目 3a
2. 项目 3b
### 图片
```markdown
![GitHub Logo](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
```
![GitHub Logo](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
### 链接
```markdown
[Hugo](https://gohugo.io)
```
[Hugo](https://gohugo.io)
### 块引用
```markdown
牛顿曾说：
> 如果我看得更远，那是因为我站在巨人的肩膀上。
```
> 如果我看得更远，那是因为我站在巨人的肩膀上。
### 行内代码
```markdown
行内 `代码` 有 `反引号` 包围。
```
行内 `代码` 有 `反引号` 包围。
### 代码块
#### 语法高亮
````markdown
```go
func main() {
fmt.Println("Hello World")
}
```
````
```go
func main() {
fmt.Println("Hello World")
}
```
### 表格
```markdown
| Syntax | Description |
| --------- | ----------- |
| Header | Title |
| Paragraph | Text |
```
| Syntax | Description |
| --------- | ----------- |
| Header | Title |
| Paragraph | Text |
## 参考
- [Markdown Syntax](https://www.markdownguide.org/basic-syntax/)
- [Hugo Markdown](https://gohugo.io/content-management/formats/#markdown)

41
exampleSite/content/docs/_index.fa.md
View File

@ -1,41 +0,0 @@
---
linkTitle: "مستندات"
title: معرفی
---
👋 سلام! به مستندات هگزترا خوش آمدید!
<!--more-->
## هگزترا چیه؟
هگزترا یک تم [Hugo][hugo] مدرن و سریع است که با [Tailwind CSS][tailwind-css] ساخته شده است.
طراحی شده برای ساخت وب‌سایت‌های زیبا برای مستندات، وبلاگ‌ها و وب‌سایت‌ها، ویژگی‌های خارج از جعبه و انعطاف‌پذیری را برای پاسخگویی نیازهای مختلف فراهم می‌کند.
## ویژگی‌ها
- **طراحی زیبا** - با الهام از Nextra، هگزترا از Tailwind CSS برای ارائه یک طراحی مدرن که سایت شما را برجسته می‌کند، استفاده می‌کند.
- **طراحی واکنش‌گرا و حالت تیره** - در تمام دستگاه‌ها، از تلفن همراه، تبلت تا دسکتاپ، عالی به نظر می‌رسد. حالت تیره نیز برای انطباق با شرایط مختلف روشنایی پشتیبانی می‌شود.
- **سریع و سبک** - طراحی شده توسط Hugo، یک ایجادکننده سایت استاتیک سریع مثل رعد و برق که در یک فایل باینری قرار گرفته است، هگزترا ردپای خود را به حداقل می‌رساند. برای استفاده از آن به جاوااسکریپت یا Node.js نیازی ندارید.
- **جستجوی متن کامل** - جستجوی متن کاملا آفلاین داخلی طراحی شده توسط FlexSearch، بدون نیاز به پیکربندی اضافی.
- **امکانات کامل** - برای بهتر کردن محتوای شما مارک‌داون، برجسته‌کردن سینتکس، فرمول‌های ریاضی LaTeX، نمودارها و عناصر Shortcodeها را شامل میشه. فهرست مطالب، بردکرامب، صفحه‌بندی، پیمایش نوار کناری و موارد دیگر همه به صورت خودکار تولید می‌شوند.
- **چند زبانه و سئو آماده** - سایت‌های چند زبانه با حالت چند زبانه Hugo راحت ساخته می‌شوند. پشتیبانی خارج از جعبه برای برچسب‌های سئو، Open Graph و کارت‌های توییتر گنجانده شده است.
## سوال یا بازخورد؟
{{< callout emoji="❓" >}}
هگزترا هنوز در حال توسعه است.
سوال یا بازخوردی دارید؟ با خیال راحت [یک موضوع را باز کنید](https://github.com/imfing/hextra/issues)!
{{< /callout >}}
## بعدی
برای شروع کردن به بخش زیر مراجعه کنید:
{{< cards >}}
{{< card link="getting-started" title="شروع کنید" icon="document-text" subtitle="یادگیری نحوه ایجاد وب‌سایت با استفاده از هگزترا" >}}
{{< /cards >}}
[hugo]: https://gohugo.io/
[flex-search]: https://github.com/nextapps-de/flexsearch
[tailwind-css]: https://tailwindcss.com/

40
exampleSite/content/docs/_index.ja.md
View File

@ -1,40 +0,0 @@
---
linkTitle: "ドキュメンテーション"
title: イントロダクション
---
👋 こんにちは！Hextraのドキュメンテーションへようこそ！
<!--more-->
## Hextraとは？
Hextraは、[Tailwind CSS][tailwind-css]を使用して構築された、モダンで高速かつ機能豊富な[Hugo][hugo]テーマです。ドキュメンテーション、ブログ、ウェブサイトのための美しいウェブサイトを構築するために設計されており、さまざまな要件に対応するための機能と柔軟性を提供します。
## 特徴
- **美しいデザイン** - Nextraにインスパイアされ、Tailwind CSSを活用してモダンなデザインを提供し、サイトを際立たせます。
- **レスポンシブレイアウトとダークモード** - モバイル、タブレット、デスクトップなど、すべてのデバイスで美しく表示されます。また、ダークモードもサポートされており、さまざまな照明条件に対応します。
- **高速で軽量** - 単一のバイナリファイルに収められた超高速の静的サイトジェネレータであるHugoを採用し、Hextraはそのフットプリントを最小限に抑えています。JavaScriptやNode.jsは必要ありません。
- **全文検索** - FlexSearchを利用したオフライン全文検索が組み込まれており、追加の設定は不要です。
- **機能豊富** - Markdown、シンタックスハイライト、LaTeX数式、ダイアグラム、ショートコード要素など、コンテンツを強化するための機能を提供します。目次、パンくずリスト、ページネーション、サイドバーナビゲーションなどが自動生成されます。
- **多言語対応とSEO対応** - Hugoの多言語モードを使用して、多言語サイトを簡単に作成できます。SEOタグ、Open Graph、Twitter Cardsのサポートも標準で提供されます。
## 質問やフィードバックは？
{{< callout emoji="❓" >}}
Hextraはまだ活発に開発中です。
質問やフィードバックがありますか？[issueを開いて](https://github.com/imfing/hextra/issues)お気軽にお知らせください！
{{< /callout >}}
## 次に
以下のセクションに進んで、すぐに始めましょう：
{{< cards >}}
{{< card link="getting-started" title="はじめに" icon="document-text" subtitle="Hextraを使用してウェブサイトを作成する方法を学ぶ" >}}
{{< /cards >}}
[hugo]: https://gohugo.io/
[flex-search]: https://github.com/nextapps-de/flexsearch
[tailwind-css]: https://tailwindcss.com/

41
exampleSite/content/docs/_index.md
View File

@ -1,41 +0,0 @@
---
linkTitle: "Documentation"
title: Introduction
---
👋 Hello! Welcome to the Hextra documentation!
<!--more-->
## What is Hextra?
Hextra is a modern, fast and batteries-included [Hugo][hugo] theme built with [Tailwind CSS][tailwind-css].
Designed for building beautiful websites for documentation, blogs, and websites, it provides out-of-the-box features and flexibility to meet various requirements.
## Features
- **Beautiful Design** - Inspired by Nextra, Hextra utilizes Tailwind CSS to offer a modern design that makes your site look outstanding.
- **Responsive Layout and Dark Mode** - It looks great on all devices, from mobile, tablet to desktop. Dark mode is also supported to accommodate various lighting conditions.
- **Fast and Lightweight** - Powered by Hugo, a lightning-fast static-site generator housed in a single binary file, Hextra keeps its footprint minimal. No JavaScript or Node.js are needed to use it.
- **Full-text Search** - Built-in offline full-text search powered by FlexSearch, no additional configuration required.
- **Battery-included** - Markdown, syntax highlighting, LaTeX math formulae, diagrams and Shortcodes elements to enhance your content. Table of contents, breadcrumbs, pagination, sidebar navigation and more are all automatically generated.
- **Multi-language and SEO Ready** - Multi-language sites made easy with Hugo's multilingual mode. Out-of-the-box support is included for SEO tags, Open Graph, and Twitter Cards.
## Questions or Feedback?
{{< callout emoji="❓" >}}
Hextra is still in active development.
Have a question or feedback? Feel free to [open an issue](https://github.com/imfing/hextra/issues)!
{{< /callout >}}
## Next
Dive right into the following section to get started:
{{< cards >}}
{{< card link="getting-started" title="Getting Started" icon="document-text" subtitle="Learn how to create website using Hextra" >}}
{{< /cards >}}
[hugo]: https://gohugo.io/
[flex-search]: https://github.com/nextapps-de/flexsearch
[tailwind-css]: https://tailwindcss.com/

40
exampleSite/content/docs/_index.zh-cn.md
View File

@ -1,40 +0,0 @@
---
linkTitle: "文档"
title: 介绍
---
👋 你好！欢迎来到 Hextra 文档！
<!--more-->
## 什么是 Hextra？
Hextra 是一个现代、快速且功能齐全的 [Hugo][hugo] 主题，基于 [Tailwind CSS][tailwind-css] 构建。专为构建美观的文档、博客和网站而设计，它提供了开箱即用的功能和灵活性，以满足各种需求。
## 特性
- **精美设计** - 灵感源自 Nextra，Hextra 利用 Tailwind CSS 提供现代设计，使您的网站脱颖而出。
- **响应式布局与暗黑模式** - 在所有设备上都能完美呈现，从手机、平板到桌面。暗黑模式也得到支持，以适应不同的光照条件。
- **快速且轻量** - 由 Hugo 驱动，这是一个闪电般快速的静态网站生成器，仅需一个二进制文件，Hextra 保持其占用空间最小。无需 JavaScript 或 Node.js 即可使用。
- **全文搜索** - 内置离线全文搜索，由 FlexSearch 提供支持，无需额外配置。
- **功能齐全** - Markdown、语法高亮、LaTeX 数学公式、图表和 Shortcodes 元素，丰富您的内容。目录、面包屑导航、分页、侧边栏导航等均自动生成。
- **多语言与 SEO 就绪** - 通过 Hugo 的多语言模式轻松创建多语言网站。开箱即用支持 SEO 标签、Open Graph 和 Twitter Cards。
## 有问题或反馈？
{{< callout emoji="❓" >}}
Hextra 仍在积极开发中。
有问题或反馈？欢迎[提交问题](https://github.com/imfing/hextra/issues)！
{{< /callout >}}
## 下一步
立即深入以下部分，开始使用：
{{< cards >}}
{{< card link="getting-started" title="入门指南" icon="document-text" subtitle="学习如何使用 Hextra 创建网站" >}}
{{< /cards >}}
[hugo]: https://gohugo.io/
[flex-search]: https://github.com/nextapps-de/flexsearch
[tailwind-css]: https://tailwindcss.com/

16
exampleSite/content/docs/advanced/_index.fa.md
View File

@ -1,16 +0,0 @@
---
linkTitle: پیشرفته
title: موضوعات پیشرفته
prev: /docs/guide/shortcodes/steps
next: /docs/advanced/multi-language
---
این بخش برخی از موضوعات پیشرفته تم را پوشش می‌دهد.
<!--more-->
{{< cards >}}
{{< card link="multi-language" title="چند زبانه" icon="translate" >}}
{{< card link="customization" title="سفارشی‌سازی" icon="pencil" >}}
{{< card link="comments" title="سیستم نظردهی" icon="chat-alt" >}}
{{< /cards >}}

16
exampleSite/content/docs/advanced/_index.ja.md
View File

@ -1,16 +0,0 @@
---
linkTitle: 上級者向け
title: 上級者向けトピック
prev: /docs/guide/shortcodes/tabs
next: /docs/advanced/multi-language
---
このセクションでは、テーマの上級者向けトピックをカバーします。
<!--more-->
{{< cards >}}
{{< card link="multi-language" title="多言語対応" icon="translate" >}}
{{< card link="customization" title="カスタマイズ" icon="pencil" >}}
{{< card link="comments" title="コメントシステム" icon="chat-alt" >}}
{{< /cards >}}

16
exampleSite/content/docs/advanced/_index.md
View File

@ -1,16 +0,0 @@
---
linkTitle: Advanced
title: Advanced Topics
prev: /docs/guide/shortcodes/tabs
next: /docs/advanced/multi-language
---
This section covers some advanced topics of the theme.
<!--more-->
{{< cards >}}
{{< card link="multi-language" title="Multi-language" icon="translate" >}}
{{< card link="customization" title="Customization" icon="pencil" >}}
{{< card link="comments" title="Comments System" icon="chat-alt" >}}
{{< /cards >}}

16
exampleSite/content/docs/advanced/_index.zh-cn.md
View File

@ -1,16 +0,0 @@
---
linkTitle: 高级
title: 高级主题
prev: /docs/guide/shortcodes/tabs
next: /docs/advanced/multi-language
---
本节涵盖了一些主题的高级内容。
<!--more-->
{{< cards >}}
{{< card link="multi-language" title="多语言" icon="translate" >}}
{{< card link="customization" title="自定义" icon="pencil" >}}
{{< card link="comments" title="评论系统" icon="chat-alt" >}}
{{< /cards >}}

39
exampleSite/content/docs/advanced/comments.fa.md
View File

@ -1,39 +0,0 @@
---
title: سیستم نظردهی
linkTitle: نظردهی
---
هگزترا از افزودن سیستم نظردهی به سایت شما پشتیبانی می‌کند.
در حال حاضر [giscus](https://giscus.app/) پشتیبانی می‌شود.
<!--more-->
## giscus
[giscus](https://giscus.app/) یک سیستم نظردهی است که توسط [GitHub Discussions](https://docs.github.com/en/discussions) طراحی شده است. رایگان و متن باز است.
برای فعال کردن giscus، باید موارد زیر را به پرونده پیکربندی سایت اضافه کنید:
```yaml {filename="hugo.yaml"}
params:
comments:
enable: false
type: giscus
giscus:
repo: <repository>
repoId: <repository ID>
category: <category>
categoryId: <category ID>
```
تنظیمات giscus را می توانید از وب‌سایت [giscus.app](https://giscus.app/) ساخت. جزئیات بیشتر را نیز می‌توانید در آنجا ببینید.
دیدگاه‌ها را می‌توانید برای یک صفحه خاص در بالای همان صفحه فعال یا غیرفعال کرد:
```yaml {filename="content/docs/about.md"}
---
title: درباره ما
comments: true
---
```

39
exampleSite/content/docs/advanced/comments.ja.md
View File

@ -1,39 +0,0 @@
---
title: コメントシステム
linkTitle: コメント
---
Hextraは、サイトにコメントシステムを追加することをサポートしています。
現在、[giscus](https://giscus.app/)がサポートされています。
<!--more-->
## giscus
[giscus](https://giscus.app/)は、[GitHub Discussions](https://docs.github.com/ja/discussions)を利用したコメントシステムです。無料でオープンソースです。
giscusを有効にするには、サイトの設定ファイルに以下を追加する必要があります：
```yaml {filename="hugo.yaml"}
params:
comments:
enable: false
type: giscus
giscus:
repo: <リポジトリ>
repoId: <リポジトリID>
category: <カテゴリ>
categoryId: <カテゴリID>
```
giscusの設定は、[giscus.app](https://giscus.app/)のウェブサイトから構築できます。詳細もそこで確認できます。
特定のページでコメントを有効または無効にするには、ページのフロントマターに以下を追加します：
```yaml {filename="content/docs/about.md"}
---
title: について
comments: true
---
```

39
exampleSite/content/docs/advanced/comments.md
View File

@ -1,39 +0,0 @@
---
title: Comments System
linkTitle: Comments
---
Hextra supports adding comments system to your site.
Currently [giscus](https://giscus.app/) is supported.
<!--more-->
## giscus
[giscus](https://giscus.app/) is a comments system powered by [GitHub Discussions](https://docs.github.com/en/discussions). It is free and open source.
To enable giscus, you need to add the following to the site configuration file:
```yaml {filename="hugo.yaml"}
params:
comments:
enable: false
type: giscus
giscus:
repo: <repository>
repoId: <repository ID>
category: <category>
categoryId: <category ID>
```
The giscus configurations can be constructed from the [giscus.app](https://giscus.app/) website. More details can also be found there.
Comments can be enabled or disabled for a specific page in the page front matter:
```yaml {filename="content/docs/about.md"}
---
title: About
comments: true
---
```

39
exampleSite/content/docs/advanced/comments.zh-cn.md
View File

@ -1,39 +0,0 @@
---
title: 评论系统
linkTitle: 评论
---
Hextra 支持为您的网站添加评论系统。
目前支持 [giscus](https://giscus.app/)。
<!--more-->
## giscus
[giscus](https://giscus.app/) 是一个由 [GitHub Discussions](https://docs.github.com/en/discussions) 提供支持的评论系统。它是免费且开源的。
要启用 giscus，您需要在网站配置文件中添加以下内容：
```yaml {filename="hugo.yaml"}
params:
comments:
enable: false
type: giscus
giscus:
repo: <仓库>
repoId: <仓库 ID>
category: <分类>
categoryId: <分类 ID>
```
giscus 的配置可以从 [giscus.app](https://giscus.app/) 网站生成。更多详细信息也可以在那里找到。
可以在页面的 front matter 中为特定页面启用或禁用评论：
```yaml {filename="content/docs/about.md"}
---
title: 关于
comments: true
---
```

73
exampleSite/content/docs/advanced/customization.fa.md
View File

@ -1,73 +0,0 @@
---
title: سفارشی‌سازی هگزترا
linkTitle: سفارشی‌سازی
---
هگزترا برخی از گزینه‌های سفارشی‌سازی پیش‌فرض را در پرونده `hugo.yaml` برای پیکربندی تم ارائه می‌کند.
این صفحه گزینه‌های موجود و نحوه سفارشی‌سازی بیشتر تم را توضیح می‌دهد.
<!--more-->
## CSS سفارشی
برای افزودن CSS سفارشی، باید یک پرونده `assets/css/custom.css` در سایت خود ایجاد کنیم. هگزترا به طور خودکار این پرونده را بارگیری خواهد کرد.
### خانواده فونت
خانواده فونت برای محتوا را می‌توانید با استفاده از این سفارشی کنید:
```css {filename="assets/css/custom.css"}
.content {
font-family: "Times New Roman", Times, serif;
}
```
### عنصر کد درون‌خطی
رنگ متن ترکیب شده با `متن دیگر` را می‌توانید با موارد زیر سفارشی کرد:
```css {filename="assets/css/custom.css"}
.content code:not(.code-block code) {
color: #c97c2e;
}
```
### رنگ اصلی
رنگ اصلی تم را می‌توانید با تنظیم متغیرهای `--primary-hue` و `--primary-saturation` سفارشی کرد:
```css {filename="assets/css/custom.css"}
:root {
--primary-hue: 100deg;
--primary-saturation: 90%;
}
```
### برجسته‌کردن سینتکس
فهرست تم‌های برجسته‌کردن سینتکس در دسترس [گالری Chroma Styles](https://xyproto.github.io/splash/docs/all.html) موجود است. شیوه‌نامه را می‌توانید با استفاده از دستور زیر تولید کرد:
```shell
hugo gen chromastyles --style=github
```
برای نادیده گرفتن طرح زمینه برجسته‌کردن سینتکس پیش‌فرض، می‌توانید استایل‌های تولید شده را به پرونده CSS سفارشی اضافه کنیم.
## اسکریپت‌های سفارشی
با افزودن پرونده زیر می‌توانید اسکریپت‌های سفارشی را برای هر صفحه به انتهای اون اضافه کنید:
```
layouts/partials/custom/head-end.html
```
## طرح‌بندی‌های سفارشی
با ایجاد پرونده‌ای با همین نام در دایرکتوری `layouts` سایت خود، می‌توانید طرح‌های تم را نادیده بگیرید.
به عنوان مثال، برای لغو طرح‌بندی `single.html` برای مستندات، یک پرونده`layouts/docs/single.html` در سایت خود ایجاد کنید.
برای اطلاعات بیشتر، به [Templateهای هیوگو](https://gohugo.io/templates/) مراجعه کنید.
## سفارشی‌سازی بیشتر
چیزی را که دنبالش بودید پیدا نکردید؟ با خیال راحت [بحثی را باز کنید](https://github.com/imfing/hextra/discussions) یا به موضوع کمک کنید!

211
exampleSite/content/docs/advanced/customization.ja.md
View File

@ -1,211 +0,0 @@
---
title: Hextraのカスタマイズ
linkTitle: カスタマイズ
---
Hextraは、`hugo.yaml`設定ファイル内でいくつかのデフォルトのカスタマイズオプションを提供し、テーマを設定できます。
このページでは、利用可能なオプションと、テーマをさらにカスタマイズする方法について説明します。
<!--more-->
## カスタムCSS
カスタムCSSを追加するには、サイト内に`assets/css/custom.css`ファイルを作成する必要があります。Hextraはこのファイルを自動的に読み込みます。
### フォントファミリー
コンテンツのフォントファミリーは、以下のようにカスタマイズできます：
```css {filename="assets/css/custom.css"}
.content {
font-family: "Times New Roman", Times, serif;
}
```
### インラインコード要素
`other text`と混在するテキストの色は、以下のようにカスタマイズできます：
```css {filename="assets/css/custom.css"}
.content code:not(.code-block code) {
color: #c97c2e;
}
```
### プライマリカラー
テーマのプライマリカラーは、`--primary-hue`、`--primary-saturation`、`--primary-lightness`変数を設定することでカスタマイズできます：
```css {filename="assets/css/custom.css"}
:root {
--primary-hue: 100deg;
--primary-saturation: 90%;
--primary-lightness: 50%;
}
```
### テーマのさらなるカスタマイズ
テーマは、公開されているCSSクラスを介してデフォルトのスタイルをオーバーライドすることでさらにカスタマイズできます。フッター要素をカスタマイズする例：
```css {filename="assets/css/custom.css"}
.hextra-footer {
/* フッター要素に適用されるスタイル */
}
.hextra-footer:is(html[class~="dark"] *) {
/* ダークモードでのフッター要素に適用されるスタイル */
}
```
以下のクラスを使用して、テーマのさまざまな部分をカスタマイズできます。
#### 一般
- `hextra-scrollbar` - スクロールバー要素
- `content` - ページコンテンツコンテナ
#### ショートコード
##### バッジ
- `hextra-badge` - バッジ要素
##### カード
- `hextra-card` - カード要素
- `hextra-card-image` - カード画像要素
- `hextra-card-icon` - カードアイコン要素
- `hextra-card-subtitle` - カードサブタイトル要素
##### カードグリッド
- `hextra-cards` - カードグリッドコンテナ
##### Jupyter Notebook
- `hextra-jupyter-code-cell` - Jupyterコードセルコンテナ
- `hextra-jupyter-code-cell-outputs-container` - Jupyterコードセル出力コンテナ
- `hextra-jupyter-code-cell-outputs` - Jupyterコードセル出力div要素
##### PDF
- `hextra-pdf` - PDFコンテナ要素
##### ステップ
- `steps` - ステップコンテナ
##### タブ
- `hextra-tabs-panel` - タブパネルコンテナ
- `hextra-tabs-toggle` - タブトグルボタン
##### ファイルツリー
- `hextra-filetree` - ファイルツリーコンテナ
##### フォルダ
- `hextra-filetree-folder` - ファイルツリーフォルダコンテナ
#### ナビゲーションバー
- `nav-container` - ナビゲーションバーコンテナ
- `nav-container-blur` - ナビゲーションバーコンテナのぼかし要素
- `hamburger-menu` - ハンバーガーメニューボタン
#### フッター
- `hextra-footer` - フッター要素
- `hextra-custom-footer` - カスタムフッターセクションコンテナ
#### 検索
- `search-wrapper` - 検索ラッパーコンテナ
- `search-input` - 検索入力要素
- `search-results` - 検索結果リストコンテナ
#### 目次
- `hextra-toc` - 目次コンテナ
#### サイドバー
- `mobile-menu-overlay` - モバイルメニューのオーバーレイ要素
- `sidebar-container` - サイドバーコンテナ
- `sidebar-active-item` - サイドバーのアクティブアイテム
#### 言語スイッチャー
- `language-switcher` - 言語スイッチャーボタン
- `language-options` - 言語オプションコンテナ
#### テーマトグル
- `theme-toggle` - テーマトグルボタン
#### コードコピーボタン
- `hextra-code-copy-btn-container` - コードコピーボタンコンテナ
- `hextra-code-copy-btn` - コードコピーボタン
#### コードブロック
- `hextra-code-block` - コードブロックコンテナ
#### フィーチャーカード
- `hextra-feature-card` - フィーチャーカードリンク要素
#### フィーチャーグリッド
- `hextra-feature-grid` - フィーチャーグリッドコンテナ
#### パンくずリスト
パンくずリスト用の特定のクラスはありません。
### シンタックスハイライト
利用可能なシンタックスハイライトテーマのリストは、[Chroma Styles Gallery](https://xyproto.github.io/splash/docs/all.html)で確認できます。スタイルシートは以下のコマンドで生成できます：
```shell
hugo gen chromastyles --style=github
```
デフォルトのシンタックスハイライトテーマをオーバーライドするには、生成されたスタイルをカスタムCSSファイルに追加します。
## カスタムスクリプト
すべてのページのheadの最後にカスタムスクリプトを追加するには、以下のファイルを追加します：
```
layouts/partials/custom/head-end.html
```
## フッターのカスタムセクション
フッターに追加のセクションを追加するには、サイト内に`layouts/partials/custom/footer.html`ファイルを作成します。
```html {filename="layouts/partials/custom/footer.html"}
<!-- ここにフッター要素を追加 -->
```
追加されたセクションは、フッターの著作権セクションの前に追加されます。
[HTML](https://developer.mozilla.org/ja/docs/Web/HTML)と[Hugoテンプレート構文](https://gohugo.io/templates/)を使用して、独自のコンテンツを追加できます。
フッターセクションで利用可能なHugo変数は、`.switchesVisible`と`.copyrightVisible`です。
## カスタムレイアウト
テーマのレイアウトは、サイトの`layouts`ディレクトリ内に同じ名前のファイルを作成することでオーバーライドできます。
例えば、ドキュメント用の`single.html`レイアウトをオーバーライドするには、サイト内に`layouts/docs/single.html`ファイルを作成します。
詳細については、[Hugoテンプレート][hugo-template-docs]を参照してください。
## さらなるカスタマイズ
探しているものが見つかりませんでしたか？[ディスカッションを開く](https://github.com/imfing/hextra/discussions)か、テーマに貢献してください！
[hugo-template-docs]: https://gohugo.io/templates/

211
exampleSite/content/docs/advanced/customization.md
View File

@ -1,211 +0,0 @@
---
title: Customizing Hextra
linkTitle: Customization
---
Hextra offers some default customization options in the `hugo.yaml` config file to configure the theme.
This page describes the available options and how to customize the theme further.
<!--more-->
## Custom CSS
To add custom CSS, we need to create a file `assets/css/custom.css` in our site. Hextra will automatically load this file.
### Font Family
The font family of the content can be customized using:
```css {filename="assets/css/custom.css"}
.content {
font-family: "Times New Roman", Times, serif;
}
```
### Inline Code Element
The color of text mixed with `other text` can customized with:
```css {filename="assets/css/custom.css"}
.content code:not(.code-block code) {
color: #c97c2e;
}
```
### Primary Color
The primary color of the theme can be customized by setting the `--primary-hue`, `--primary-saturation` and `--primary-lightness` variables:
```css {filename="assets/css/custom.css"}
:root {
--primary-hue: 100deg;
--primary-saturation: 90%;
--primary-lightness: 50%;
}
```
### Further Theme Customization
The theme can be further customized by overriding the default styles via the exposed css classes. An example for customizing the footer element:
```css {filename="assets/css/custom.css"}
.hextra-footer {
/* Styles will be applied to the footer element */
}
.hextra-footer:is(html[class~="dark"] *) {
/* Styles will be applied to the footer element in dark mode */
}
```
The following classes can be used to customize various parts of the theme.
#### General
- `hextra-scrollbar` - The scrollbar element
- `content` - Page content container
#### Shortcodes
##### Badge
- `hextra-badge` - The badge element
##### Card
- `hextra-card` - The card element
- `hextra-card-image` - The card image element
- `hextra-card-icon` - The card icon element
- `hextra-card-subtitle` - The card subtitle element
##### Cards
- `hextra-cards` - The cards grid container
##### Jupyter Notebook
- `hextra-jupyter-code-cell` - The Jupyter code cell container
- `hextra-jupyter-code-cell-outputs-container` - The Jupyter code cell outputs container
- `hextra-jupyter-code-cell-outputs` - The Jupyter code cell output div element
##### PDF
- `hextra-pdf` - The PDF container element
##### Steps
- `steps` - The steps container
##### Tabs
- `hextra-tabs-panel` - The tabs panel container
- `hextra-tabs-toggle` - The tabs toggle button
##### Filetree
- `hextra-filetree` - The filetree container
##### Folder
- `hextra-filetree-folder` - The filetree folder container
#### Navbar
- `nav-container` - The navbar container
- `nav-container-blur` - The navbar container in blur element
- `hamburger-menu` - The hamburger menu button
#### Footer
- `hextra-footer` - The footer element
- `hextra-custom-footer` - The custom footer section container
#### Search
- `search-wrapper` - The search wrapper container
- `search-input` - The search input element
- `search-results` - The search results list container
#### Table of Contents
- `hextra-toc` - The table of contents container
#### Sidebar
- `mobile-menu-overlay` - The overlay element for the mobile menu
- `sidebar-container` - The sidebar container
- `sidebar-active-item` - The active item in the sidebar
#### Language Switcher
- `language-switcher` - The language switcher button
- `language-options` - The language options container
#### Theme Toggle
- `theme-toggle` - The theme toggle button
#### Cody Copy Button
- `hextra-code-copy-btn-container` - The code copy button container
- `hextra-code-copy-btn` - The code copy button
#### Code Block
- `hextra-code-block` - The code block container
#### Feature Card
- `hextra-feature-card` - The feature card link element
#### Feature Grid
- `hextra-feature-grid` - The feature grid container
#### Breadcrumbs
No specific class is available for breadcrumbs.
### Syntax Highlighting
List of available syntax highlighting themes are available at [Chroma Styles Gallery](https://xyproto.github.io/splash/docs/all.html). The stylesheet can be generated using the command:
```shell
hugo gen chromastyles --style=github
```
To override the default syntax highlighting theme, we can add the generated styles to the custom CSS file.
## Custom Scripts
You may add custom scripts to the end of the head for every page by adding the following file:
```
layouts/partials/custom/head-end.html
```
## Custom Extra Section in Footer
You can add extra section in the footer by creating a file `layouts/partials/custom/footer.html` in your site.
```html {filename="layouts/partials/custom/footer.html"}
<!-- Your footer element here -->
```
The added section will be added before the copyright section in the footer.
You can use [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) and [Hugo template syntax](https://gohugo.io/templates/) to add your own content.
Hugo variables available in the footer section are: `.switchesVisible` and `.displayCopyright`.
## Custom Layouts
The layouts of the theme can be overridden by creating a file with the same name in the `layouts` directory of your site.
For example, to override the `single.html` layout for docs, create a file `layouts/docs/single.html` in your site.
For further information, refer to the [Hugo Templates][hugo-template-docs].
## Further Customization
Didn't find what you were looking for? Feel free to [open a discussion](https://github.com/imfing/hextra/discussions) or make a contribution to the theme!
[hugo-template-docs]: https://gohugo.io/templates/

211
exampleSite/content/docs/advanced/customization.zh-cn.md
View File

@ -1,211 +0,0 @@
---
title: 自定义 Hextra
linkTitle: 自定义
---
Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，用于配置主题。
本页描述了可用的选项以及如何进一步自定义主题。
<!--more-->
## 自定义 CSS
要添加自定义 CSS，我们需要在站点中创建一个文件 `assets/css/custom.css`。Hextra 会自动加载此文件。
### 字体
内容的字体可以通过以下方式自定义：
```css {filename="assets/css/custom.css"}
.content {
font-family: "Times New Roman", Times, serif;
}
```
### 内联代码元素
与 `其他文本` 混合的文本颜色可以通过以下方式自定义：
```css {filename="assets/css/custom.css"}
.content code:not(.code-block code) {
color: #c97c2e;
}
```
### 主色调
主题的主色调可以通过设置 `--primary-hue`、`--primary-saturation` 和 `--primary-lightness` 变量来自定义：
```css {filename="assets/css/custom.css"}
:root {
--primary-hue: 100deg;
--primary-saturation: 90%;
--primary-lightness: 50%;
}
```
### 进一步的主题自定义
可以通过覆盖暴露的 CSS 类来进一步自定义主题。以下是一个自定义页脚元素的示例：
```css {filename="assets/css/custom.css"}
.hextra-footer {
/* 样式将应用于页脚元素 */
}
.hextra-footer:is(html[class~="dark"] *) {
/* 样式将应用于暗模式下的页脚元素 */
}
```
以下类可用于自定义主题的各个部分。
#### 通用
- `hextra-scrollbar` - 滚动条元素
- `content` - 页面内容容器
#### 短代码
##### 徽章
- `hextra-badge` - 徽章元素
##### 卡片
- `hextra-card` - 卡片元素
- `hextra-card-image` - 卡片图片元素
- `hextra-card-icon` - 卡片图标元素
- `hextra-card-subtitle` - 卡片副标题元素
##### 卡片组
- `hextra-cards` - 卡片网格容器
##### Jupyter Notebook
- `hextra-jupyter-code-cell` - Jupyter 代码单元容器
- `hextra-jupyter-code-cell-outputs-container` - Jupyter 代码单元输出容器
- `hextra-jupyter-code-cell-outputs` - Jupyter 代码单元输出 div 元素
##### PDF
- `hextra-pdf` - PDF 容器元素
##### 步骤
- `steps` - 步骤容器
##### 标签页
- `hextra-tabs-panel` - 标签页面板容器
- `hextra-tabs-toggle` - 标签页切换按钮
##### 文件树
- `hextra-filetree` - 文件树容器
##### 文件夹
- `hextra-filetree-folder` - 文件树文件夹容器
#### 导航栏
- `nav-container` - 导航栏容器
- `nav-container-blur` - 导航栏模糊元素
- `hamburger-menu` - 汉堡菜单按钮
#### 页脚
- `hextra-footer` - 页脚元素
- `hextra-custom-footer` - 自定义页脚部分容器
#### 搜索
- `search-wrapper` - 搜索包装容器
- `search-input` - 搜索输入元素
- `search-results` - 搜索结果列表容器
#### 目录
- `hextra-toc` - 目录容器
#### 侧边栏
- `mobile-menu-overlay` - 移动菜单的覆盖元素
- `sidebar-container` - 侧边栏容器
- `sidebar-active-item` - 侧边栏中的活动项
#### 语言切换器
- `language-switcher` - 语言切换按钮
- `language-options` - 语言选项容器
#### 主题切换
- `theme-toggle` - 主题切换按钮
#### 代码复制按钮
- `hextra-code-copy-btn-container` - 代码复制按钮容器
- `hextra-code-copy-btn` - 代码复制按钮
#### 代码块
- `hextra-code-block` - 代码块容器
#### 功能卡片
- `hextra-feature-card` - 功能卡片链接元素
#### 功能网格
- `hextra-feature-grid` - 功能网格容器
#### 面包屑导航
面包屑导航没有特定的类。
### 语法高亮
可用的语法高亮主题列表可在 [Chroma 样式库](https://xyproto.github.io/splash/docs/all.html) 中找到。可以使用以下命令生成样式表：
```shell
hugo gen chromastyles --style=github
```
要覆盖默认的语法高亮主题，可以将生成的样式添加到自定义 CSS 文件中。
## 自定义脚本
你可以通过添加以下文件在每个页面的 head 末尾添加自定义脚本：
```
layouts/partials/custom/head-end.html
```
## 自定义页脚额外部分
你可以通过在站点中创建文件 `layouts/partials/custom/footer.html` 来在页脚中添加额外部分。
```html {filename="layouts/partials/custom/footer.html"}
<!-- 你的页脚元素在这里 -->
```
添加的部分将出现在页脚的版权部分之前。
你可以使用 [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) 和 [Hugo 模板语法](https://gohugo.io/templates/) 来添加自己的内容。
页脚部分可用的 Hugo 变量有：`.switchesVisible` 和 `.copyrightVisible`。
## 自定义布局
可以通过在站点的 `layouts` 目录中创建同名文件来覆盖主题的布局。
例如，要覆盖文档的 `single.html` 布局，可以在站点中创建文件 `layouts/docs/single.html`。
更多信息，请参阅 [Hugo 模板文档][hugo-template-docs]。
## 进一步自定义
没有找到你想要的？欢迎 [发起讨论](https://github.com/imfing/hextra/discussions) 或为主题做出贡献！
[hugo-template-docs]: https://gohugo.io/templates/

83
exampleSite/content/docs/advanced/multi-language.fa.md
View File

@ -1,83 +0,0 @@
---
title: "چند زبانه"
weight: 1
prev: /docs/advanced
---
هگزترا از ایجاد سایت با چندین زبان با استفاده از [حالت چند زبانه](https://gohugo.io/content-management/multilingual/) Hugo پشتیبانی می‌کند.
<!--more-->
## فعال‌سازی چند زبانه
برای اینکه سایت ما چند زبانه شود، باید زبان‌های پشتیبانی شده را به Hugo بگوییم. باید به پرونده پیکربندی سایت اضافه کنیم:
```yaml {filename="hugo.yaml"}
defaultContentLanguage: en
languages:
en:
languageName: English
weight: 1
fa:
languageName: فارسی
weight: 2
ja:
languageName: 日本語
weight: 3
```
## مدیریت ترجمه‌ها بر اساس نام پرونده
Hugo از مدیریت ترجمه با نام پرونده پشتیبانی می‌کند. به عنوان مثال، اگر یک پرونده `content/docs/_index.md` به زبان انگلیسی داشته باشیم، می توانیم یک پرونده `content/docs/_index.fa.md` برای ترجمه فارسی ایجاد کنیم.
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="_index.fa.md" >}}
{{< filetree/file name="_index.ja.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
توجه: Hugo همچنین از ت[ترجمه توسط دایرکتوری محتوا](https://gohugo.io/content-management/multilingual/#translation-by-content-directory) پشتیبانی می‌کند.
## ترجمه آیتم‌های منو
برای ترجمه آیتم‌های منو در نوار پیمایش، باید فیلد `identifier` را تنظیم کنیم:
```yaml {filename="hugo.yaml"}
menu:
main:
- identifier: documentation
name: Documentation
pageRef: /docs
weight: 1
- identifier: blog
name: Blog
pageRef: /blog
weight: 2
```
و آنها را در پرونده i18n مربوطه ترجمه کنید:
```yaml {filename="i18n/fa.yaml"}
documentation: مستندات
blog: وبلاگ
```
## ترجمه رشته‌ها
برای ترجمه رشته‌ها در مکان‌های دیگر، باید ترجمه را به پرونده i18n مربوطه اضافه کنیم:
```yaml {filename="i18n/fa.yaml"}
readMore: ادامه مطلب
```
فهرستی از رشته‌های استفاده شده در تم را می‌توان در پرونده `i18n/en.yaml` پیدا کرد.
## بیشتر بخوانید
- [حالت چند زبانه هیوگو](https://gohugo.io/content-management/multilingual/)
- [هیوگو چند زبانه قسمت ۱: ترجمه محتوا](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-1-managing-content-translation/)
- [هیوگو چند زبانه قسمت ۲: بومی‌سازی رشته‌ها](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-2-i18n-string-localization/)

83
exampleSite/content/docs/advanced/multi-language.ja.md
View File

@ -1,83 +0,0 @@
---
title: "多言語対応"
weight: 1
prev: /docs/advanced
---
Hextraは、Hugoの[多言語モード](https://gohugo.io/content-management/multilingual/)を使用して、複数の言語でサイトを作成することをサポートしています。
<!--more-->
## 多言語対応を有効にする
サイトを多言語対応にするためには、Hugoにサポートする言語を伝える必要があります。サイトの設定ファイルに以下を追加します：
```yaml {filename="hugo.yaml"}
defaultContentLanguage: en
languages:
en:
languageName: English
weight: 1
fr:
languageName: Français
weight: 2
ja:
languageName: 日本語
weight: 3
```
## ファイル名による翻訳管理
Hugoは、ファイル名による翻訳管理をサポートしています。例えば、英語のファイル `content/docs/_index.md` がある場合、フランス語の翻訳用に `content/docs/_index.fr.md` というファイルを作成できます。
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="_index.fr.md" >}}
{{< filetree/file name="_index.ja.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
注: Hugoは[コンテンツディレクトリによる翻訳](https://gohugo.io/content-management/multilingual/#translation-by-content-directory)もサポートしています。
## メニュー項目の翻訳
ナビゲーションバーのメニュー項目を翻訳するには、`identifier` フィールドを設定する必要があります：
```yaml {filename="hugo.yaml"}
menu:
main:
- identifier: documentation
name: Documentation
pageRef: /docs
weight: 1
- identifier: blog
name: Blog
pageRef: /blog
weight: 2
```
そして、対応するi18nファイルで翻訳します：
```yaml {filename="i18n/fr.yaml"}
documentation: Documentation
blog: Blog
```
## 文字列の翻訳
他の場所の文字列を翻訳するには、対応するi18nファイルに翻訳を追加する必要があります：
```yaml {filename="i18n/fr.yaml"}
readMore: Lire la suite
```
テーマで使用されている文字列のリストは、`i18n/en.yaml` ファイルにあります。
## さらに詳しく
- [Hugo 多言語モード](https://gohugo.io/content-management/multilingual/)
- [Hugo 多言語 Part 1: コンテンツ翻訳](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-1-managing-content-translation/)
- [Hugo 多言語 Part 2: 文字列のローカライズ](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-2-i18n-string-localization/)

83
exampleSite/content/docs/advanced/multi-language.md
View File

@ -1,83 +0,0 @@
---
title: "Multi-language"
weight: 1
prev: /docs/advanced
---
Hextra supports creating site with multiple languages using Hugo's [multilingual mode](https://gohugo.io/content-management/multilingual/).
<!--more-->
## Enable Multi-language
To make our site multi-language, we need to tell Hugo the supported languages. We need to add to the site configuration file:
```yaml {filename="hugo.yaml"}
defaultContentLanguage: en
languages:
en:
languageName: English
weight: 1
fr:
languageName: Français
weight: 2
ja:
languageName: 日本語
weight: 3
```
## Manage Translations by Filename
Hugo supports managing translations by filename. For example, if we have a file `content/docs/_index.md` in English, we can create a file `content/docs/_index.fr.md` for French translation.
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="_index.fr.md" >}}
{{< filetree/file name="_index.ja.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
Note: Hugo also supports [Translation by content directory](https://gohugo.io/content-management/multilingual/#translation-by-content-directory).
## Translate Menu Items
To translate menu items in the navigation bar, we need to set the `identifier` field:
```yaml {filename="hugo.yaml"}
menu:
main:
- identifier: documentation
name: Documentation
pageRef: /docs
weight: 1
- identifier: blog
name: Blog
pageRef: /blog
weight: 2
```
and translate them in the corresponding i18n file:
```yaml {filename="i18n/fr.yaml"}
documentation: Documentation
blog: Blog
```
## Translate Strings
To translate strings on the other places, we need to add the translation to the corresponding i18n file:
```yaml {filename="i18n/fr.yaml"}
readMore: Lire la suite
```
A list of strings used in the theme can be found in the `i18n/en.yaml` file.
## Read More
- [Hugo Multilingual Mode](https://gohugo.io/content-management/multilingual/)
- [Hugo Multilingual Part 1: Content translation](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-1-managing-content-translation/)
- [Hugo Multilingual Part 2: Strings localization](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-2-i18n-string-localization/)

83
exampleSite/content/docs/advanced/multi-language.zh-cn.md
View File

@ -1,83 +0,0 @@
---
title: "多语言支持"
weight: 1
prev: /docs/advanced
---
Hextra 支持使用 Hugo 的[多语言模式](https://gohugo.io/content-management/multilingual/)创建多语言网站。
<!--more-->
## 启用多语言
要使我们的网站支持多语言，我们需要告诉 Hugo 支持的语言。我们需要在站点配置文件中添加：
```yaml {filename="hugo.yaml"}
defaultContentLanguage: en
languages:
en:
languageName: English
weight: 1
fr:
languageName: Français
weight: 2
ja:
languageName: 日本語
weight: 3
```
## 通过文件名管理翻译
Hugo 支持通过文件名管理翻译。例如，如果我们有一个英文文件 `content/docs/_index.md`，我们可以创建一个文件 `content/docs/_index.fr.md` 作为法语翻译。
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="_index.fr.md" >}}
{{< filetree/file name="_index.ja.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
注意：Hugo 还支持[通过内容目录进行翻译](https://gohugo.io/content-management/multilingual/#translation-by-content-directory)。
## 翻译菜单项
要翻译导航栏中的菜单项，我们需要设置 `identifier` 字段：
```yaml {filename="hugo.yaml"}
menu:
main:
- identifier: documentation
name: Documentation
pageRef: /docs
weight: 1
- identifier: blog
name: Blog
pageRef: /blog
weight: 2
```
并在相应的 i18n 文件中进行翻译：
```yaml {filename="i18n/fr.yaml"}
documentation: Documentation
blog: Blog
```
## 翻译字符串
要翻译其他地方的字符串，我们需要将翻译添加到相应的 i18n 文件中：
```yaml {filename="i18n/fr.yaml"}
readMore: Lire la suite
```
主题中使用的字符串列表可以在 `i18n/en.yaml` 文件中找到。
## 了解更多
- [Hugo 多语言模式](https://gohugo.io/content-management/multilingual/)
- [Hugo 多语言第一部分：内容翻译](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-1-managing-content-translation/)
- [Hugo 多语言第二部分：字符串本地化](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-2-i18n-string-localization/)

190
exampleSite/content/docs/getting-started.fa.md
View File

@ -1,190 +0,0 @@
---
title: شروع کنید
weight: 1
next: /docs/guide
prev: /docs
---
## شروع سریع از طریق Template
{{< icon "github" >}}&nbsp;[imfing/hextra-starter-template](https://github.com/imfing/hextra-starter-template)
با استفاده از template در بالای صفحه‌ای مخزن می‌توانید به سرعت شروع به کار کنید.
<img src="https://docs.github.com/assets/cb-77734/mw-1440/images/help/repository/use-this-template-button.webp" width="500">
ما یک [گردش کاری GitHub Actions](https://docs.github.com/en/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site#publishing-with-a-custom-github-actions-workflow) ارائه کرده‌ایم که می‌تواند به ساخت و به‌کاراندازی خودکار سایت شما در گیت‌هاب Pages، برای میزبانی رایگان کمک کند. برای گزینه‌های بیشتر، [به‌کاراندازی سایت](../guide/deploy-site) را بررسی کنید.
[🌐 نسخه‌ي نمایشی ↖](https://imfing.github.io/hextra-starter-template/)
## شروع به عنوان پروژه جدید
دو راه اصلی برای اضافه کردن تم هگزترا به پروژه Hugo وجود دارد:
1. **ماژول‌های Hugo (توصیه می‌شود)**: ساده‌ترین و توصیه شده‌ترین. [ماژول‌های Hugo](https://gohugo.io/hugo-modules/) به شما امکان می‌دهند تم را مستقیما از منبع آنلاین آن وارد کنید. تم به صورت خودکار دانلود و توسط Hugo مدیریت می‌شود.
2. **ساب‌ماژول گیت**: در عوض، هگزترا را به عنوان یک [ساب‌ماژول گیت](https://git-scm.com/book/en/v2/Git-Tools-Submodules) اضافه کنید. تم توسط گیت دانلود شده و در پوشه `themes` پروژه شما ذخیره می‌شود.
### هگزترا را به عنوان ماژول Hugo راه‌اندازی کنید
#### پیش‌نیازها
قبل از شروع، باید این نرم‌افزارها را نصب کنید:
- [Hugo (extended version)](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
- [Go](https://go.dev/)
#### مراحل
{{% steps %}}
### راه‌انداختن یک سایت جدید Hugo
```shell
hugo new site my-site --format=yaml
```
### پیکربندی تم هگزترا از طریق ‌ماژول
```shell
# مقداردهی اولیه ماژول هیوگو
cd my-site
hugo mod init github.com/username/my-site
# افزودن تم هگزترا
hugo mod get github.com/imfing/hextra
```
با افزودن موارد زیر، `hugo.yaml` را برای استفاده از تم هگزترا پیکربندی کنید:
```yaml
module:
imports:
- path: github.com/imfing/hextra
```
### اولین صفحه‌های محتوای خود را ایجاد کنید
ایجاد صفحه محتوای جدید برای صفحه اصلی و صفحه مستندات:
```shell
hugo new content/_index.md
hugo new content/docs/_index.md
```
### پیش‌نمایش سایت به صورت محلی
```shell
hugo server --buildDrafts --disableFastRender
```
پیش‌نمایش سایت جدید شما در `http://localhost:1313/` در دسترس است.
{{% /steps %}}
{{% details title="چگونه تم را به‌روز کنیم؟" %}}
برای به‌روزرسانی همه ماژول‌های Hugo در پروژه خود به آخرین نسخه‌هایشان، دستور زیر را اجرا کنید:
```shell
hugo mod get -u
```
برای به‌روزرسانی هگزترا به [آخرین نسخه منتشر شده](https://github.com/imfing/hextra/releases)، دستور زیر را اجرا کنید:
```shell
hugo mod get -u github.com/imfing/hextra
```
برای جزئیات بیشتر به [ماژول‌های هیوگو](https://gohugo.io/hugo-modules/use-modules/#update-all-modules) مراجعه کنید.
{{% /details %}}
### هگزترا را به عنوان ساب‌ماژول Git راه‌اندازی کنید
#### پیش‌نیازها
قبل از شروع، باید این نرم‌افزارها را نصب کنید:
- [Hugo (extended version)](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
#### مراحل
{{% steps %}}
### راه‌انداختن یک سایت جدید Hugo
```shell
hugo new site my-site --format=yaml
```
### افزودن تم هگزترا به عنوان یک ساب‌ماژول Git
```shell
git submodule add https://github.com/imfing/hextra.git themes/hextra
```
با افزودن موارد زیر، `hugo.yaml` را برای استفاده از تم هگزترا پیکربندی کنید:
```yaml
theme: hextra
```
### اولین صفحه‌های محتوای خود را ایجاد کنید
ایجاد صفحه محتوای جدید برای صفحه اصلی و صفحه مستندات:
```shell
hugo new content/_index.md
hugo new content/docs/_index.md
```
### پیش‌نمایش سایت به صورت محلی
```shell
hugo server --buildDrafts --disableFastRender
```
پیش‌نمایش سایت جدید شما در `http://localhost:1313/` در دسترس است.
{{% /steps %}}
هنگام استفاده از [CI/CD](https://en.wikipedia.org/wiki/CI/CD) برای به‌کاراندازی وب‌سایت Hugo، از اجرای دستور زیر قبل از اجرای دستور `hugo` مطمئن شوید و ضروری است.
```shell
git submodule update --init
```
اجرا نشدن این دستور باعث می‌شود که پوشه تم با پرونده‌های تم هگزترا پر نشود و منجر به خرابی ساخت شود.
{{% details title="چگونه تم را به‌روز کنیم؟" %}}
برای به‌روزرسانی تمام ساب‌ماژول‌های در مخزن خود به آخرین commitها که موجود هست، دستور زیر را اجرا کنید:
```shell
git submodule update --remote
```
برای به‌روزرسانی هگزترا به آخرین commit، دستور زیر را اجرا کنید:
```shell
git submodule update --remote themes/hextra
```
برای جزئیات بیشتر به [ساب‌ماژول‌های Git](https://git-scm.com/book/en/v2/Git-Tools-Submodules) مراجعه کنید.
{{% /details %}}
## بعدی
برای شروع اضافه کردن مطالب بیشتر، بخش‌های زیر را کاوش کنید:
{{< cards >}}
{{< card link="../guide/organize-files" title="سازماندهی پرونده‌ها" icon="document-duplicate" >}}
{{< card link="../guide/configuration" title="پیکربندی" icon="adjustments" >}}
{{< card link="../guide/markdown" title="مارک‌داون" icon="markdown" >}}
{{< /cards >}}

192
exampleSite/content/docs/getting-started.ja.md
View File

@ -1,192 +0,0 @@
---
title: はじめに
weight: 1
next: /docs/guide
prev: /docs
---
## テンプレートからクイックスタート
{{< icon "github" >}}&nbsp;[imfing/hextra-starter-template](https://github.com/imfing/hextra-starter-template)
上記のテンプレートリポジトリを使用して、すぐに始めることができます。
<img src="https://docs.github.com/assets/cb-77734/mw-1440/images/help/repository/use-this-template-button.webp" width="500">
[GitHub Actionsワークフロー](https://docs.github.com/ja/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site#publishing-with-a-custom-github-actions-workflow)を提供しており、サイトを自動的にビルドしてGitHub Pagesにデプロイし、無料でホストすることができます。
その他のオプションについては、[サイトのデプロイ](../guide/deploy-site)を確認してください。
[🌐 デモ ↗](https://imfing.github.io/hextra-starter-template/)
## 新しいプロジェクトとして始める
HugoプロジェクトにHextraテーマを追加する主な方法は2つあります：
1. **Hugoモジュール（推奨）**: 最も簡単で推奨される方法です。[Hugoモジュール](https://gohugo.io/hugo-modules/)を使用すると、テーマを直接オンラインソースから取り込むことができます。テーマは自動的にダウンロードされ、Hugoによって管理されます。
2. **Gitサブモジュール**: または、Hextraを[Gitサブモジュール](https://git-scm.com/book/ja/v2/Git-%E3%83%84%E3%83%BC%E3%83%AB-%E3%82%B5%E3%83%96%E3%83%A2%E3%82%B8%E3%83%A5%E3%83%BC%E3%83%AB)として追加します。テーマはGitによってダウンロードされ、プロジェクトの`themes`フォルダに保存されます。
### HugoモジュールとしてHextraをセットアップ
#### 前提条件
開始する前に、以下のソフトウェアがインストールされている必要があります：
- [Hugo（拡張版）](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
- [Go](https://go.dev/)
#### 手順
{{% steps %}}
### 新しいHugoサイトを初期化
```shell
hugo new site my-site --format=yaml
```
### モジュール経由でHextraテーマを設定
```shell
# Hugoモジュールを初期化
cd my-site
hugo mod init github.com/username/my-site
# Hextraテーマを追加
hugo mod get github.com/imfing/hextra
```
`hugo.yaml`を設定してHextraテーマを使用するために、以下を追加します：
```yaml
module:
imports:
- path: github.com/imfing/hextra
```
### 最初のコンテンツページを作成
ホームページとドキュメントページの新しいコンテンツページを作成します：
```shell
hugo new content/_index.md
hugo new content/docs/_index.md
```
### ローカルでサイトをプレビュー
```shell
hugo server --buildDrafts --disableFastRender
```
これで、新しいサイトのプレビューが`http://localhost:1313/`で利用可能です。
{{% /steps %}}
{{% details title="テーマを更新するには？" %}}
プロジェクト内のすべてのHugoモジュールを最新バージョンに更新するには、次のコマンドを実行します：
```shell
hugo mod get -u
```
Hextraを[最新リリースバージョン](https://github.com/imfing/hextra/releases)に更新するには、次のコマンドを実行します：
```shell
hugo mod get -u github.com/imfing/hextra
```
詳細については、[Hugoモジュール](https://gohugo.io/hugo-modules/use-modules/#update-all-modules)を参照してください。
{{% /details %}}
### GitサブモジュールとしてHextraをセットアップ
#### 前提条件
開始する前に、以下のソフトウェアがインストールされている必要があります：
- [Hugo（拡張版）](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
#### 手順
{{% steps %}}
### 新しいHugoサイトを初期化
```shell
hugo new site my-site --format=yaml
```
### HextraテーマをGitサブモジュールとして追加
```shell
git submodule add https://github.com/imfing/hextra.git themes/hextra
```
`hugo.yaml`を設定してHextraテーマを使用するために、以下を追加します：
```yaml
theme: hextra
```
### 最初のコンテンツページを作成
ホームページとドキュメントページの新しいコンテンツページを作成します：
```shell
hugo new content/_index.md
hugo new content/docs/_index.md
```
### ローカルでサイトをプレビュー
```shell
hugo server --buildDrafts --disableFastRender
```
新しいサイトのプレビューが`http://localhost:1313/`で利用可能です。
{{% /steps %}}
[CI/CD](https://ja.wikipedia.org/wiki/CI/CD)を使用してHugoウェブサイトをデプロイする場合、`hugo`コマンドを実行する前に以下のコマンドを実行することが重要です。
```shell
git submodule update --init
```
このコマンドを実行しないと、テーマフォルダにHextraテーマファイルが取り込まれず、ビルドが失敗します。
{{% details title="テーマを更新するには？" %}}
リポジトリ内のすべてのサブモジュールを最新のコミットに更新するには、次のコマンドを実行します：
```shell
git submodule update --remote
```
Hextraを最新のコミットに更新するには、次のコマンドを実行します：
```shell
git submodule update --remote themes/hextra
```
詳細については、[Gitサブモジュール](https://git-scm.com/book/ja/v2/Git-%E3%83%84%E3%83%BC%E3%83%AB-%E3%82%B5%E3%83%96%E3%83%A2%E3%82%B8%E3%83%A5%E3%83%BC%E3%83%AB)を参照してください。
{{% /details %}}
## 次へ
以下のセクションを探索して、さらにコンテンツを追加し始めましょう：
{{< cards >}}
{{< card link="../guide/organize-files" title="ファイルの整理" icon="document-duplicate" >}}
{{< card link="../guide/configuration" title="設定" icon="adjustments" >}}
{{< card link="../guide/markdown" title="Markdown" icon="markdown" >}}
{{< /cards >}}

192
exampleSite/content/docs/getting-started.md
View File

@ -1,192 +0,0 @@
---
title: Getting Started
weight: 1
next: /docs/guide
prev: /docs
---
## Quick Start from Template
{{< icon "github" >}}&nbsp;[imfing/hextra-starter-template](https://github.com/imfing/hextra-starter-template)
You could quickly get started by using the above template repository.
<img src="https://docs.github.com/assets/cb-77734/mw-1440/images/help/repository/use-this-template-button.webp" width="500">
We have provided a [GitHub Actions workflow](https://docs.github.com/en/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site#publishing-with-a-custom-github-actions-workflow) which can help automatically build and deploy your site to GitHub Pages, and host it for free.
For more options, check out [Deploy Site](../guide/deploy-site).
[🌐 Demo ↗](https://imfing.github.io/hextra-starter-template/)
## Start as New Project
There are two main ways to add the Hextra theme to your Hugo project:
1. **Hugo Modules (Recommended)**: The simplest and recommended method. [Hugo modules](https://gohugo.io/hugo-modules/) let you pull in the theme directly from its online source. Theme is downloaded automatically and managed by Hugo.
2. **Git Submodule**: Alternatively, add Hextra as a [Git Submodule](https://git-scm.com/book/en/v2/Git-Tools-Submodules). The theme is downloaded by Git and stored in your project's `themes` folder.
### Setup Hextra as Hugo module
#### Prerequisites
Before starting, you need to have the following software installed:
- [Hugo (extended version)](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
- [Go](https://go.dev/)
#### Steps
{{% steps %}}
### Initialize a new Hugo site
```shell
hugo new site my-site --format=yaml
```
### Configure Hextra theme via module
```shell
# initialize hugo module
cd my-site
hugo mod init github.com/username/my-site
# add Hextra theme
hugo mod get github.com/imfing/hextra
```
Configure `hugo.yaml` to use Hextra theme by adding the following:
```yaml
module:
imports:
- path: github.com/imfing/hextra
```
### Create your first content pages
Create new content page for the home page and the documentation page:
```shell
hugo new content/_index.md
hugo new content/docs/_index.md
```
### Preview the site locally
```shell
hugo server --buildDrafts --disableFastRender
```
Voila, your new site preview is available at `http://localhost:1313/`.
{{% /steps %}}
{{% details title="How to update theme?" %}}
To update all Hugo modules in your project to their latest versions, run the following command:
```shell
hugo mod get -u
```
To update Hextra to the [latest released version](https://github.com/imfing/hextra/releases), run the following command:
```shell
hugo mod get -u github.com/imfing/hextra
```
See [Hugo Modules](https://gohugo.io/hugo-modules/use-modules/#update-all-modules) for more details.
{{% /details %}}
### Setup Hextra as Git submodule
#### Prerequisites
Before starting, you need to have the following software installed:
- [Hugo (extended version)](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
#### Steps
{{% steps %}}
### Initialize a new Hugo site
```shell
hugo new site my-site --format=yaml
```
### Add Hextra theme as a Git submodule
```shell
git submodule add https://github.com/imfing/hextra.git themes/hextra
```
Configure `hugo.yaml` to use Hextra theme by adding the following:
```yaml
theme: hextra
```
### Create your first content pages
Create new content page for the home page and the documentation page:
```shell
hugo new content/_index.md
hugo new content/docs/_index.md
```
### Preview the site locally
```shell
hugo server --buildDrafts --disableFastRender
```
Your new site preview is available at `http://localhost:1313/`.
{{% /steps %}}
When using [CI/CD](https://en.wikipedia.org/wiki/CI/CD) for Hugo website deployment, it's essential to ensure that the following command is executed before running the `hugo` command.
```shell
git submodule update --init
```
Failure to run this command results in the theme folder not being populated with Hextra theme files, leading to a build failure.
{{% details title="How to update theme?" %}}
To update all submodules in your repository to their latest commits, run the following command:
```shell
git submodule update --remote
```
To update Hextra to the latest commit, run the following command:
```shell
git submodule update --remote themes/hextra
```
See [Git submodules](https://git-scm.com/book/en/v2/Git-Tools-Submodules) for more details.
{{% /details %}}
## Next
Explore the following sections to start adding more contents:
{{< cards >}}
{{< card link="../guide/organize-files" title="Organize Files" icon="document-duplicate" >}}
{{< card link="../guide/configuration" title="Configuration" icon="adjustments" >}}
{{< card link="../guide/markdown" title="Markdown" icon="markdown" >}}
{{< /cards >}}

192
exampleSite/content/docs/getting-started.zh-cn.md
View File

@ -1,192 +0,0 @@
---
title: 入门指南
weight: 1
next: /docs/guide
prev: /docs
---
## 从模板快速开始
{{< icon "github" >}}&nbsp;[imfing/hextra-starter-template](https://github.com/imfing/hextra-starter-template)
您可以通过使用上述模板仓库快速入门。
<img src="https://docs.github.com/assets/cb-77734/mw-1440/images/help/repository/use-this-template-button.webp" width="500">
我们提供了一个 [GitHub Actions 工作流](https://docs.github.com/en/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site#publishing-with-a-custom-github-actions-workflow)，可以帮助自动构建并将您的站点部署到 GitHub Pages，并免费托管。
更多选项，请查看 [部署站点](../guide/deploy-site)。
[🌐 演示 ↗](https://imfing.github.io/hextra-starter-template/)
## 作为新项目开始
有两种主要方式将 Hextra 主题添加到您的 Hugo 项目中：
1. **Hugo 模块（推荐）**：最简单且推荐的方法。[Hugo 模块](https://gohugo.io/hugo-modules/)允许您直接从在线源拉取主题。主题会自动下载并由 Hugo 管理。
2. **Git 子模块**：或者，将 Hextra 添加为 [Git 子模块](https://git-scm.com/book/en/v2/Git-Tools-Submodules)。主题由 Git 下载并存储在您项目的 `themes` 文件夹中。
### 将 Hextra 设置为 Hugo 模块
#### 先决条件
在开始之前，您需要安装以下软件：
- [Hugo（扩展版）](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
- [Go](https://go.dev/)
#### 步骤
{{% steps %}}
### 初始化一个新的 Hugo 站点
```shell
hugo new site my-site --format=yaml
```
### 通过模块配置 Hextra 主题
```shell
# 初始化 Hugo 模块
cd my-site
hugo mod init github.com/username/my-site
# 添加 Hextra 主题
hugo mod get github.com/imfing/hextra
```
配置 `hugo.yaml` 以使用 Hextra 主题，添加以下内容：
```yaml
module:
imports:
- path: github.com/imfing/hextra
```
### 创建您的内容页面
为主页和文档页面创建新的内容页面：
```shell
hugo new content/_index.md
hugo new content/docs/_index.md
```
### 本地预览站点
```shell
hugo server --buildDrafts --disableFastRender
```
恭喜，您的新站点预览可在 `http://localhost:1313/` 查看。
{{% /steps %}}
{{% details title="如何更新主题？" %}}
要更新项目中所有 Hugo 模块到最新版本，请运行以下命令：
```shell
hugo mod get -u
```
要将 Hextra 更新到 [最新发布版本](https://github.com/imfing/hextra/releases)，请运行以下命令：
```shell
hugo mod get -u github.com/imfing/hextra
```
有关更多详细信息，请参阅 [Hugo 模块](https://gohugo.io/hugo-modules/use-modules/#update-all-modules)。
{{% /details %}}
### 将 Hextra 设置为 Git 子模块
#### 先决条件
在开始之前，您需要安装以下软件：
- [Hugo（扩展版）](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
#### 步骤
{{% steps %}}
### 初始化一个新的 Hugo 站点
```shell
hugo new site my-site --format=yaml
```
### 将 Hextra 主题添加为 Git 子模块
```shell
git submodule add https://github.com/imfing/hextra.git themes/hextra
```
配置 `hugo.yaml` 以使用 Hextra 主题，添加以下内容：
```yaml
theme: hextra
```
### 创建您的内容页面
为主页和文档页面创建新的内容页面：
```shell
hugo new content/_index.md
hugo new content/docs/_index.md
```
### 本地预览站点
```shell
hugo server --buildDrafts --disableFastRender
```
您的新站点预览可在 `http://localhost:1313/` 查看。
{{% /steps %}}
当使用 [CI/CD](https://en.wikipedia.org/wiki/CI/CD) 部署 Hugo 网站时，确保在运行 `hugo` 命令之前执行以下命令至关重要。
```shell
git submodule update --init
```
如果不运行此命令，主题文件夹将不会被 Hextra 主题文件填充，导致构建失败。
{{% details title="如何更新主题？" %}}
要更新仓库中所有子模块到最新提交，请运行以下命令：
```shell
git submodule update --remote
```
要将 Hextra 更新到最新提交，请运行以下命令：
```shell
git submodule update --remote themes/hextra
```
有关更多详细信息，请参阅 [Git 子模块](https://git-scm.com/book/en/v2/Git-Tools-Submodules)。
{{% /details %}}
## 下一步
探索以下部分以开始添加更多内容：
{{< cards >}}
{{< card link="../guide/organize-files" title="组织文件" icon="document-duplicate" >}}
{{< card link="../guide/configuration" title="配置" icon="adjustments" >}}
{{< card link="../guide/markdown" title="Markdown" icon="markdown" >}}
{{< /cards >}}

23
exampleSite/content/docs/guide/_index.fa.md
View File

@ -1,23 +0,0 @@
---
title: راهنما
weight: 2
prev: /docs/getting-started
next: /docs/guide/organize-files
sidebar:
open: true
---
برای یادگیری نحوه استفاده از هگزترا، بخش‌های زیر را کاوش کنید:
<!--more-->
{{< cards >}}
{{< card link="organize-files" title="سازماندهی پرونده‌ها" icon="document-duplicate" >}}
{{< card link="configuration" title="پیکربندی" icon="adjustments" >}}
{{< card link="markdown" title="مارک‌داون" icon="markdown" >}}
{{< card link="syntax-highlighting" title="برجسته‌کردن سینتکس" icon="sparkles" >}}
{{< card link="latex" title="LaTeX" icon="variable" >}}
{{< card link="diagrams" title="نمودارها" icon="chart-square-bar" >}}
{{< card link="shortcodes" title="کدهای کوتاه" icon="template" >}}
{{< card link="deploy-site" title="به‌کاراندازی سایت" icon="server" >}}
{{< /cards >}}

23
exampleSite/content/docs/guide/_index.ja.md
View File

@ -1,23 +0,0 @@
---
title: ガイド
weight: 2
prev: /docs/getting-started
next: /docs/guide/organize-files
sidebar:
open: true
---
Hextraの使い方を学ぶために、以下のセクションを探索してください:
<!--more-->
{{< cards >}}
{{< card link="organize-files" title="ファイルの整理" icon="document-duplicate" >}}
{{< card link="configuration" title="設定" icon="adjustments" >}}
{{< card link="markdown" title="Markdown" icon="markdown" >}}
{{< card link="syntax-highlighting" title="シンタックスハイライト" icon="sparkles" >}}
{{< card link="latex" title="LaTeX" icon="variable" >}}
{{< card link="diagrams" title="ダイアグラム" icon="chart-square-bar" >}}
{{< card link="shortcodes" title="ショートコード" icon="template" >}}
{{< card link="deploy-site" title="サイトのデプロイ" icon="server" >}}
{{< /cards >}}

23
exampleSite/content/docs/guide/_index.md
View File

@ -1,23 +0,0 @@
---
title: Guide
weight: 2
prev: /docs/getting-started
next: /docs/guide/organize-files
sidebar:
open: true
---
Explore the following sections to learn how to use Hextra:
<!--more-->
{{< cards >}}
{{< card link="organize-files" title="Organize Files" icon="document-duplicate" >}}
{{< card link="configuration" title="Configuration" icon="adjustments" >}}
{{< card link="markdown" title="Markdown" icon="markdown" >}}
{{< card link="syntax-highlighting" title="Syntax Highlighting" icon="sparkles" >}}
{{< card link="latex" title="LaTeX" icon="variable" >}}
{{< card link="diagrams" title="Diagrams" icon="chart-square-bar" >}}
{{< card link="shortcodes" title="Shortcodes" icon="template" >}}
{{< card link="deploy-site" title="Deploy Site" icon="server" >}}
{{< /cards >}}

23
exampleSite/content/docs/guide/_index.zh-cn.md
View File

@ -1,23 +0,0 @@
---
title: 指南
weight: 2
prev: /docs/getting-started
next: /docs/guide/organize-files
sidebar:
open: true
---
探索以下部分，了解如何使用 Hextra：
<!--more-->
{{< cards >}}
{{< card link="organize-files" title="文件组织" icon="document-duplicate" >}}
{{< card link="configuration" title="配置" icon="adjustments" >}}
{{< card link="markdown" title="Markdown" icon="markdown" >}}
{{< card link="syntax-highlighting" title="语法高亮" icon="sparkles" >}}
{{< card link="latex" title="LaTeX" icon="variable" >}}
{{< card link="diagrams" title="图表" icon="chart-square-bar" >}}
{{< card link="shortcodes" title="短代码" icon="template" >}}
{{< card link="deploy-site" title="部署站点" icon="server" >}}
{{< /cards >}}

271
exampleSite/content/docs/guide/configuration.fa.md
View File

@ -1,271 +0,0 @@
---
title: پیکربندی
weight: 2
---
Hugo پیکربندی خود را از `hugo.yaml` در ریشه سایت Hugo شما می‌خواند.
پرونده پیکربندی جایی است که می‌توانید تمام جنبه‌های سایت خود را پیکربندی کنید.
پرونده پیکربندی این سایت [`exampleSite/hugo.yaml`](https://github.com/imfing/hextra/blob/main/exampleSite/hugo.yaml) را در گیت‌هاب بررسی کنید تا ایده‌ای جامع از تنظیمات موجود و بهترین شیوه‌ها بدست آورید.
<!--more-->
## ناوبری
### منو
منوی سمت چپ بالا در قسمت `menu.main` در پرونده پیکربندی تعریف شده است:
```yaml {filename="hugo.yaml"}
menu:
main:
- name: مستندات
pageRef: /docs
weight: 1
- name: وبلاگ
pageRef: /blog
weight: 2
- name: درباره ما
pageRef: /about
weight: 3
- name: جستجو
weight: 4
params:
type: search
- name: گیت‌هاب
weight: 5
url: "https://github.com/imfing/hextra"
params:
icon: github
```
انواع مختلفی از آیتم‌های منو وجود دارد:
1. پیوند به صفحه‌ای در سایت با `pageRef`
```yaml
- name: مستندات
pageRef: /docs
```
2. پیوند به یک نشانی اینترنتی با `url`
```yaml
- name: گیت‌هاب
url: "https://github.com"
```
3. نوار جستجو با `type: search`
```yaml
- name: جستجو
params:
type: search
```
4. آیکون
```yaml
- name: گیت‌هاب
params:
icon: github
```
این آیتم‌های منو را می‌توانید با تنظیم پارامتر `weight` مرتب کنید.
### آرم و عنوان
برای تغییر آرم پیش‌فرض، `hugo.yaml` را ویرایش کنید و مسیر را به پرونده آرم خود در دایرکتوری `static` اضافه کنید.
به صورت اختیاری، می‌توانید پیوندی را که کاربران هنگام کلیک کردن روی آرم شما به آن هدایت می‌شوند، تغییر دهید، همچنین عرض و ارتفاع آرم را به پیکسل تنظیم کنید.
```yaml {filename="hugo.yaml"}
params:
navbar:
displayTitle: true
displayLogo: true
logo:
path: images/logo.svg
dark: images/logo-dark.svg
link: /
width: 40
height: 20
```
## نوار کناری
### نوار کناری اصلی
برای نوار کناری اصلی، به طور خودکار از ساختار دایرکتوری محتوا تولید می‌شود.
برای جزئیات بیشتر به صفحه [سازماندهی پرونده‌ها](/fa/docs/guide/organize-files) مراجعه کنید.
برای حذف یک صفحه از نوار کناری سمت راست، پارامتر`sidebar.exclude` را در قسمت بالایی صفحه تنظیم کنید:
```yaml {filename="content/docs/guide/configuration.md"}
---
title: پیکربندی
sidebar:
exclude: true
---
```
### پیوندهای اضافی
پیوندهای اضافی نوار کناری در زیر بخش `menu.sidebar` در پرونده پیکربندی تعریف شده است:
```yaml {filename="hugo.yaml"}
menu:
sidebar:
- name: بیشتر
params:
type: separator
weight: 1
- name: "درباره ما"
pageRef: "/about"
weight: 2
- name: "مستندات هیوگو ↖"
url: "https://gohugo.io/documentation/"
weight: 3
```
## نوار کناری سمت چپ
### فهرست مطالب
فهرست مطالب به طور خودکار از سرتیرهای موجود در پرونده محتوا تولید می‌شود. می‌توان آن را با تنظیم `toc: false` در قسمت بالایی صفحه غیرفعال کرد.
```yaml {filename="content/docs/guide/configuration.md"}
---
title: پیکربندی
toc: false
---
```
### پیوند ویرایش صفحه
برای پیکربندی پیوند ویرایش صفحه، می‌توانیم پارامتر `params.editURL.base` را در پرونده پیکربندی تنظیم کنیم:
```yaml {filename="hugo.yaml"}
params:
editURL:
enable: true
base: "https://github.com/your-username/your-repo/edit/main"
```
پیوندهای ویرایش به طور خودکار برای هر صفحه براساس نشانی اینترنتی ارائه شده به عنوان دایرکتوری ریشه ایجاد می‌شود.
اگر می‌خواهید پیوند ویرایش را برای یک صفحه خاص تنظیم کنید، می‌توانید پارامتر `editURL` را در قسمت بالای صفحه تنظیم کنید:
```yaml {filename="content/docs/guide/configuration.md"}
---
title: پیکربندی
editURL: "https://example.com/edit/this/page"
---
```
## پاورقی
### کپی‌رایت
برای تغییر متن کپی‌رایت نمایش داده شده در پاورقی وب‌سایت خود، باید پرونده‌ای به نام `i18n/fa.yaml` ایجاد کنید.
در این پرونده متن کپی‌رایت جدید خود را مطابق شکل زیر مشخص کنید:
```yaml {filename="i18n/fa.yaml"}
copyright: "© ۲۰۲۴ متن شما در اینجا"
```
برای مرجع شما، یک مثال [`i18n/en.yaml`](https://github.com/imfing/hextra/blob/main/i18n/en.yaml) را می‌توانید در مخزن گیت‌هاب پیدا کنید. علاوه بر این، می‌توانید از فرمت مارک‌داون در متن کپی‌رایت استفاده کنید.
## سایر موارد
### Favicon
برای سفارشی کردن [favicon](https://en.wikipedia.org/wiki/Favicon) برای سایت خود، پرونده‌های آیکون را درون پوشه `static` قرار دهید تا [faviconهای پیش‌فرض در تم](https://github.com/imfing/hextra/tree/main/static) جایگزین شود:
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
{{< filetree/file name="android-chrome-192x192.png" >}}
{{< filetree/file name="android-chrome-512x512.png" >}}
{{< filetree/file name="apple-touch-icon.png" >}}
{{< filetree/file name="favicon-16x16.png" >}}
{{< filetree/file name="favicon-32x32.png" >}}
{{< filetree/file name="favicon-dark.svg" >}}
{{< filetree/file name="favicon.ico" >}}
{{< filetree/file name="favicon.svg" >}}
{{< filetree/file name="site.webmanifest" >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
هر دو پرونده `favicon.ico` و `favicon.svg` را در پروژه خود قرار دهید، تا از نمایش صحیح faviconهای سایت خود مطمئن شوید.
در حالی که `favicon.ico` به طور کلی برای مرورگرهای قدیمی‌تر است، `favicon.svg` توسط مرورگرهای مدرن پشتیبانی می‌شود. favicon`favicon-dark.svg` اختیاری را می‌توانید برای یک تجربه سفارشی در حالت تیره اضافه کرد.
با خیال راحت از ابزارهایی مانند [favicon.io](https://favicon.io/) یا [favycon](https://github.com/ruisaraiva19/favycon) برای تولید این آیکون‌ها استفاده کنید.
### پیکربندی تم
از تنظیمات `theme` برای پیکربندی حالت پیش‌فرض تم و دکمه جابه‌جایی استفاده کنید و به بازدیدکنندگان اجازه دهید بین حالت روشن یا تیره جابجا شوند.
```yaml {filename="hugo.yaml"}
params:
theme:
# light | dark | system
default: system
displayToggle: true
```
گزینه‌های `theme.default`:
- `light` - همیشه از حالت روشن استفاده شود
- `dark` - همیشه از حالت تیره استفاده شود
- `system` - همگام‌سازی با تنظیمات سیستم‌عامل (پیش‌فرض)
پارامتر `theme.displayToggle` به شما این امکان را می‌دهد که یک دکمه جابجایی برای تغییر حالت تم‌ها نمایش دهید.
وقتی روی `true` تنظیم شود، بازدیدکنندگان می‌توانند بین حالت روشن یا تیره جابه‌جا شوند و تنظیمات پیش‌فرض را نادیده بگیرند.
### عرض صفحه
عرض صفحه را می‌توان با پارامتر `params.page.width` در پرونده پیکربندی سفارشی کرد:
```yaml {filename="hugo.yaml"}
params:
page:
# full (100%), wide (90rem), normal (1280px)
width: wide
```
سه گزینه در دسترس وجود دارد: `full`، `wide` و normal`. به طور پیش‌فرض، عرض صفحه روی normal` تنظیم شده است.
به طور مشابه، عرض نوار ناوبری و پاورقی را می‌توان با پارامترهای `params.navbar.width` و `params.footer.width` سفارشی کرد.
### فهرست جستجو
جستجوی متن کامل توسط [FlexSearch](https://github.com/nextapps-de/flexsearch) پیاده‌سازی شده و به طور پیش‌فرض فعال است.
برای سفارشی کردن فهرست جستجو، پارامتر `params.search.flexsearch.index` را در پرونده پیکربندی تنظیم کنید:
```yaml {filename="hugo.yaml"}
params:
# Search
search:
enable: true
type: flexsearch
flexsearch:
# index page by: content | summary | heading | title
index: content
```
گزینه‌های `flexsearch.index`:
- `content` - محتوای کامل صفحه (پیش‌فرض)
- `summary` - خلاصه صفحه، برای جزئیات بیشتر به [خلاصه مطالب Hugo](https://gohugo.io/content-management/summaries/) مراجعه کنید
- `heading` - سرتیترهای سطح ۱ و سطح ۲
- `title` - فقط شامل عنوان صفحه است
برای حذف یک صفحه از فهرست جستجو، `excludeSearch: true` را در قسمت بالای صفحه تنظیم کنید:
```yaml {filename="content/docs/guide/configuration.md"}
---
title: پیکربندی
excludeSearch: true
---
```
### گوگل آنالیتیکس
برای فعال کردن [گوگل آنالیتیکس](https://marketingplatform.google.com/about/analytics/)، پرچم `services.googleAnalytics.ID` را در `hugo.yaml` تنظیم کنید:
```yaml {filename="hugo.yaml"}
services:
googleAnalytics:
ID: G-MEASUREMENT_ID
```

288
exampleSite/content/docs/guide/configuration.ja.md
View File

@ -1,288 +0,0 @@
---
title: 設定
weight: 2
---
Hugoは、Hugoサイトのルートにある`hugo.yaml`から設定を読み取ります。
この設定ファイルでは、サイトのすべての側面を設定できます。
利用可能な設定とベストプラクティスの包括的な理解を得るために、GitHub上のこのサイトの設定ファイル[`exampleSite/hugo.yaml`](https://github.com/imfing/hextra/blob/main/exampleSite/hugo.yaml)をチェックしてください。
<!--more-->
## ナビゲーション
### メニュー
右上のメニューは、設定ファイルの`menu.main`セクションで定義されます：
```yaml {filename="hugo.yaml"}
menu:
main:
- name: ドキュメント
pageRef: /docs
weight: 1
- name: ブログ
pageRef: /blog
weight: 2
- name: について
pageRef: /about
weight: 3
- name: 検索
weight: 4
params:
type: search
- name: GitHub
weight: 5
url: "https://github.com/imfing/hextra"
params:
icon: github
```
メニュー項目にはさまざまなタイプがあります：
1. `pageRef`を使用してサイト内のページにリンク
```yaml
- name: ドキュメント
pageRef: /docs
```
2. `url`を使用して外部URLにリンク
```yaml
- name: GitHub
url: "https://github.com"
```
3. `type: search`を使用して検索バーを表示
```yaml
- name: 検索
params:
type: search
```
4. アイコン
```yaml
- name: GitHub
params:
icon: github
```
これらのメニュー項目は、`weight`パラメータを設定して並べ替えることができます。
### ロゴとタイトル
デフォルトのロゴを変更するには、`hugo.yaml`を編集し、`static`ディレクトリ下のロゴファイルへのパスを追加します。
オプションで、ロゴをクリックしたときにユーザーがリダイレクトされるリンクや、ロゴの幅と高さをピクセル単位で設定できます。
```yaml {filename="hugo.yaml"}
params:
navbar:
displayTitle: true
displayLogo: true
logo:
path: images/logo.svg
dark: images/logo-dark.svg
link: /
width: 40
height: 20
```
## サイドバー
### メインサイドバー
メインサイドバーは、コンテンツディレクトリの構造から自動的に生成されます。
詳細については、[ファイルの整理](/docs/guide/organize-files)ページを参照してください。
左サイドバーから単一のページを除外するには、ページのフロントマターで`sidebar.exclude`パラメータを設定します：
```yaml {filename="content/docs/guide/configuration.md"}
---
title: 設定
sidebar:
exclude: true
---
```
### 追加リンク
サイドバーの追加リンクは、設定ファイルの`menu.sidebar`セクションで定義されます：
```yaml {filename="hugo.yaml"}
menu:
sidebar:
- name: その他
params:
type: separator
weight: 1
- name: "について"
pageRef: "/about"
weight: 2
- name: "Hugo Docs ↗"
url: "https://gohugo.io/documentation/"
weight: 3
```
## 右サイドバー
### 目次
目次は、コンテンツファイルの見出しから自動的に生成されます。ページのフロントマターで`toc: false`を設定することで無効にできます。
```yaml {filename="content/docs/guide/configuration.md"}
---
title: 設定
toc: false
---
```
### ページ編集リンク
ページ編集リンクを設定するには、設定ファイルで`params.editURL.base`パラメータを設定します：
```yaml {filename="hugo.yaml"}
params:
editURL:
enable: true
base: "https://github.com/your-username/your-repo/edit/main"
```
提供されたURLをルートディレクトリとして、各ページの編集リンクが自動的に生成されます。
特定のページの編集リンクを設定したい場合は、ページのフロントマターで`editURL`パラメータを設定します：
```yaml {filename="content/docs/guide/configuration.md"}
---
title: 設定
editURL: "https://example.com/edit/this/page"
---
```
## フッター
### 著作権
ウェブサイトのフッターに表示される著作権テキストを変更するには、`i18n/en.yaml`という名前のファイルを作成します。
このファイルに、以下のように新しい著作権テキストを指定します：
```yaml {filename="i18n/en.yaml"}
copyright: "© 2024 YOUR TEXT HERE"
```
参考として、GitHubリポジトリに[`i18n/en.yaml`](https://github.com/imfing/hextra/blob/main/i18n/en.yaml)ファイルの例があります。また、著作権テキストにMarkdown形式を使用することもできます。
## その他
### ファビコン
サイトの[ファビコン](https://ja.wikipedia.org/wiki/Favicon)をカスタマイズするには、`static`フォルダ下にアイコンファイルを配置して、[テーマのデフォルトのファビコン](https://github.com/imfing/hextra/tree/main/static)を上書きします：
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
{{< filetree/file name="android-chrome-192x192.png" >}}
{{< filetree/file name="android-chrome-512x512.png" >}}
{{< filetree/file name="apple-touch-icon.png" >}}
{{< filetree/file name="favicon-16x16.png" >}}
{{< filetree/file name="favicon-32x32.png" >}}
{{< filetree/file name="favicon-dark.svg" >}}
{{< filetree/file name="favicon.ico" >}}
{{< filetree/file name="favicon.svg" >}}
{{< filetree/file name="site.webmanifest" >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
プロジェクトに`favicon.ico`、`favicon.svg`、`favicon-dark.svg`ファイルを含めて、サイトのファビコンが正しく表示されるようにします。
`favicon.ico`は一般的に古いブラウザ用ですが、`favicon.svg`と`favicon-dark.svg`は現代のブラウザでサポートされています。
[favicon.io](https://favicon.io/)や[favycon](https://github.com/ruisaraiva19/favycon)などのツールを使用して、このようなアイコンを生成できます。
### テーマ設定
`theme`設定を使用して、デフォルトのテーマモードとトグルボタンを設定し、訪問者がライトモードとダークモードを切り替えられるようにします。
```yaml {filename="hugo.yaml"}
params:
theme:
# light | dark | system
default: system
displayToggle: true
```
`theme.default`のオプション：
- `light` - 常にライトモードを使用
- `dark` - 常にダークモードを使用
- `system` - オペレーティングシステムの設定と同期（デフォルト）
`theme.displayToggle`パラメータを使用して、テーマを変更するためのトグルボタンを表示できます。
`true`に設定すると、訪問者はデフォルト設定を上書きしてライトモードとダークモードを切り替えることができます。
### ページ幅
ページの幅は、設定ファイルの`params.page.width`パラメータでカスタマイズできます：
```yaml {filename="hugo.yaml"}
params:
page:
# full (100%), wide (90rem), normal (1280px)
width: wide
```
利用可能なオプションは`full`、`wide`、`normal`です。デフォルトでは、ページ幅は`normal`に設定されています。
同様に、ナビゲーションバーとフッターの幅は、`params.navbar.width`と`params.footer.width`パラメータでカスタマイズできます。
### 検索インデックス
[FlexSearch](https://github.com/nextapps-de/flexsearch)による全文検索はデフォルトで有効です。
検索インデックスをカスタマイズするには、設定ファイルで`params.search.flexsearch.index`パラメータを設定します：
```yaml {filename="hugo.yaml"}
params:
# 検索
search:
enable: true
type: flexsearch
flexsearch:
# ページをインデックスする方法: content | summary | heading | title
index: content
```
`flexsearch.index`のオプション：
- `content` - ページの全内容（デフォルト）
- `summary` - ページの要約、詳細は[Hugoコンテンツ要約](https://gohugo.io/content-management/summaries/)を参照
- `heading` - レベル1とレベル2の見出し
- `title` - ページタイトルのみを含める
検索トークン化をカスタマイズするには、設定ファイルで`params.search.flexsearch.tokenize`パラメータを設定します：
```yaml {filename="hugo.yaml"}
params:
# ...
flexsearch:
# full | forward | reverse | strict
tokenize: forward
```
[`flexsearch.tokenize`](https://github.com/nextapps-de/flexsearch/#tokenizer-prefix-search)のオプション：
- `strict` - 単語全体をインデックス
- `forward` - 前方方向に単語を増分的にインデックス
- `reverse` - 両方向に単語を増分的にインデックス
- `full` - すべての可能な組み合わせをインデックス
検索インデックスからページを除外するには、ページのフロントマターで`excludeSearch: true`を設定します：
```yaml {filename="content/docs/guide/configuration.md"}
---
title: 設定
excludeSearch: true
---
```
### Googleアナリティクス
[Googleアナリティクス](https://marketingplatform.google.com/about/analytics/)を有効にするには、`hugo.yaml`で`services.googleAnalytics.ID`フラグを設定します：
```yaml {filename="hugo.yaml"}
services:
googleAnalytics:
ID: G-MEASUREMENT_ID
```

288
exampleSite/content/docs/guide/configuration.md
View File

@ -1,288 +0,0 @@
---
title: Configuration
weight: 2
---
Hugo reads its configuration from `hugo.yaml` in the root of your Hugo site.
The config file is where you can configure all aspects of your site.
Check out the config file for this site [`exampleSite/hugo.yaml`](https://github.com/imfing/hextra/blob/main/exampleSite/hugo.yaml) on GitHub to get a comprehensive idea of available settings and best practices.
<!--more-->
## Navigation
### Menu
Top right menu is defined under the `menu.main` section in the config file:
```yaml {filename="hugo.yaml"}
menu:
main:
- name: Documentation
pageRef: /docs
weight: 1
- name: Blog
pageRef: /blog
weight: 2
- name: About
pageRef: /about
weight: 3
- name: Search
weight: 4
params:
type: search
- name: GitHub
weight: 5
url: "https://github.com/imfing/hextra"
params:
icon: github
```
There are different types of menu items:
1. Link to a page in the site with `pageRef`
```yaml
- name: Documentation
pageRef: /docs
```
2. Link to an external URL with `url`
```yaml
- name: GitHub
url: "https://github.com"
```
3. Search bar with `type: search`
```yaml
- name: Search
params:
type: search
```
4. Icon
```yaml
- name: GitHub
params:
icon: github
```
These menu items can be sorted by setting the `weight` parameter.
### Logo and Title
To modify the default logo, edit `hugo.yaml` and add the path to your logo file under `static` directory.
Optionally, you can change the link that users are redirected to when clicking on your logo, as well as set the width & height of the logo in pixels.
```yaml {filename="hugo.yaml"}
params:
navbar:
displayTitle: true
displayLogo: true
logo:
path: images/logo.svg
dark: images/logo-dark.svg
link: /
width: 40
height: 20
```
## Sidebar
### Main Sidebar
For the main sidebar, it is automatically generated from the structure of the content directory.
See the [Organize Files](/docs/guide/organize-files) page for more details.
To exclude a single page from the left sidebar, set the `sidebar.exclude` parameter in the front matter of the page:
```yaml {filename="content/docs/guide/configuration.md"}
---
title: Configuration
sidebar:
exclude: true
---
```
### Extra Links
Sidebar extra links are defined under the `menu.sidebar` section in the config file:
```yaml {filename="hugo.yaml"}
menu:
sidebar:
- name: More
params:
type: separator
weight: 1
- name: "About"
pageRef: "/about"
weight: 2
- name: "Hugo Docs ↗"
url: "https://gohugo.io/documentation/"
weight: 3
```
## Right Sidebar
### Table of Contents
Table of contents is automatically generated from the headings in the content file. It can be disabled by setting `toc: false` in the front matter of the page.
```yaml {filename="content/docs/guide/configuration.md"}
---
title: Configuration
toc: false
---
```
### Page Edit Link
To configure the page edit link, we can set the `params.editURL.base` parameter in the config file:
```yaml {filename="hugo.yaml"}
params:
editURL:
enable: true
base: "https://github.com/your-username/your-repo/edit/main"
```
The edit links will be automatically generated for each page based on the provided url as root directory.
If you want to set edit link for a specific page, you can set the `editURL` parameter in the front matter of the page:
```yaml {filename="content/docs/guide/configuration.md"}
---
title: Configuration
editURL: "https://example.com/edit/this/page"
---
```
## Footer
### Copyright
To modify the copyright text displayed in your website's footer, you'll need to create a file named `i18n/en.yaml`.
In this file, specify your new copyright text as shown below:
```yaml {filename="i18n/en.yaml"}
copyright: "© 2024 YOUR TEXT HERE"
```
For your reference, an example [`i18n/en.yaml`](https://github.com/imfing/hextra/blob/main/i18n/en.yaml) file can be found in the GitHub repository. Additionally, you could use Markdown format in the copyright text.
## Others
### Favicon
To customize the [favicon](https://en.wikipedia.org/wiki/Favicon) for your site, place icon files under the `static` folder to override the [default favicons from the theme](https://github.com/imfing/hextra/tree/main/static):
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
{{< filetree/file name="android-chrome-192x192.png" >}}
{{< filetree/file name="android-chrome-512x512.png" >}}
{{< filetree/file name="apple-touch-icon.png" >}}
{{< filetree/file name="favicon-16x16.png" >}}
{{< filetree/file name="favicon-32x32.png" >}}
{{< filetree/file name="favicon-dark.svg" >}}
{{< filetree/file name="favicon.ico" >}}
{{< filetree/file name="favicon.svg" >}}
{{< filetree/file name="site.webmanifest" >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
Include `favicon.ico`, `favicon.svg` and `favicon-dark.svg` files in your project to ensure your site's favicons display correctly.
While `favicon.ico` is generally for older browsers, `favicon.svg` and `favicon-dark.svg` are supported by modern browsers.
Use tools like [favicon.io](https://favicon.io/) or [favycon](https://github.com/ruisaraiva19/favycon) to generate such icons.
### Theme Configuration
Use the `theme` setting to configure the default theme mode and toggle button, allowing visitors to switch between light or dark mode.
```yaml {filename="hugo.yaml"}
params:
theme:
# light | dark | system
default: system
displayToggle: true
```
Options for `theme.default`:
- `light` - always use light mode
- `dark` - always use dark mode
- `system` - sync with the operating system setting (default)
The `theme.displayToggle` parameter allows you to display a toggle button for changing themes.
When set to `true`, visitors can switch between light or dark mode, overriding the default setting.
### Page Width
The width of the page can be customized by the `params.page.width` parameter in the config file:
```yaml {filename="hugo.yaml"}
params:
page:
# full (100%), wide (90rem), normal (1280px)
width: wide
```
There are three available options: `full`, `wide`, and `normal`. By default, the page width is set to `normal`.
Similarly, the width of the navbar and footer can be customized by the `params.navbar.width` and `params.footer.width` parameters.
### Search Index
Full-text search powered by [FlexSearch](https://github.com/nextapps-de/flexsearch) is enabled by default.
To customize the search index, set the `params.search.flexsearch.index` parameter in the config file:
```yaml {filename="hugo.yaml"}
params:
# Search
search:
enable: true
type: flexsearch
flexsearch:
# index page by: content | summary | heading | title
index: content
```
Options for `flexsearch.index`:
- `content` - full content of the page (default)
- `summary` - summary of the page, see [Hugo Content Summaries](https://gohugo.io/content-management/summaries/) for more details
- `heading` - level 1 and level 2 headings
- `title` - only include the page title
To customize the search tokenize, set the `params.search.flexsearch.tokenize` parameter in the config file:
```yaml {filename="hugo.yaml"}
params:
# ...
flexsearch:
# full | forward | reverse | strict
tokenize: forward
```
Options for [`flexsearch.tokenize`](https://github.com/nextapps-de/flexsearch/#tokenizer-prefix-search):
- `strict` - index whole words
- `forward` - incrementally index words in forward direction
- `reverse` - incrementally index words in both directions
- `full` - index every possible combination
To exclude a page from the search index, set the `excludeSearch: true` in the front matter of the page:
```yaml {filename="content/docs/guide/configuration.md"}
---
title: Configuration
excludeSearch: true
---
```
### Google Analytics
To enable [Google Analytics](https://marketingplatform.google.com/about/analytics/), set `services.googleAnalytics.ID` flag in `hugo.yaml`:
```yaml {filename="hugo.yaml"}
services:
googleAnalytics:
ID: G-MEASUREMENT_ID
```

288
exampleSite/content/docs/guide/configuration.zh-cn.md
View File

@ -1,288 +0,0 @@
---
title: 配置
weight: 2
---
Hugo 从您 Hugo 站点根目录下的 `hugo.yaml` 文件中读取配置。
配置文件是您可以配置站点所有方面的地方。
查看此站点的配置文件 [`exampleSite/hugo.yaml`](https://github.com/imfing/hextra/blob/main/exampleSite/hugo.yaml) 在 GitHub 上，以全面了解可用的设置和最佳实践。
<!--more-->
## 导航
### 菜单
右上角的菜单在配置文件的 `menu.main` 部分中定义：
```yaml {filename="hugo.yaml"}
menu:
main:
- name: 文档
pageRef: /docs
weight: 1
- name: 博客
pageRef: /blog
weight: 2
- name: 关于
pageRef: /about
weight: 3
- name: 搜索
weight: 4
params:
type: search
- name: GitHub
weight: 5
url: "https://github.com/imfing/hextra"
params:
icon: github
```
有不同类型的菜单项：
1. 使用 `pageRef` 链接到站点内的页面
```yaml
- name: 文档
pageRef: /docs
```
2. 使用 `url` 链接到外部 URL
```yaml
- name: GitHub
url: "https://github.com"
```
3. 使用 `type: search` 的搜索栏
```yaml
- name: 搜索
params:
type: search
```
4. 图标
```yaml
- name: GitHub
params:
icon: github
```
这些菜单项可以通过设置 `weight` 参数进行排序。
### 徽标和标题
要修改默认徽标，编辑 `hugo.yaml` 并在 `static` 目录下添加徽标文件的路径。
您还可以更改用户点击徽标时重定向的链接，以及设置徽标的宽度和高度（以像素为单位）。
```yaml {filename="hugo.yaml"}
params:
navbar:
displayTitle: true
displayLogo: true
logo:
path: images/logo.svg
dark: images/logo-dark.svg
link: /
width: 40
height: 20
```
## 侧边栏
### 主侧边栏
主侧边栏是根据内容目录的结构自动生成的。
有关更多详细信息，请参阅 [组织文件](/docs/guide/organize-files) 页面。
要从左侧边栏中排除单个页面，请在页面的 front matter 中设置 `sidebar.exclude` 参数：
```yaml {filename="content/docs/guide/configuration.md"}
---
title: 配置
sidebar:
exclude: true
---
```
### 额外链接
侧边栏的额外链接在配置文件的 `menu.sidebar` 部分中定义：
```yaml {filename="hugo.yaml"}
menu:
sidebar:
- name: 更多
params:
type: separator
weight: 1
- name: "关于"
pageRef: "/about"
weight: 2
- name: "Hugo 文档 ↗"
url: "https://gohugo.io/documentation/"
weight: 3
```
## 右侧边栏
### 目录
目录是根据内容文件中的标题自动生成的。可以通过在页面的 front matter 中设置 `toc: false` 来禁用它。
```yaml {filename="content/docs/guide/configuration.md"}
---
title: 配置
toc: false
---
```
### 页面编辑链接
要配置页面编辑链接，我们可以在配置文件中设置 `params.editURL.base` 参数：
```yaml {filename="hugo.yaml"}
params:
editURL:
enable: true
base: "https://github.com/your-username/your-repo/edit/main"
```
编辑链接将根据提供的 URL 作为根目录自动为每个页面生成。
如果要为特定页面设置编辑链接，可以在页面的 front matter 中设置 `editURL` 参数：
```yaml {filename="content/docs/guide/configuration.md"}
---
title: 配置
editURL: "https://example.com/edit/this/page"
---
```
## 页脚
### 版权
要修改网站页脚中显示的版权文本，您需要创建一个名为 `i18n/en.yaml` 的文件。
在此文件中，指定您的新版权文本，如下所示：
```yaml {filename="i18n/en.yaml"}
copyright: "© 2024 您的文本"
```
作为参考，可以在 GitHub 仓库中找到示例 [`i18n/en.yaml`](https://github.com/imfing/hextra/blob/main/i18n/en.yaml) 文件。此外，您可以在版权文本中使用 Markdown 格式。
## 其他
### 网站图标
要为您的站点自定义 [网站图标](https://en.wikipedia.org/wiki/Favicon)，请将图标文件放在 `static` 文件夹下，以覆盖 [主题的默认网站图标](https://github.com/imfing/hextra/tree/main/static)：
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
{{< filetree/file name="android-chrome-192x192.png" >}}
{{< filetree/file name="android-chrome-512x512.png" >}}
{{< filetree/file name="apple-touch-icon.png" >}}
{{< filetree/file name="favicon-16x16.png" >}}
{{< filetree/file name="favicon-32x32.png" >}}
{{< filetree/file name="favicon-dark.svg" >}}
{{< filetree/file name="favicon.ico" >}}
{{< filetree/file name="favicon.svg" >}}
{{< filetree/file name="site.webmanifest" >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
在您的项目中包含 `favicon.ico`、`favicon.svg` 和 `favicon-dark.svg` 文件，以确保您的站点图标正确显示。
虽然 `favicon.ico` 通常用于旧版浏览器，但 `favicon.svg` 和 `favicon-dark.svg` 受现代浏览器支持。
使用 [favicon.io](https://favicon.io/) 或 [favycon](https://github.com/ruisaraiva19/favycon) 等工具生成此类图标。
### 主题配置
使用 `theme` 设置来配置默认主题模式和切换按钮，允许访问者在浅色或深色模式之间切换。
```yaml {filename="hugo.yaml"}
params:
theme:
# light | dark | system
default: system
displayToggle: true
```
`theme.default` 的选项：
- `light` - 始终使用浅色模式
- `dark` - 始终使用深色模式
- `system` - 与操作系统设置同步（默认）
`theme.displayToggle` 参数允许您显示一个切换按钮以更改主题。
当设置为 `true` 时，访问者可以在浅色或深色模式之间切换，覆盖默认设置。
### 页面宽度
页面的宽度可以通过配置文件中的 `params.page.width` 参数进行自定义：
```yaml {filename="hugo.yaml"}
params:
page:
# full (100%), wide (90rem), normal (1280px)
width: wide
```
有三个可用选项：`full`、`wide` 和 `normal`。默认情况下，页面宽度设置为 `normal`。
同样，导航栏和页脚的宽度可以通过 `params.navbar.width` 和 `params.footer.width` 参数进行自定义。
### 搜索索引
默认启用由 [FlexSearch](https://github.com/nextapps-de/flexsearch) 提供的全文搜索。
要自定义搜索索引，请在配置文件中设置 `params.search.flexsearch.index` 参数：
```yaml {filename="hugo.yaml"}
params:
# 搜索
search:
enable: true
type: flexsearch
flexsearch:
# 按以下内容索引页面：content | summary | heading | title
index: content
```
`flexsearch.index` 的选项：
- `content` - 页面的完整内容（默认）
- `summary` - 页面的摘要，请参阅 [Hugo 内容摘要](https://gohugo.io/content-management/summaries/) 了解更多详细信息
- `heading` - 一级和二级标题
- `title` - 仅包括页面标题
要自定义搜索分词，请在配置文件中设置 `params.search.flexsearch.tokenize` 参数：
```yaml {filename="hugo.yaml"}
params:
# ...
flexsearch:
# full | forward | reverse | strict
tokenize: forward
```
[`flexsearch.tokenize`](https://github.com/nextapps-de/flexsearch/#tokenizer-prefix-search) 的选项：
- `strict` - 索引整个单词
- `forward` - 向前方向逐步索引单词
- `reverse` - 双向逐步索引单词
- `full` - 索引所有可能的组合
要从搜索索引中排除页面，请在页面的 front matter 中设置 `excludeSearch: true`：
```yaml {filename="content/docs/guide/configuration.md"}
---
title: 配置
excludeSearch: true
---
```
### Google Analytics
要启用 [Google Analytics](https://marketingplatform.google.com/about/analytics/)，请在 `hugo.yaml` 中设置 `services.googleAnalytics.ID` 标志：
```yaml {filename="hugo.yaml"}
services:
googleAnalytics:
ID: G-MEASUREMENT_ID
```

162
exampleSite/content/docs/guide/deploy-site.fa.md
View File

@ -1,162 +0,0 @@
---
title: به‌کاراندازی سایت
prev: /docs/guide/shortcodes
next: /docs/advanced
---
Hugo وب‌سایت‌های استاتیک را ایجاد می‌کند و امکان گزینه‌های میزبانی انعطاف‌پذیر را فراهم می‌کند.
این صفحه راهنماهایی برای به‌کاراندازی سایت هگزترا شما در پلتفرم‌های مختلف ارائه می‌کند.
<!--more-->
## گیت‌هاب Pages
[گیت‌هاب Pages](https://docs.github.com/pages) روشی توصیه شده برای به‌کاراندازی و میزبانی وب‌سایت شما به صورت رایگان است.
اگر سایت را با استفاده از [hextra-starter-template](https://github.com/imfing/hextra-starter-template) راه‌اندازی سریع پیاده‌سازی می‌کنید، گردش کار گیت‌هاب Actions را به صورت خارج از جعبه ارائه کرده‌ایم که به‌کاراندازی خودکار در گیت‌هاب Pages به شما کمک می‌کند.
{{% details title="پیکربندی گیت‌هاب Actions" closed="true" %}}
در زیر یک پیکربندی مثال از [hextra-starter-template](https://github.com/imfing/hextra-starter-template) آورده شده است:
```yaml {filename=".github/workflows/pages.yaml"}
# Sample workflow for building and deploying a Hugo site to GitHub Pages
name: Deploy Hugo site to Pages
on:
# Runs on pushes targeting the default branch
push:
branches: ["main"]
# Allows you to run this workflow manually from the Actions tab
workflow_dispatch:
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
contents: read
pages: write
id-token: write
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
group: "pages"
cancel-in-progress: false
# Default to bash
defaults:
run:
shell: bash
jobs:
# Build job
build:
runs-on: ubuntu-latest
env:
HUGO_VERSION: 0.117.0
steps:
- name: Checkout
uses: actions/checkout@v4
with:
fetch-depth: 0 # Fetch all history for .GitInfo and .Lastmod
- name: Setup Go
uses: actions/setup-go@v4
with:
go-version: '1.21'
- name: Setup Hugo
uses: peaceiris/actions-hugo@v2
with:
hugo-version: '0.117.0'
extended: true
- name: Build with Hugo
env:
# For maximum backward compatibility with Hugo modules
HUGO_ENVIRONMENT: production
HUGO_ENV: production
run: |
hugo \
--gc --minify \
--baseURL "https://${{ github.repository_owner }}.github.io/${{ github.event.repository.name }}/"
- name: Upload artifact
uses: actions/upload-pages-artifact@v2
with:
path: ./public
# Deployment job
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v2
```
{{% /details %}}
{{< callout >}}
در تنظیمات مخزن خود، **Pages** > **Build and deployment** > **Source** را روی **GitHub Actions** تنظیم کنید:
![](https://user-images.githubusercontent.com/5097752/266784808-99676430-884e-42ab-b901-f6534a0d6eee.png)
{{< /callout >}}
به‌طور پیش‌فرض، گردش کار گیت‌هاب Actions بالا `.github/workflows/pages.yaml` فرض می‌کند که سایت در حال به‌کاراندازی در `https://<USERNAME>.github.io/<REPO>/` است.
اگر در حال استفاده از `https://<USERNAME>.github.io/` هستید، سپس `--baseURL` را تغییر دهید:
```yaml {filename=".github/workflows/pages.yaml",linenos=table,linenostart=54,hl_lines=[4]}
run: |
hugo \
--gc --minify \
--baseURL "https://${{ github.repository_owner }}.github.io/"
```
اگر می‌خواهید روی دامنه شخصی خود استقرار پیدا کند، لطفا مقدار `--baseURL` را بر این اساس تغییر دهید.
## کلودفلر Pages
1. کد منبع سایت خود را در یک مخزن Git (به عنوان مثال گیت‌هاب) قرار دهید
2. وارد [پیشخوان کلودفلر](https://dash.cloudflare.com/) شوید و حساب خود را انتخاب کنید
3. در صفحه اصلی حساب‌کاربری، **Workers & Pages** > **Create application** > **Pages** > **Connect to Git** را انتخاب کنید
4. مخزن را انتخاب کنید و در بخش Set up builds and Deployments اطلاعات زیر را وارد کنید:
| Configuration | Value |
| ----------------- | -------------------- |
| Production branch | `main` |
| Build command | `hugo --gc --minify` |
| Build directory | `public` |
برای جزئیات بیشتر، بررسی کنید:
- [یک سایت هیوگو راه‌اندازی کنید.](https://developers.cloudflare.com/pages/framework-guides/deploy-a-hugo-site/#deploy-with-cloudflare-pages).
- [پشتیبانی زبان و ابزار.](https://developers.cloudflare.com/pages/platform/language-support-and-tools/).
## Netlify
1. کد خود را به مخزن Git خود (گیت‌هاب، گیت‌لب و غیره) ارسال کنید.
2. [وارد کردن پروژه](https://app.netlify.com/start) به Netlify
3. اگر از [hextra-starter-template][hextra-starter-template] استفاده نمی‌کنید، موارد زیر را به صورت دستی پیکربندی کنید:
- دستور Build را روی `hugo --gc --minify` پیکربندی کنید
- دایرکتوری Publish را برای `public` مشخص کنید
- `HUGO_VERSION` متغیر محیط استقرار را اضافه کنید و روی `0.119.0` تنظیم کنید
4. استقرار!
برای جزئیات بیشتر [Hugo را در Netlify](https://docs.netlify.com/integrations/frameworks/hugo/) بررسی کنید.
## Vercel
1. کد خود را به مخزن Git خود (گیت‌هاب، گیت‌لب و غیره) ارسال کنید.
2. به [پیشخوان Vercel](https://vercel.com/dashboard) بروید و پروژه Hugo خود را وارد کنید
3. پروژه را پیکربندی کنید، Hugo را به‌ عنوان چارچوب Preset انتخاب کنید
4. دستور Build و Install را لغو کنید:
1. دستور Build را روی `hugo --gc --minify` تنظیم کنید
2. دستور Install را روی `yum install golang` تنظیم کنید
![پیکربندی استقرار Vercel](https://github.com/imfing/hextra/assets/5097752/887d949b-8d05-413f-a2b4-7ab92192d0b3)

164
exampleSite/content/docs/guide/deploy-site.ja.md
View File

@ -1,164 +0,0 @@
---
title: サイトのデプロイ
prev: /docs/guide/shortcodes
next: /docs/advanced
---
Hugoは静的サイトを生成するため、柔軟なホスティングオプションが可能です。
このページでは、Hextraサイトをさまざまなプラットフォームにデプロイするためのガイドを提供します。
<!--more-->
## GitHub Pages
[GitHub Pages](https://docs.github.com/pages)は、無料でウェブサイトをデプロイおよびホストするための推奨方法です。
[hextra-starter-template](https://github.com/imfing/hextra-starter-template)を使用してサイトをブートストラップした場合、GitHub Pagesへの自動デプロイを支援するGitHub Actionsワークフローがすぐに利用可能です。
{{% details title="GitHub Actionsの設定" closed="true" %}}
以下は、[hextra-starter-template](https://github.com/imfing/hextra-starter-template)からの設定例です：
```yaml {filename=".github/workflows/pages.yaml"}
# HugoサイトをGitHub Pagesにデプロイするためのサンプルワークフロー
name: Deploy Hugo site to Pages
on:
# デフォルトブランチへのプッシュ時に実行
push:
branches: ["main"]
# Actionsタブから手動でこのワークフローを実行可能
workflow_dispatch:
# GITHUB_TOKENの権限を設定してGitHub Pagesへのデプロイを許可
permissions:
contents: read
pages: write
id-token: write
# 同時実行を1つに制限し、進行中の実行と最新のキューイングされた実行の間の実行をスキップ。
# ただし、進行中の実行はキャンセルしないでください。これらの本番デプロイを完了させたいためです。
concurrency:
group: "pages"
cancel-in-progress: false
# デフォルトはbash
defaults:
run:
shell: bash
jobs:
# ビルドジョブ
build:
runs-on: ubuntu-latest
env:
HUGO_VERSION: 0.138.0
steps:
- name: Checkout
uses: actions/checkout@v4
with:
fetch-depth: 0 # .GitInfoと.Lastmodのためにすべての履歴を取得
submodules: recursive
- name: Setup Go
uses: actions/setup-go@v5
with:
go-version: '1.22'
- name: Setup Pages
id: pages
uses: actions/configure-pages@v4
- name: Setup Hugo
run: |
wget -O ${{ runner.temp }}/hugo.deb https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_linux-amd64.deb \
&& sudo dpkg -i ${{ runner.temp }}/hugo.deb
- name: Build with Hugo
env:
# Hugoモジュールとの最大限の互換性のために
HUGO_ENVIRONMENT: production
HUGO_ENV: production
run: |
hugo \
--gc --minify \
--baseURL "${{ steps.pages.outputs.base_url }}/"
- name: Upload artifact
uses: actions/upload-pages-artifact@v3
with:
path: ./public
# デプロイジョブ
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4
```
{{% /details %}}
{{< callout >}}
リポジトリ設定で、**Pages** > **Build and deployment** > **Source** を **GitHub Actions** に設定します：
![](https://user-images.githubusercontent.com/5097752/266784808-99676430-884e-42ab-b901-f6534a0d6eee.png)
{{< /callout >}}
デフォルトでは、上記のGitHub Actionsワークフロー `.github/workflows/pages.yaml` は、サイトが `https://<USERNAME>.github.io/<REPO>/` にデプロイされることを前提としています。
`https://<USERNAME>.github.io/` にデプロイする場合は、`--baseURL` を変更します：
```yaml {filename=".github/workflows/pages.yaml",linenos=table,linenostart=54,hl_lines=[4]}
run: |
hugo \
--gc --minify \
--baseURL "https://${{ github.repository_owner }}.github.io/"
```
独自のドメインにデプロイする場合は、`--baseURL` の値を適宜変更してください。
## Cloudflare Pages
1. サイトのソースコードをGitリポジトリ（例：GitHub）に配置します。
2. [Cloudflareダッシュボード](https://dash.cloudflare.com/)にログインし、アカウントを選択します。
3. アカウントホームで、**Workers & Pages** > **Create application** > **Pages** > **Connect to Git** を選択します。
4. リポジトリを選択し、**Set up builds and deployments** セクションで以下の情報を提供します：
| 設定 | 値 |
| ---------------- | ------------------- |
| 本番ブランチ | `main` |
| ビルドコマンド | `hugo --gc --minify` |
| ビルドディレクトリ | `public` |
詳細については、以下を確認してください：
- [Hugoサイトのデプロイ](https://developers.cloudflare.com/pages/framework-guides/deploy-a-hugo-site/#deploy-with-cloudflare-pages)。
- [言語サポートとツール](https://developers.cloudflare.com/pages/platform/language-support-and-tools/)。
## Netlify
1. コードをGitリポジトリ（GitHub、GitLabなど）にプッシュします。
2. [プロジェクトをインポート](https://app.netlify.com/start)してNetlifyに追加します。
3. [hextra-starter-template][hextra-starter-template]を使用していない場合、以下の設定を手動で行います：
- ビルドコマンドを `hugo --gc --minify` に設定します。
- 公開ディレクトリを `public` に指定します。
- 環境変数 `HUGO_VERSION` を追加し、`0.138.0` に設定するか、`netlify.toml` ファイルに設定します。
4. デプロイします！
詳細については、[NetlifyでのHugo](https://docs.netlify.com/integrations/frameworks/hugo/)を確認してください。
## Vercel
1. コードをGitリポジトリ（GitHub、GitLabなど）にプッシュします。
2. [Vercelダッシュボード](https://vercel.com/dashboard)に移動し、Hugoプロジェクトをインポートします。
3. プロジェクトを設定し、フレームワークプリセットとしてHugoを選択します。
4. ビルドコマンドとインストールコマンドを上書きします：
1. ビルドコマンドを `hugo --gc --minify` に設定します。
2. インストールコマンドを `yum install golang` に設定します。
![Vercelデプロイ設定](https://github.com/imfing/hextra/assets/5097752/887d949b-8d05-413f-a2b4-7ab92192d0b3)

164
exampleSite/content/docs/guide/deploy-site.md
View File

@ -1,164 +0,0 @@
---
title: Deploy Site
prev: /docs/guide/shortcodes
next: /docs/advanced
---
Hugo generates static websites, allowing for flexible hosting options.
This page provides guides for deploying your Hextra site on various platforms.
<!--more-->
## GitHub Pages
[GitHub Pages](https://docs.github.com/pages) is the recommended way to deploy and host your website for free.
If you bootstrap the site using [hextra-starter-template](https://github.com/imfing/hextra-starter-template), it has provided GitHub Actions workflow out-of-the-box that helps automatically deploy to GitHub Pages.
{{% details title="GitHub Actions Configuration" closed="true" %}}
Below is an example configuration from [hextra-starter-template](https://github.com/imfing/hextra-starter-template):
```yaml {filename=".github/workflows/pages.yaml"}
# Sample workflow for building and deploying a Hugo site to GitHub Pages
name: Deploy Hugo site to Pages
on:
# Runs on pushes targeting the default branch
push:
branches: ["main"]
# Allows you to run this workflow manually from the Actions tab
workflow_dispatch:
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
contents: read
pages: write
id-token: write
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
group: "pages"
cancel-in-progress: false
# Default to bash
defaults:
run:
shell: bash
jobs:
# Build job
build:
runs-on: ubuntu-latest
env:
HUGO_VERSION: 0.138.0
steps:
- name: Checkout
uses: actions/checkout@v4
with:
fetch-depth: 0 # fetch all history for .GitInfo and .Lastmod
submodules: recursive
- name: Setup Go
uses: actions/setup-go@v5
with:
go-version: '1.22'
- name: Setup Pages
id: pages
uses: actions/configure-pages@v4
- name: Setup Hugo
run: |
wget -O ${{ runner.temp }}/hugo.deb https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_linux-amd64.deb \
&& sudo dpkg -i ${{ runner.temp }}/hugo.deb
- name: Build with Hugo
env:
# For maximum backward compatibility with Hugo modules
HUGO_ENVIRONMENT: production
HUGO_ENV: production
run: |
hugo \
--gc --minify \
--baseURL "${{ steps.pages.outputs.base_url }}/"
- name: Upload artifact
uses: actions/upload-pages-artifact@v3
with:
path: ./public
# Deployment job
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4
```
{{% /details %}}
{{< callout >}}
In your repository settings, set the **Pages** > **Build and deployment** > **Source** to **GitHub Actions**:
![](https://user-images.githubusercontent.com/5097752/266784808-99676430-884e-42ab-b901-f6534a0d6eee.png)
{{< /callout >}}
By default, the above GitHub Actions workflow `.github/workflows/pages.yaml` assumes that the site is deploying to `https://<USERNAME>.github.io/<REPO>/`.
If you are deploying to `https://<USERNAME>.github.io/` then modify the `--baseURL`:
```yaml {filename=".github/workflows/pages.yaml",linenos=table,linenostart=54,hl_lines=[4]}
run: |
hugo \
--gc --minify \
--baseURL "https://${{ github.repository_owner }}.github.io/"
```
If you are deploying to your own domain, please change the `--baseURL` value accordingly.
## Cloudflare Pages
1. Put your site source code in a Git repository (e.g. GitHub)
2. Log in to the [Cloudflare dashboard](https://dash.cloudflare.com/) and select your account
3. In Account Home, select **Workers & Pages** > **Create application** > **Pages** > **Connect to Git**
4. Select the repository, and in the **Set up builds and deployments** section, provide the following information:
| Configuration | Value |
| ----------------- | -------------------- |
| Production branch | `main` |
| Build command | `hugo --gc --minify` |
| Build directory | `public` |
For more details, check out:
- [Deploy a Hugo site](https://developers.cloudflare.com/pages/framework-guides/deploy-a-hugo-site/#deploy-with-cloudflare-pages).
- [Language support and tools](https://developers.cloudflare.com/pages/platform/language-support-and-tools/).
## Netlify
1. Push your code to your Git repository (GitHub, GitLab, etc.)
2. [Import the project](https://app.netlify.com/start) to Netlify
3. If you are not using [hextra-starter-template][hextra-starter-template], configure the following manually:
- Configure the Build command to `hugo --gc --minify`
- Specify the Publish directory to `public`
- Add Environment variable `HUGO_VERSION` and set to `0.138.0`, or alternatively, set it in `netlify.toml` file
4. Deploy!
Check [Hugo on Netlify](https://docs.netlify.com/integrations/frameworks/hugo/) for more details.
## Vercel
1. Push your code to your Git repository (GitHub, GitLab, etc.)
2. Go to [Vercel Dashboard](https://vercel.com/dashboard) and import your Hugo project
3. Configure the project, select Hugo as Framework Preset
4. Override the Build Command and Install command:
1. Set Build Command to `hugo --gc --minify`
2. Set Install Command to `yum install golang`
![Vercel Deployment Configuration](https://github.com/imfing/hextra/assets/5097752/887d949b-8d05-413f-a2b4-7ab92192d0b3)

164
exampleSite/content/docs/guide/deploy-site.zh-cn.md
View File

@ -1,164 +0,0 @@
---
title: 部署站点
prev: /docs/guide/shortcodes
next: /docs/advanced
---
Hugo 生成静态网站，允许灵活的托管选项。
本页提供了在各种平台上部署 Hextra 站点的指南。
<!--more-->
## GitHub Pages
[GitHub Pages](https://docs.github.com/pages) 是推荐的方式，可以免费部署和托管您的网站。
如果您使用 [hextra-starter-template](https://github.com/imfing/hextra-starter-template) 引导站点，它已经提供了开箱即用的 GitHub Actions 工作流，帮助自动部署到 GitHub Pages。
{{% details title="GitHub Actions 配置" closed="true" %}}
以下是 [hextra-starter-template](https://github.com/imfing/hextra-starter-template) 的示例配置：
```yaml {filename=".github/workflows/pages.yaml"}
# 用于构建和部署 Hugo 站点到 GitHub Pages 的示例工作流
name: 部署 Hugo 站点到 Pages
on:
# 在推送到默认分支时运行
push:
branches: ["main"]
# 允许您从 Actions 选项卡手动运行此工作流
workflow_dispatch:
# 设置 GITHUB_TOKEN 的权限以允许部署到 GitHub Pages
permissions:
contents: read
pages: write
id-token: write
# 只允许一个并发部署，跳过在运行中和最新排队之间的运行。
# 但是，不要取消正在运行的运行，因为我们希望这些生产部署能够完成。
concurrency:
group: "pages"
cancel-in-progress: false
# 默认使用 bash
defaults:
run:
shell: bash
jobs:
# 构建任务
build:
runs-on: ubuntu-latest
env:
HUGO_VERSION: 0.138.0
steps:
- name: 检出
uses: actions/checkout@v4
with:
fetch-depth: 0 # 获取所有历史记录以支持 .GitInfo 和 .Lastmod
submodules: recursive
- name: 设置 Go
uses: actions/setup-go@v5
with:
go-version: '1.22'
- name: 设置 Pages
id: pages
uses: actions/configure-pages@v4
- name: 设置 Hugo
run: |
wget -O ${{ runner.temp }}/hugo.deb https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_linux-amd64.deb \
&& sudo dpkg -i ${{ runner.temp }}/hugo.deb
- name: 使用 Hugo 构建
env:
# 为了最大程度地兼容 Hugo 模块
HUGO_ENVIRONMENT: production
HUGO_ENV: production
run: |
hugo \
--gc --minify \
--baseURL "${{ steps.pages.outputs.base_url }}/"
- name: 上传工件
uses: actions/upload-pages-artifact@v3
with:
path: ./public
# 部署任务
deploy:
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
runs-on: ubuntu-latest
needs: build
steps:
- name: 部署到 GitHub Pages
id: deployment
uses: actions/deploy-pages@v4
```
{{% /details %}}
{{< callout >}}
在您的仓库设置中，将 **Pages** > **Build and deployment** > **Source** 设置为 **GitHub Actions**：
![](https://user-images.githubusercontent.com/5097752/266784808-99676430-884e-42ab-b901-f6534a0d6eee.png)
{{< /callout >}}
默认情况下，上述 GitHub Actions 工作流 `.github/workflows/pages.yaml` 假设站点部署到 `https://<USERNAME>.github.io/<REPO>/`。
如果您部署到 `https://<USERNAME>.github.io/`，请修改 `--baseURL`：
```yaml {filename=".github/workflows/pages.yaml",linenos=table,linenostart=54,hl_lines=[4]}
run: |
hugo \
--gc --minify \
--baseURL "https://${{ github.repository_owner }}.github.io/"
```
如果您部署到自己的域名，请相应地更改 `--baseURL` 值。
## Cloudflare Pages
1. 将您的站点源代码放入 Git 仓库（例如 GitHub）
2. 登录 [Cloudflare 仪表板](https://dash.cloudflare.com/) 并选择您的账户
3. 在账户主页中，选择 **Workers & Pages** > **Create application** > **Pages** > **Connect to Git**
4. 选择仓库，并在 **Set up builds and deployments** 部分提供以下信息：
| 配置项 | 值 |
| ------------------ | -------------------- |
| 生产分支 | `main` |
| 构建命令 | `hugo --gc --minify` |
| 构建目录 | `public` |
更多详情，请查看：
- [部署 Hugo 站点](https://developers.cloudflare.com/pages/framework-guides/deploy-a-hugo-site/#deploy-with-cloudflare-pages)。
- [语言支持和工具](https://developers.cloudflare.com/pages/platform/language-support-and-tools/)。
## Netlify
1. 将代码推送到您的 Git 仓库（GitHub、GitLab 等）
2. [导入项目](https://app.netlify.com/start) 到 Netlify
3. 如果您没有使用 [hextra-starter-template][hextra-starter-template]，请手动配置以下内容：
- 将构建命令配置为 `hugo --gc --minify`
- 指定发布目录为 `public`
- 添加环境变量 `HUGO_VERSION` 并设置为 `0.138.0`，或者将其设置在 `netlify.toml` 文件中
4. 部署！
查看 [Netlify 上的 Hugo](https://docs.netlify.com/integrations/frameworks/hugo/) 了解更多详情。
## Vercel
1. 将代码推送到您的 Git 仓库（GitHub、GitLab 等）
2. 前往 [Vercel 仪表板](https://vercel.com/dashboard) 并导入您的 Hugo 项目
3. 配置项目，选择 Hugo 作为框架预设
4. 覆盖构建命令和安装命令：
1. 将构建命令设置为 `hugo --gc --minify`
2. 将安装命令设置为 `yum install golang`
![Vercel 部署配置](https://github.com/imfing/hextra/assets/5097752/887d949b-8d05-413f-a2b4-7ab92192d0b3)

53
exampleSite/content/docs/guide/diagrams.fa.md
View File

@ -1,53 +0,0 @@
---
title: نمودارها
weight: 6
next: /docs/guide/shortcodes
---
در حال حاضر، هگزترا از [Mermaid](#mermaid) برای نمودارها پشتیبانی می‌کند.
<!--more-->
## Mermaid
[Mermaid](https://github.com/mermaid-js/mermaid#readme) یک ابزار نمودار و نمودار مبتنی بر جاوااسکریپت است که تعاریف متنی الهام گرفته از مارک‌داون را دریافت می‌کند و نمودارها را به صورت پویا در مرورگر ایجاد می‌کند. به عنوان مثال، Mermaid می‌تواند نمودارهای فلوچارت، نمودارهای توالی، نمودارهای دایره‌ای و موارد دیگر را رندر کند.
استفاده از Mermaid در هگزترا به سادگی نوشتن یک بلوک کد با مجموعه زبان `mermaid` است:
````markdown
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
````
به صورت زیر رندر خواهد شد:
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
نمودار توالی:
```mermaid
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](https://mermaid-js.github.io/mermaid/#/) مراجعه کنید.

53
exampleSite/content/docs/guide/diagrams.ja.md
View File

@ -1,53 +0,0 @@
---
title: ダイアグラム
weight: 6
next: /docs/guide/shortcodes
---
現在、Hextraはダイアグラムのために[Mermaid](#mermaid)をサポートしています。
<!--more-->
## Mermaid
[Mermaid](https://github.com/mermaid-js/mermaid#readme)は、JavaScriptベースのダイアグラムおよびチャート作成ツールで、Markdownにインスパイアされたテキスト定義を取り込み、ブラウザ内でダイナミックにダイアグラムを作成します。例えば、Mermaidはフローチャート、シーケンス図、円グラフなどをレンダリングできます。
HextraでMermaidを使用するのは、言語を`mermaid`に設定したコードブロックを書くのと同じくらい簡単です:
````markdown
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
````
これは次のようにレンダリングされます:
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
シーケンス図:
```mermaid
sequenceDiagram
participant Alice
participant Bob
Alice->>John: こんにちはJohn、元気ですか？
loop 健康チェック
John->>John: 心気症と戦う
end
Note right of John: 理性的な思考 <br/>が勝つ！
John-->>Alice: 元気です！
John->>Bob: あなたはどうですか？
Bob-->>John: とても元気です！
```
詳細については、[Mermaidドキュメント](https://mermaid-js.github.io/mermaid/#/)を参照してください。

53
exampleSite/content/docs/guide/diagrams.md
View File

@ -1,53 +0,0 @@
---
title: Diagrams
weight: 6
next: /docs/guide/shortcodes
---
Currently, Hextra supports [Mermaid](#mermaid) for diagrams.
<!--more-->
## Mermaid
[Mermaid](https://github.com/mermaid-js/mermaid#readme) is a JavaScript based diagramming and charting tool that takes Markdown-inspired text definitions and creates diagrams dynamically in the browser. For example, Mermaid can render flow charts, sequence diagrams, pie charts and more.
Using Mermaid in Hextra is as simple as writing a code block with language set `mermaid`:
````markdown
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
````
will be rendered as:
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
Sequence diagram:
```mermaid
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!
```
For more information, please refer to [Mermaid Documentation](https://mermaid-js.github.io/mermaid/#/).

53
exampleSite/content/docs/guide/diagrams.zh-cn.md
View File

@ -1,53 +0,0 @@
---
title: 图表
weight: 6
next: /docs/guide/shortcodes
---
目前，Hextra 支持使用 [Mermaid](#mermaid) 来绘制图表。
<!--more-->
## Mermaid
[Mermaid](https://github.com/mermaid-js/mermaid#readme) 是一个基于 JavaScript 的图表工具，它通过类似 Markdown 的文本定义，在浏览器中动态生成图表。例如，Mermaid 可以渲染流程图、序列图、饼图等。
在 Hextra 中使用 Mermaid 非常简单，只需编写一个语言设置为 `mermaid` 的代码块：
````markdown
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
````
将会渲染为：
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
序列图示例：
```mermaid
sequenceDiagram
participant Alice
participant Bob
Alice->>John: 你好 John，最近怎么样？
loop 健康检查
John->>John: 与疑病症作斗争
end
Note right of John: 理性思考 <br/>占据上风！
John-->>Alice: 很好！
John->>Bob: 你怎么样？
Bob-->>John: 非常好！
```
更多信息，请参考 [Mermaid 文档](https://mermaid-js.github.io/mermaid/#/)。

60
exampleSite/content/docs/guide/latex.fa.md
View File

@ -1,60 +0,0 @@
---
title: "LaTeX"
weight: 4
math: true
---
$\KaTeX$ برای رندر کردن عبارت‌های ریاضی LaTeX استفاده می‌شود. می‌توان آن را در هر صفحه با تنظیم `math` روی `true` در قسمت بالای صفحه فعال کرد.
<!--more-->
```yaml {filename="Markdown"}
---
title: "صفحه من با LaTeX"
math: true
---
```
وقتی فعال باشد، اسکریپت‌ها، شیوه‌نامه‌ها و فونت‌های KaTeX به طور خودکار در سایت شما قرار می‌گیرند. می‌توانید از عبارت‌های ریاضی LaTeX در محتوای مارک‌داون خود استفاده کنید.
## مثال
هر دو عبارت‌های ریاضی درون‌خطی و پاراگراف جداگانه LaTeX در محتوای مارک‌داون پشتیبانی می‌شوند.
### درون‌خطی
```markdown {filename="page.md"}
این $\sigma(z) = \frac{1}{1 + e^{-z}}$ درون‌خطی است.
```
این $\sigma(z) = \frac{1}{1 + e^{-z}}$ درون‌خطی است.
### پاراگراف جداگانه
```markdown {filename="page.md"}
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
```
به صورت زیر رندر خواهد شد:
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
## توابع پشتیبانی شده
برای مشاهده فهرست توابع پشتیبانی شده، به [توابع پشتیبانی شده KaTeX](https://katex.org/docs/supported.html) مراجعه کنید.
## شیمی
عبارت‌های شیمی از طریق افزونه [mhchem](https://mhchem.github.io/MathJax-mhchem/) پشتیبانی می‌شوند.
درون‌خطی: $\ce{H2O}$ آب است.
پاراگراف جداگانه:
```markdown {filename="page.md"}
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$
```
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$

97
exampleSite/content/docs/guide/latex.ja.md
View File

@ -1,97 +0,0 @@
---
title: "LaTeX"
weight: 4
math: true
---
$\KaTeX$ は LaTeX の数式をレンダリングするために使用されます。ページのフロントマターで `math` を `true` に設定することで、ページごとに有効にすることができます。
<!--more-->
```yaml {filename="page.md"}
---
title: "LaTeX を使用した私のページ"
math: true
---
```
有効にすると、KaTeX のスクリプト、スタイルシート、フォントが自動的にサイトに含まれます。Markdown コンテンツ内で LaTeX 数式を使用できます。
## 例
Markdown コンテンツ内で、インラインおよび別段落の LaTeX 数式がサポートされています。
### インライン
```markdown {filename="page.md"}
これは $\sigma(z) = \frac{1}{1 + e^{-z}}$ インラインです。
```
これは $\sigma(z) = \frac{1}{1 + e^{-z}}$ インラインです。
### 別段落
```markdown {filename="page.md"}
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
```
次のようにレンダリングされます:
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
> [!IMPORTANT]
> Hugo 設定ファイルで [パススルー拡張機能](https://gohugo.io/content-management/mathematics/) を有効にして設定してください。これにより、複雑な式のレンダリング問題を回避するために、デリミタ内の生のコンテンツが保持されます。
```yaml {filename="hugo.yaml"}
markup:
goldmark:
extensions:
passthrough:
delimiters:
block: [['\[', '\]'], ['$$', '$$']]
inline: [['\(', '\)']]
enable: true
```
例えば、aligned 環境を使用する場合:
```latex {filename="page.md"}
$$
\begin{aligned}
\nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\
\nabla \cdot \mathbf{B} &= 0 \\
\nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \\
\nabla \times \mathbf{B} &= \mu_0 \left( \mathbf{J} + \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \right)
\end{aligned}
$$
```
次のようにレンダリングされます:
$$
\begin{aligned}
\nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\
\nabla \cdot \mathbf{B} &= 0 \\
\nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \\
\nabla \times \mathbf{B} &= \mu_0 \left( \mathbf{J} + \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \right)
\end{aligned}
$$
## サポートされている関数
サポートされている関数の一覧については、[KaTeX サポートされている関数](https://katex.org/docs/supported.html) を参照してください。
## 化学
化学式は [mhchem](https://mhchem.github.io/MathJax-mhchem/) 拡張機能を介してサポートされています。
インライン: $\ce{H2O}$ は水です。
別段落:
```markdown {filename="page.md"}
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$
```
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$

97
exampleSite/content/docs/guide/latex.md
View File

@ -1,97 +0,0 @@
---
title: "LaTeX"
weight: 4
math: true
---
$\KaTeX$ is used for rendering LaTeX math expressions. It can be enabled per page by setting `math` to `true` in the page front matter.
<!--more-->
```yaml {filename="page.md"}
---
title: "My Page with LaTeX"
math: true
---
```
When enabled, the scripts, stylesheets and fonts from KaTeX will be included automatically in your site. You can start using LaTeX math expressions in your Markdown content.
## Example
Both inline and separate paragraph LaTeX math expressions are supported in the Markdown content.
### Inline
```markdown {filename="page.md"}
This $\sigma(z) = \frac{1}{1 + e^{-z}}$ is inline.
```
This $\sigma(z) = \frac{1}{1 + e^{-z}}$ is inline.
### Separate Paragraph
```markdown {filename="page.md"}
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
```
will be rendered as:
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
> [!IMPORTANT]
> Please enable and configure the [passthrough extension](https://gohugo.io/content-management/mathematics/) in the Hugo configuration file. It preserves raw content within the delimiters to avoid rendering issues for complex expressions.
```yaml {filename="hugo.yaml"}
markup:
goldmark:
extensions:
passthrough:
delimiters:
block: [['\[', '\]'], ['$$', '$$']]
inline: [['\(', '\)']]
enable: true
```
For example, using the aligned environment:
```latex {filename="page.md"}
$$
\begin{aligned}
\nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\
\nabla \cdot \mathbf{B} &= 0 \\
\nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \\
\nabla \times \mathbf{B} &= \mu_0 \left( \mathbf{J} + \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \right)
\end{aligned}
$$
```
will be rendered as:
$$
\begin{aligned}
\nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\
\nabla \cdot \mathbf{B} &= 0 \\
\nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \\
\nabla \times \mathbf{B} &= \mu_0 \left( \mathbf{J} + \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \right)
\end{aligned}
$$
## Supported Functions
For a list of supported functions, see [KaTeX supported functions](https://katex.org/docs/supported.html).
## Chemistry
Chemistry expressions are supported via [mhchem](https://mhchem.github.io/MathJax-mhchem/) extension.
Inline: $\ce{H2O}$ is water.
Separate paragraph:
```markdown {filename="page.md"}
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$
```
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$

97
exampleSite/content/docs/guide/latex.zh-cn.md
View File

@ -1,97 +0,0 @@
---
title: "数学公式"
weight: 4
math: true
---
$\KaTeX$ 用于渲染 LaTeX 数学表达式。可以通过在页面前置设置中将 `math` 设置为 `true` 来启用它。
<!--more-->
```yaml {filename="page.md"}
---
title: "我的页面包含 LaTeX"
math: true
---
```
启用后，KaTeX 的脚本、样式表和字体将自动包含在您的站点中。您可以在 Markdown 内容中开始使用 LaTeX 数学表达式。
## 示例
Markdown 内容中支持内联和独立段落的 LaTeX 数学表达式。
### 内联
```markdown {filename="page.md"}
这个 $\sigma(z) = \frac{1}{1 + e^{-z}}$ 是内联的。
```
这个 $\sigma(z) = \frac{1}{1 + e^{-z}}$ 是内联的。
### 独立段落
```markdown {filename="page.md"}
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
```
将渲染为：
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
> [!IMPORTANT]
> 请在 Hugo 配置文件中启用并配置 [passthrough 扩展](https://gohugo.io/content-management/mathematics/)。它保留分隔符内的原始内容，以避免复杂表达式的渲染问题。
```yaml {filename="hugo.yaml"}
markup:
goldmark:
extensions:
passthrough:
delimiters:
block: [['\[', '\]'], ['$$', '$$']]
inline: [['\(', '\)']]
enable: true
```
例如，使用对齐环境：
```latex {filename="page.md"}
$$
\begin{aligned}
\nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\
\nabla \cdot \mathbf{B} &= 0 \\
\nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \\
\nabla \times \mathbf{B} &= \mu_0 \left( \mathbf{J} + \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \right)
\end{aligned}
$$
```
将渲染为：
$$
\begin{aligned}
\nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\
\nabla \cdot \mathbf{B} &= 0 \\
\nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \\
\nabla \times \mathbf{B} &= \mu_0 \left( \mathbf{J} + \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \right)
\end{aligned}
$$
## 支持的函数
有关支持的函数列表，请参阅 [KaTeX 支持的函数](https://katex.org/docs/supported.html)。
## 化学
通过 [mhchem](https://mhchem.github.io/MathJax-mhchem/) 扩展支持化学表达式。
内联：$\ce{H2O}$ 是水。
独立段落：
```markdown {filename="page.md"}
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$
```
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$

156
exampleSite/content/docs/guide/markdown.fa.md
View File

@ -1,156 +0,0 @@
---
title: مارک‌داون
weight: 2
---
Hugo از سینتکس [مارک‌داون](https://en.wikipedia.org/wiki/Markdown) برای قالب‌بندی متن، ایجاد فهرست و موارد دیگر پشتیبانی می‌کند. این صفحه برخی از رایج‌ترین نمونه‌های سینتکس مارک‌داون را به شما نشان می‌دهد.
<!--more-->
## مثال‌های مارک‌داون
### ظاهر طراحی دادن به متن
| سبک | سینتکس | مثال | خروجی |
| -------- | -------- | ------ | ------ |
| توپر | `**متن توپر**` | `**متن توپر**` | **متن توپر** |
| کج | `*متن کج*` | `*متن کج*` | *متن کج* |
| خط خورده | `~~متن خط خورده~~` | `~~متن خط خورده~~` | ~~متن خط خورده~~ |
| پایین‌نویس | `<sub></sub>` | `این یک متن <sub>پایین‌نویس</sub> است` | این یک متن <sub>پایین‌نویس</sub> است |
| بالانویس | `<sup></sup>` | `این یک متن <sup>بالانویس</sup> است` | این یک متن <sup>بالانویس</sup> است |
### بلوک نقل‌قول
بلوک نقل‌قول با ذکر منبع
> با اشتراک‌گذاری حافظه ارتباط برقرار نکنید، حافظه را با برقراری ارتباط به اشتراک بگذارید.<br>
> — <cite>راب پایک[^1]</cite>
[^1]: نقل‌قول بالا گزیده‌ای از [سخنرانی](https://www.youtube.com/watch?v=PAAkCSZUG1c) راب پایک در Gopherfest، در تاریخ ۲۷ آبان ۱۳۹۴ است.
```markdown {filename=Markdown}
> با اشتراک‌گذاری حافظه ارتباط برقرار نکنید، حافظه را با برقراری ارتباط به اشتراک بگذارید.<br>
> — <cite>راب پایک[^1]</cite>
[^1]: نقل‌قول بالا گزیده‌ای از [سخنرانی](https://www.youtube.com/watch?v=PAAkCSZUG1c) راب پایک در Gopherfest، در تاریخ ۲۷ آبان ۱۳۹۴ است.
```
### جدول‌ها
جدول‌ها بخشی از مشخصات اصلی مارک‌داون نیستند، اما Hugo از آنها در خارج از جعبه پشتیبانی می‌کند.
| نام | سن |
|--------|------|
| گودرز | ۳۰|
| آصف | ۳۴ |
```markdown {filename=Markdown}
| نام | سن |
|--------|------|
| گودرز | ۳۰|
| آصف | ۳۴ |
```
#### مارک‌داون درون‌خطی درون جدول‌ها
| کج | توپر | کد |
| -------- | -------- | ------ |
| *کج* | **توپر** | `کد` |
```markdown {filename=Markdown}
| کج | توپر | کد |
| -------- | -------- | ------ |
| *کج* | **توپر** | `کد` |
```
### بلوک‌های کد
{{< cards >}}
{{< card link="../../guide/syntax-highlighting" title="برجسته‌کردن سینتکس" icon="sparkles" >}}
{{< /cards >}}
### فهرست‌ها
#### فهرست مرتب‌شده
1. اولین آیتم
2. دومین آیتم
3. سومین آیتم
```markdown {filename=Markdown}
1. اولین آیتم
2. دومین آیتم
3. سومین آیتم
```
#### فهرست مرتب‌نشده
* فهرست آیتم
* یک آیتم دیگه
* و یک آیتم دیگه
```markdown {filename=Markdown}
* فهرست آیتم
* یک آیتم دیگه
* و یک آیتم دیگه
```
#### فهرست تو در تو
* میوه
* سیب
* پرتقال
* موز
* لبنیات
* شیر
* پنیر
```markdown {filename=Markdown}
* میوه
* سیب
* پرتقال
* موز
* لبنیات
* شیر
* پنیر
```
### عکس‌ها
![landscape](https://picsum.photos/800/600)
```markdown {filename=Markdown}
![landscape](https://picsum.photos/800/600)
```
با توضیحات:
![landscape](https://picsum.photos/800/600 "یک چشم‌انداز Unsplash")
```markdown {filename=Markdown}
![landscape](https://picsum.photos/800/600 "یک چشم‌انداز Unsplash")
```
## پیکربندی
Hugo از [Goldmark](https://github.com/yuin/goldmark) برای تجزیه مارک‌داون استفاده می‌کند.
رندر مارک‌داون را می‌توان در `hugo.yaml` تحت `markup.goldmark` پیکربندی کنید.
در زیر پیکربندی پیش‌فرض هگزترا را می‌توانید ببینید:
```yaml {filename="hugo.yaml"}
markup:
goldmark:
renderer:
unsafe: true
highlight:
noClasses: false
```
برای گزینه‌های پیکربندی بیشتر، به مستندات Hugo در [پیکربندی نشانه‌گذاری](https://gohugo.io/getting-started/configuration-markup/) مراجعه کنید.
## منابع یادگیری
* [راهنمای مارک‌داون](https://www.markdownguide.org/)
* [برگه تقلب مارک‌داون](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)
* [آموزش مارک‌داون](https://www.markdowntutorial.com/)
* [مرجع مارک‌داون](https://commonmark.org/help/)

196
exampleSite/content/docs/guide/markdown.ja.md
View File

@ -1,196 +0,0 @@
---
title: Markdown
weight: 2
---
Hugoは、テキストのフォーマットやリストの作成などに[Markdown](https://ja.wikipedia.org/wiki/Markdown)構文をサポートしています。このページでは、最も一般的なMarkdown構文の例をいくつか紹介します。
<!--more-->
## Markdownの例
### テキストのスタイル
| スタイル | 構文 | 例 | 出力 |
| -------- | -------- | ------ | ------ |
| 太字 | `**太字テキスト**` | `**太字テキスト**` | **太字テキスト** |
| 斜体 | `*斜体テキスト*` | `*斜体テキスト*` | *斜体テキスト* |
| 取り消し線 | `~~取り消し線テキスト~~` | `~~取り消し線テキスト~~` | ~~取り消し線テキスト~~ |
| 下付き文字 | `<sub></sub>` | `これは<sub>下付き文字</sub>です` | これは<sub>下付き文字</sub>です |
| 上付き文字 | `<sup></sup>` | `これは<sup>上付き文字</sup>です` | これは<sup>上付き文字</sup>です |
### ブロッククォート
引用元付きのブロッククォート
> メモリを共有してコミュニケーションするのではなく、コミュニケーションしてメモリを共有せよ。<br>
> — <cite>ロブ・パイク[^1]</cite>
[^1]: 上記の引用は、2015年11月18日のGopherfestでのロブ・パイクの[講演](https://www.youtube.com/watch?v=PAAkCSZUG1c)から抜粋したものです。
```markdown {filename=Markdown}
> メモリを共有してコミュニケーションするのではなく、コミュニケーションしてメモリを共有せよ。<br>
> — <cite>ロブ・パイク[^1]</cite>
[^1]: 上記の引用は、2015年11月18日のGopherfestでのロブ・パイクの[講演](https://www.youtube.com/watch?v=PAAkCSZUG1c)から抜粋したものです。
```
### アラート
{{< new-feature version="v0.9.0" >}}
アラートは、ブロッククォート構文に基づくMarkdown拡張で、重要な情報を強調するために使用できます。
[GitHubスタイルのアラート](https://docs.github.com/ja/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#alerts)がサポートされています。
Hextraの最新バージョンと[Hugo v0.134.0](https://github.com/gohugoio/hugo/releases/tag/v0.134.0)以降を使用していることを確認してください。
> [!NOTE]
> ユーザーが知っておくべき有用な情報で、内容をざっと見る際にも役立ちます。
> [!TIP]
> 物事をより良く、または簡単に行うための役立つアドバイス。
> [!IMPORTANT]
> ユーザーが目標を達成するために知っておくべき重要な情報。
> [!WARNING]
> 問題を避けるために即座にユーザーの注意を引く必要がある緊急の情報。
> [!CAUTION]
> 特定のアクションのリスクやネガティブな結果についてのアドバイス。
```markdown {filename=Markdown}
> [!NOTE]
> ユーザーが知っておくべき有用な情報で、内容をざっと見る際にも役立ちます。
> [!TIP]
> 物事をより良く、または簡単に行うための役立つアドバイス。
> [!IMPORTANT]
> ユーザーが目標を達成するために知っておくべき重要な情報。
> [!WARNING]
> 問題を避けるために即座にユーザーの注意を引く必要がある緊急の情報。
> [!CAUTION]
> 特定のアクションのリスクやネガティブな結果についてのアドバイス。
```
### テーブル
テーブルはMarkdownのコア仕様には含まれていませんが、Hugoはデフォルトでサポートしています。
| 名前 | 年齢 |
|--------|------|
| ボブ | 27 |
| アリス | 23 |
```markdown {filename=Markdown}
| 名前 | 年齢 |
|--------|------|
| ボブ | 27 |
| アリス | 23 |
```
#### テーブル内のインラインMarkdown
| 斜体 | 太字 | コード |
| -------- | -------- | ------ |
| *斜体* | **太字** | `コード` |
```markdown {filename=Markdown}
| 斜体 | 太字 | コード |
| -------- | -------- | ------ |
| *斜体* | **太字** | `コード` |
```
### コードブロック
{{< cards >}}
{{< card link="../../guide/syntax-highlighting" title="シンタックスハイライト" icon="sparkles" >}}
{{< /cards >}}
### リスト
#### 順序付きリスト
1. 最初の項目
2. 2番目の項目
3. 3番目の項目
```markdown {filename=Markdown}
1. 最初の項目
2. 2番目の項目
3. 3番目の項目
```
#### 順序なしリスト
* リスト項目
* 別の項目
* さらに別の項目
```markdown {filename=Markdown}
* リスト項目
* 別の項目
* さらに別の項目
```
#### ネストされたリスト
* 果物
* りんご
* オレンジ
* バナナ
* 乳製品
* 牛乳
* チーズ
```markdown {filename=Markdown}
* 果物
* りんご
* オレンジ
* バナナ
* 乳製品
* 牛乳
* チーズ
```
### 画像
![風景](https://picsum.photos/800/600)
```markdown {filename=Markdown}
![風景](https://picsum.photos/800/600)
```
キャプション付き:
![風景](https://picsum.photos/800/600 "Unsplashの風景")
```markdown {filename=Markdown}
![風景](https://picsum.photos/800/600 "Unsplashの風景")
```
## 設定
HugoはMarkdownの解析に[Goldmark](https://github.com/yuin/goldmark)を使用しています。
Markdownのレンダリングは、`hugo.yaml`の`markup.goldmark`で設定できます。
以下はHextraのデフォルト設定です:
```yaml {filename="hugo.yaml"}
markup:
goldmark:
renderer:
unsafe: true
highlight:
noClasses: false
```
その他の設定オプションについては、Hugoのドキュメント[Configure Markup](https://gohugo.io/getting-started/configuration-markup/)を参照してください。
## 学習リソース
* [Markdownガイド](https://www.markdownguide.org/)
* [Markdownチートシート](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)
* [Markdownチュートリアル](https://www.markdowntutorial.com/)
* [Markdownリファレンス](https://commonmark.org/help/)

196
exampleSite/content/docs/guide/markdown.md
View File

@ -1,196 +0,0 @@
---
title: Markdown
weight: 2
---
Hugo supports [Markdown](https://en.wikipedia.org/wiki/Markdown) syntax for formatting text, creating lists, and more. This page will show you some of the most common Markdown syntax examples.
<!--more-->
## Markdown Examples
### Styling Text
| Style | Syntax | Example | Output |
| -------- | -------- | ------ | ------ |
| Bold | `**bold text**` | `**bold text**` | **bold text** |
| Italic | `*italicized text*` | `*italicized text*` | *italicized text* |
| Strikethrough | `~~strikethrough text~~` | `~~strikethrough text~~` | ~~strikethrough text~~ |
| Subscript | `<sub></sub>` | `This is a <sub>subscript</sub> text` | This is a <sub>subscript</sub> text |
| Superscript | `<sup></sup>` | `This is a <sup>superscript</sup> text` | This is a <sup>superscript</sup> text |
### Blockquotes
Blockquote with attribution
> Don't communicate by sharing memory, share memory by communicating.<br>
> — <cite>Rob Pike[^1]</cite>
[^1]: The above quote is excerpted from Rob Pike's [talk](https://www.youtube.com/watch?v=PAAkCSZUG1c) during Gopherfest, November 18, 2015.
```markdown {filename=Markdown}
> Don't communicate by sharing memory, share memory by communicating.<br>
> — <cite>Rob Pike[^1]</cite>
[^1]: The above quote is excerpted from Rob Pike's [talk](https://www.youtube.com/watch?v=PAAkCSZUG1c) during Gopherfest, November 18, 2015.
```
### Alerts
{{< new-feature version="v0.9.0" >}}
Alerts are a Markdown extension based on the blockquote syntax that you can use to emphasize critical information.
[GitHub-style alerts](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#alerts) are supported.
Please make sure you are using the latest version of Hextra and [Hugo v0.134.0](https://github.com/gohugoio/hugo/releases/tag/v0.134.0) or later.
> [!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.
```markdown {filename=Markdown}
> [!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.
```
### Tables
Tables aren't part of the core Markdown spec, but Hugo supports them out-of-the-box.
| Name | Age |
|--------|------|
| Bob | 27 |
| Alice | 23 |
```markdown {filename=Markdown}
| Name | Age |
|--------|------|
| Bob | 27 |
| Alice | 23 |
```
#### Inline Markdown within tables
| Italics | Bold | Code |
| -------- | -------- | ------ |
| *italics* | **bold** | `code` |
```markdown {filename=Markdown}
| Italics | Bold | Code |
| -------- | -------- | ------ |
| *italics* | **bold** | `code` |
```
### Code Blocks
{{< cards >}}
{{< card link="../../guide/syntax-highlighting" title="Syntax Highlighting" icon="sparkles" >}}
{{< /cards >}}
### Lists
#### Ordered List
1. First item
2. Second item
3. Third item
```markdown {filename=Markdown}
1. First item
2. Second item
3. Third item
```
#### Unordered List
* List item
* Another item
* And another item
```markdown {filename=Markdown}
* List item
* Another item
* And another item
```
#### Nested list
* Fruit
* Apple
* Orange
* Banana
* Dairy
* Milk
* Cheese
```markdown {filename=Markdown}
* Fruit
* Apple
* Orange
* Banana
* Dairy
* Milk
* Cheese
```
### Images
![landscape](https://picsum.photos/800/600)
```markdown {filename=Markdown}
![landscape](https://picsum.photos/800/600)
```
With caption:
![landscape](https://picsum.photos/800/600 "Unsplash Landscape")
```markdown {filename=Markdown}
![landscape](https://picsum.photos/800/600 "Unsplash Landscape")
```
## Configuration
Hugo uses [Goldmark](https://github.com/yuin/goldmark) for Markdown parsing.
Markdown rendering can be configured in `hugo.yaml` under `markup.goldmark`.
Below is the default configuration for Hextra:
```yaml {filename="hugo.yaml"}
markup:
goldmark:
renderer:
unsafe: true
highlight:
noClasses: false
```
For more configuration options, see Hugo documentation on [Configure Markup](https://gohugo.io/getting-started/configuration-markup/).
## Learning Resources
* [Markdown Guide](https://www.markdownguide.org/)
* [Markdown Cheatsheet](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)
* [Markdown Tutorial](https://www.markdowntutorial.com/)
* [Markdown Reference](https://commonmark.org/help/)

196
exampleSite/content/docs/guide/markdown.zh-cn.md
View File

@ -1,196 +0,0 @@
---
title: Markdown
weight: 2
---
Hugo 支持使用 [Markdown](https://en.wikipedia.org/wiki/Markdown) 语法来格式化文本、创建列表等。本页将展示一些最常见的 Markdown 语法示例。
<!--more-->
## Markdown 示例
### 文本样式
| 样式 | 语法 | 示例 | 输出 |
| -------- | -------- | ------ | ------ |
| 粗体 | `**粗体文本**` | `**粗体文本**` | **粗体文本** |
| 斜体 | `*斜体文本*` | `*斜体文本*` | *斜体文本* |
| 删除线 | `~~删除线文本~~` | `~~删除线文本~~` | ~~删除线文本~~ |
| 下标 | `<sub></sub>` | `这是一个<sub>下标</sub>文本` | 这是一个<sub>下标</sub>文本 |
| 上标 | `<sup></sup>` | `这是一个<sup>上标</sup>文本` | 这是一个<sup>上标</sup>文本 |
### 引用块
带出处的引用块
> 不要通过共享内存来通信，而要通过通信来共享内存。<br>
> — <cite>Rob Pike[^1]</cite>
[^1]: 以上引用摘自 Rob Pike 在 2015 年 11 月 18 日 Gopherfest 上的[演讲](https://www.youtube.com/watch?v=PAAkCSZUG1c)。
```markdown {filename=Markdown}
> 不要通过共享内存来通信，而要通过通信来共享内存。<br>
> — <cite>Rob Pike[^1]</cite>
[^1]: 以上引用摘自 Rob Pike 在 2015 年 11 月 18 日 Gopherfest 上的[演讲](https://www.youtube.com/watch?v=PAAkCSZUG1c)。
```
### 提示框
{{< new-feature version="v0.9.0" >}}
提示框是基于引用块语法的 Markdown 扩展，可用于强调关键信息。
支持 [GitHub 风格的提示框](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#alerts)。
请确保您使用的是最新版本的 Hextra 和 [Hugo v0.134.0](https://github.com/gohugoio/hugo/releases/tag/v0.134.0) 或更高版本。
> [!NOTE]
> 用户应该知道的有用信息，即使是在浏览内容时。
> [!TIP]
> 帮助用户更好地或更轻松地完成任务的建议。
> [!IMPORTANT]
> 用户需要了解的关键信息，以实现他们的目标。
> [!WARNING]
> 需要用户立即注意的紧急信息，以避免问题。
> [!CAUTION]
> 关于某些操作的风险或负面结果的建议。
```markdown {filename=Markdown}
> [!NOTE]
> 用户应该知道的有用信息，即使是在浏览内容时。
> [!TIP]
> 帮助用户更好地或更轻松地完成任务的建议。
> [!IMPORTANT]
> 用户需要了解的关键信息，以实现他们的目标。
> [!WARNING]
> 需要用户立即注意的紧急信息，以避免问题。
> [!CAUTION]
> 关于某些操作的风险或负面结果的建议。
```
### 表格
表格不是 Markdown 核心规范的一部分，但 Hugo 默认支持它们。
| 姓名 | 年龄 |
|--------|------|
| Bob | 27 |
| Alice | 23 |
```markdown {filename=Markdown}
| 姓名 | 年龄 |
|--------|------|
| Bob | 27 |
| Alice | 23 |
```
#### 表格中的内联 Markdown
| 斜体 | 粗体 | 代码 |
| -------- | -------- | ------ |
| *斜体* | **粗体** | `代码` |
```markdown {filename=Markdown}
| 斜体 | 粗体 | 代码 |
| -------- | -------- | ------ |
| *斜体* | **粗体** | `代码` |
```
### 代码块
{{< cards >}}
{{< card link="../../guide/syntax-highlighting" title="语法高亮" icon="sparkles" >}}
{{< /cards >}}
### 列表
#### 有序列表
1. 第一项
2. 第二项
3. 第三项
```markdown {filename=Markdown}
1. 第一项
2. 第二项
3. 第三项
```
#### 无序列表
* 列表项
* 另一个项
* 再一个项
```markdown {filename=Markdown}
* 列表项
* 另一个项
* 再一个项
```
#### 嵌套列表
* 水果
* 苹果
* 橙子
* 香蕉
* 乳制品
* 牛奶
* 奶酪
```markdown {filename=Markdown}
* 水果
* 苹果
* 橙子
* 香蕉
* 乳制品
* 牛奶
* 奶酪
```
### 图片
![风景](https://picsum.photos/800/600)
```markdown {filename=Markdown}
![风景](https://picsum.photos/800/600)
```
带标题：
![风景](https://picsum.photos/800/600 "Unsplash 风景")
```markdown {filename=Markdown}
![风景](https://picsum.photos/800/600 "Unsplash 风景")
```
## 配置
Hugo 使用 [Goldmark](https://github.com/yuin/goldmark) 进行 Markdown 解析。
Markdown 渲染可以在 `hugo.yaml` 中的 `markup.goldmark` 下进行配置。
以下是 Hextra 的默认配置：
```yaml {filename="hugo.yaml"}
markup:
goldmark:
renderer:
unsafe: true
highlight:
noClasses: false
```
更多配置选项，请参阅 Hugo 文档中的 [配置 Markup](https://gohugo.io/getting-started/configuration-markup/)。
## 学习资源
* [Markdown 指南](https://www.markdownguide.org/)
* [Markdown 速查表](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)
* [Markdown 教程](https://www.markdowntutorial.com/)
* [Markdown 参考](https://commonmark.org/help/)

147
exampleSite/content/docs/guide/organize-files.fa.md
View File

@ -1,147 +0,0 @@
---
title: سازماندهی پرونده‌ها
weight: 1
prev: /docs/guide
---
## ساختار دایرکتوری
به طور پیش‌فرض، Hugo پرونده‌های مارک‌داون را در فهرست `content` جستجو می‌کند و ساختار فهرست، ساختار خروجی نهایی وب‌سایت شما را تعیین می‌کند. همین سایت را به عنوان مثال در نظر بگیرید:
<!--more-->
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="docs" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="getting-started.md" >}}
{{< filetree/folder name="guide" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="organize-files.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/folder name="blog" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="post-1.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
هر یک از پرونده‌های `_index.md` صفحه اصلی هر بخش هستند که برای هر بخش مجزا است. سایر پرونده‌های مارک‌داون صفحه‌های معمولی دیگه‌ای هستند.
```
content
├── _index.md // <- /
├── docs
│ ├── _index.md // <- /docs/
│ ├── getting-started.md // <- /docs/getting-started/
│ └── guide
│ ├── _index.md // <- /docs/guide/
│ └── organize-files.md // <- /docs/guide/organize-files/
└── blog
├── _index.md // <- /blog/
└── post-1.md // <- /blog/post-1/
```
## طرح‌بندی‌ها
هگزترا سه طرح‌بندی برای انواع مختلف محتوا ارائه می‌کند:
| طرح‌بندی | دایرکتوری | ویژگی‌ها |
| :-------- | :-------------------- | :--------------------------------------------------------------- |
| `docs` | `content/docs/` | ایده‌آل برای مستندات ساختار یافته، مانند این بخش. |
| `blog` | `content/blog/` | برای نوشته‌های وبلاگ، با هر فهرست‌بندی و هم نمایش جزئیات مقاله. |
| `default` | همه دایرکتوری‌های دیگر | مشاهده مقاله تک صفحه‌ای بدون نوار کناری. |
برای سفارشی کردن یک بخش برای منعکس کردن رفتار یک طرح داخلی، نوع طرح‌بندی مورد نظر را در قسمت بالایی قسمت _index.md` مشخص کنید.
```yaml {filename="content/my-docs/_index.md"}
---
title: مستندات من
cascade:
type: docs
---
```
پیکربندی مثال بالا تضمین می‌کند که پرونده‌های محتوای در داخل `content/my-docs/` به‌طور پیش‌فرض به عنوان مستندات (نوع `docs`) مورد استفاده قرار می‌گیرند.
## ناوبری نوار کناری
ناوبری نوار کناری به طور خودکار براساس حروف الفبا ایجاد می‌شود. برای پیکربندی دستی ترتیب نوار کناری، می‌توانید از پارامتر `weight` در قسمت بالایی پرونده‌های مارک‌داون استفاده کنید.
```yaml {filename="content/docs/guide/_index.md"}
---
title: راهنما
weight: 2
---
```
{{< callout emoji="ℹ️">}}
توصیه می‌کنیم نوار کناری خیلی عمیق نباشد. اگر محتوای زیادی دارید، آنها را **به چند بخش تقسیم کنید**.
{{< /callout >}}
## پیکربندی دایرکتوری محتوا
به طور پیش‌فرض، دایرکتوری ریشه `content/` توسط Hugo برای ساخت سایت استفاده می‌شود.
اگر نیاز به استفاده از دایرکتوری متفاوتی برای محتوا دارید، برای مثال `docs/`، این کار را می‌توانید با تنظیم پارامتر [`contentDir`](https://gohugo.io/getting-started/configuration/#contentdir) در پیکربندی سایت `hugo.yaml` انجام دهید.
## افزودن تصاویر
برای افزودن تصاویر، ساده‌ترین راه این است که پرونده‌های عکس‌ها را در همان دایرکتوری پرونده مارک‌داون قرار دهید.
برای مثال، یک پرونده عکس `image.png` را در کنار پرونده `my-page.md` اضافه کنید:
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
سپس، می‌توانید از سینتکس مارک‌داون زیر برای افزودن عکس به محتوا استفاده کنید:
```markdown {filename="content/docs/my-page.md"}
![](image.png)
```
همچنین می‌توانید از ویژگی [بسته‌های صفحه][page-bundles] Hugo برای سازماندهی پرونده‌های عکس‌ها همراه با پرونده مارک‌داون استفاده کنید. برای رسیدن به این هدف، پرونده `my-page.md` را به یک دایرکتوری `my-page` تبدیل کنید و محتوا را در پرونده‌ای به نام `index.md` قرار دهید و پرونده‌های عکس‌ها را در دایرکتوری `my-page` قرار دهید:
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/folder name="my-page" >}}
{{< filetree/file name="index.md" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
```markdown {filename="content/docs/my-page/index.md"}
![](image.png)
```
همچنین می‌توانید پرونده‌های عکس‌ها را در دایرکتوری `static` قرار دهید که عکس‌ها را برای همه صفحات در دسترس قرار می‌دهد:
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
{{< filetree/folder name="images" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
توجه داشته باشید که مسیر عکس با یک اسلش `/` شروع می‌شود و نسبت به دایرکتوری استاتیک است:
```markdown {filename="content/docs/my-page.md"}
![](/images/image.png)
```
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles

187
exampleSite/content/docs/guide/organize-files.ja.md
View File

@ -1,187 +0,0 @@
---
title: ファイルの整理
weight: 1
prev: /docs/guide
---
## ディレクトリ構造
デフォルトでは、Hugoは`content`ディレクトリ内のMarkdownファイルを検索し、ディレクトリの構造がウェブサイトの最終的な出力構造を決定します。
このサイトを例に取ります：
<!--more-->
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="docs" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="getting-started.md" >}}
{{< filetree/folder name="guide" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="organize-files.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/folder name="blog" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="post-1.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
各`_index.md`ファイルは、対応するセクションのインデックスページです。他のMarkdownファイルは通常のページです。
```
content
├── _index.md // <- /
├── docs
│ ├── _index.md // <- /docs/
│ ├── getting-started.md // <- /docs/getting-started/
│ └── guide
│ ├── _index.md // <- /docs/guide/
│ └── organize-files.md // <- /docs/guide/organize-files/
└── blog
├── _index.md // <- /blog/
└── post-1.md // <- /blog/post-1/
```
## レイアウト
Hextraは、異なるコンテンツタイプに対して3つのレイアウトを提供します：
| レイアウト | ディレクトリ | 特徴 |
| :-------- | :-------------------- | :--------------------------------------------------------------- |
| `docs` | `content/docs/` | 構造化されたドキュメントに最適で、このセクションと同じです。 |
| `blog` | `content/blog/` | ブログ投稿用で、リスト表示と詳細記事表示の両方があります。 |
| `default` | その他のディレクトリ | サイドバーなしの単一ページ記事表示です。 |
セクションの動作をビルトインレイアウトと同じにするには、セクションの`_index.md`のフロントマターで希望するタイプを指定します。
```yaml {filename="content/my-docs/_index.md"}
---
title: My Docs
cascade:
type: docs
---
```
上記の設定例により、`content/my-docs/`内のコンテンツファイルはデフォルトでドキュメント（`docs`タイプ）として扱われます。
## サイドバーナビゲーション
サイドバーナビゲーションは、コンテンツの整理に基づいて自動的に生成されます。サイドバーの順序を手動で設定するには、Markdownファイルのフロントマターで`weight`パラメータを使用します。
```yaml {filename="content/docs/guide/_index.md"}
---
title: Guide
weight: 2
---
```
{{< callout emoji="ℹ️">}}
サイドバーがあまり深くならないようにすることをお勧めします。多くのコンテンツがある場合は、**複数のセクションに分割する**ことを検討してください。
{{< /callout >}}
## パンくずナビゲーション
パンくずは、`/content`のディレクトリ構造に基づいて自動生成されます。
例えば、[上記のファイル構造](#directory-structure)を考えます。その構造に基づいて、`/docs/guide/organize-files/`ページの上部にパンくずが自動的に表示されます：
```
Documentation > Guide > Organize Files
```
### パンくずリンクのタイトルをカスタマイズ
デフォルトでは、各パンくずリンクはそのページの`title`パラメータに基づいて生成されます。これをカスタマイズするには、`linkTitle`を指定します。
例えば、`Organize Files`の代わりに`Foo Bar`と表示したい場合：
```yaml {filename="content/docs/guide/organize-files.md"}
---
linkTitle: Foo Bar
title: Organize Files
---
```
これにより、以下のパンくずが生成されます：
```
Documentation > Guide > Foo Bar
```
### パンくずを非表示にする
ページのフロントマターで`breadcrumbs: false`を指定することで、パンくずを完全に非表示にできます：
```yaml {filename="content/docs/guide/organize-files.md"}
---
breadcrumbs: false
title: Organize Files
---
```
## コンテンツディレクトリの設定
デフォルトでは、Hugoはサイトを構築するためにルートの`content/`ディレクトリを使用します。
例えば`docs/`など、異なるディレクトリをコンテンツに使用する必要がある場合は、サイト設定`hugo.yaml`で[`contentDir`](https://gohugo.io/getting-started/configuration/#contentdir)パラメータを設定することで行えます。
## 画像の追加
画像を追加する最も簡単な方法は、画像ファイルをMarkdownファイルと同じディレクトリに置くことです。
例えば、`my-page.md`ファイルと同じディレクトリに`image.png`ファイルを追加します：
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
その後、以下のMarkdown構文を使用してコンテンツに画像を追加できます：
```markdown {filename="content/docs/my-page.md"}
![](image.png)
```
また、Hugoの[ページバンドル][page-bundles]機能を利用して、画像ファイルをMarkdownファイルと一緒に整理することもできます。そのためには、`my-page.md`ファイルを`my-page`ディレクトリに変換し、コンテンツを`index.md`というファイルに置き、画像ファイルを`my-page`ディレクトリ内に置きます：
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/folder name="my-page" >}}
{{< filetree/file name="index.md" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
```markdown {filename="content/docs/my-page/index.md"}
![](image.png)
```
または、画像ファイルを`static`ディレクトリに置くこともできます。これにより、すべてのページで画像が利用可能になります：
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
{{< filetree/folder name="images" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
画像パスはスラッシュ`/`で始まり、`static`ディレクトリからの相対パスであることに注意してください：
```markdown {filename="content/docs/my-page.md"}
![](/images/image.png)
```
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles

187
exampleSite/content/docs/guide/organize-files.md
View File

@ -1,187 +0,0 @@
---
title: Organize Files
weight: 1
prev: /docs/guide
---
## Directory Structure
By default, Hugo searches for Markdown files in the `content` directory, and the structure of the directory determines the final output structure of your website.
Take this site as an example:
<!--more-->
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="docs" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="getting-started.md" >}}
{{< filetree/folder name="guide" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="organize-files.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/folder name="blog" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="post-1.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
Each of the `_index.md` files is the index page for the corresponding section. The other Markdown files are regular pages.
```
content
├── _index.md // <- /
├── docs
│ ├── _index.md // <- /docs/
│ ├── getting-started.md // <- /docs/getting-started/
│ └── guide
│ ├── _index.md // <- /docs/guide/
│ └── organize-files.md // <- /docs/guide/organize-files/
└── blog
├── _index.md // <- /blog/
└── post-1.md // <- /blog/post-1/
```
## Layouts
Hextra offers three layouts for different content types:
| Layout | Directory | Features |
| :-------- | :-------------------- | :--------------------------------------------------------------- |
| `docs` | `content/docs/` | Ideal for structured documentation, same as this section. |
| `blog` | `content/blog/` | For blog postings, with both listing and detailed article views. |
| `default` | All other directories | Single-page article view without sidebar. |
To customize a section to mirror the behavior of a built-in layout, specify the desired type in the front matter of the section's `_index.md`.
```yaml {filename="content/my-docs/_index.md"}
---
title: My Docs
cascade:
type: docs
---
```
The above example configuration ensures that the content files inside `content/my-docs/` will be treated as documentation (`docs` type) by default.
## Sidebar Navigation
The sidebar navigation is generated automatically based on the content organization alphabetically. To manually configure the sidebar order, we can use the `weight` parameter in the front matter of the Markdown files.
```yaml {filename="content/docs/guide/_index.md"}
---
title: Guide
weight: 2
---
```
{{< callout emoji="ℹ️">}}
It is recommended to keep the sidebar not too deep. If you have a lot of content, consider **splitting them into multiple sections**.
{{< /callout >}}
## Breadcrumb Navigation
Breadcrumbs are auto-generated based on the directory structure of `/content`.
For example, consider the file structure [demonstrated above](#directory-structure). Given that structure, the breadcrumbs atop the page at `/docs/guide/organize-files/` would appear automatically as follows:
```
Documentation > Guide > Organize Files
```
### Customizing Breadcrumb Link Titles
By default, each breadcrumb link is generated based on that page's `title` parameter. You can customize this by specifying a `linkTitle`.
For example, if instead of `Organize Files` we wanted the breadcrumb to be `Foo Bar`:
```yaml {filename="content/docs/guide/organize-files.md"}
---
linkTitle: Foo Bar
title: Organize Files
---
```
This would now generate the following breadcrumbs:
```
Documentation > Guide > Foo Bar
```
### Hiding Breadcrumbs
You can hide breadcrumbs completely from a page by specifying `breadcrumbs: false` in its front matter:
```yaml {filename="content/docs/guide/organize-files.md"}
---
breadcrumbs: false
title: Organize Files
---
```
## Configure Content Directory
By default, the root `content/` directory is used by Hugo to build the site.
If you need to use a different directory for content, for example `docs/`, this can be done by setting the [`contentDir`](https://gohugo.io/getting-started/configuration/#contentdir) parameter in the site configuration `hugo.yaml`.
## Add Images
To add images, the easiest way is to put the image files in the same directory as the Markdown file.
For example, add an image file `image.png` alongside the `my-page.md` file:
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
Then, we can use the following Markdown syntax to add the image to the content:
```markdown {filename="content/docs/my-page.md"}
![](image.png)
```
We can also utilize the [page bundles][page-bundles] feature of Hugo to organize the image files together with the Markdown file. To achieve that, turn the `my-page.md` file into a directory `my-page` and put the content into a file named `index.md`, and put the image files inside the `my-page` directory:
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/folder name="my-page" >}}
{{< filetree/file name="index.md" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
```markdown {filename="content/docs/my-page/index.md"}
![](image.png)
```
Alternatively, we can also put the image files in the `static` directory, which will make the images available for all pages:
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
{{< filetree/folder name="images" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
Note that the image path begins with a slash `/` and is relative to the static directory:
```markdown {filename="content/docs/my-page.md"}
![](/images/image.png)
```
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles

187
exampleSite/content/docs/guide/organize-files.zh-cn.md
View File

@ -1,187 +0,0 @@
---
title: 组织文件
weight: 1
prev: /docs/guide
---
## 目录结构
默认情况下，Hugo 会在 `content` 目录中查找 Markdown 文件，目录的结构决定了网站最终的输出结构。
以本网站为例：
<!--more-->
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="docs" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="getting-started.md" >}}
{{< filetree/folder name="guide" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="organize-files.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/folder name="blog" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="post-1.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
每个 `_index.md` 文件都是对应部分的索引页面。其他 Markdown 文件则是常规页面。
```
content
├── _index.md // <- /
├── docs
│ ├── _index.md // <- /docs/
│ ├── getting-started.md // <- /docs/getting-started/
│ └── guide
│ ├── _index.md // <- /docs/guide/
│ └── organize-files.md // <- /docs/guide/organize-files/
└── blog
├── _index.md // <- /blog/
└── post-1.md // <- /blog/post-1/
```
## 布局
Hextra 为不同类型的内容提供了三种布局：
| 布局 | 目录 | 特性 |
| :-------- | :------------------ | :----------------------------------------------------------- |
| `docs` | `content/docs/` | 适合结构化文档，与本部分相同。 |
| `blog` | `content/blog/` | 用于博客文章，包含列表和详细文章视图。 |
| `default` | 其他所有目录 | 单页文章视图，无侧边栏。 |
要将某个部分自定义为与内置布局相同的行为，可以在该部分的 `_index.md` 的前言中指定所需的类型。
```yaml {filename="content/my-docs/_index.md"}
---
title: 我的文档
cascade:
type: docs
---
```
上述示例配置确保 `content/my-docs/` 中的内容文件默认会被视为文档（`docs` 类型）。
## 侧边栏导航
侧边栏导航会根据内容组织按字母顺序自动生成。要手动配置侧边栏顺序，可以在 Markdown 文件的前言中使用 `weight` 参数。
```yaml {filename="content/docs/guide/_index.md"}
---
title: 指南
weight: 2
---
```
{{< callout emoji="ℹ️">}}
建议不要让侧边栏过深。如果你有很多内容，考虑**将它们分成多个部分**。
{{< /callout >}}
## 面包屑导航
面包屑导航会根据 `/content` 的目录结构自动生成。
例如，考虑上面[展示的目录结构](#directory-structure)。根据该结构，页面 `/docs/guide/organize-files/` 顶部的面包屑导航会自动显示如下：
```
文档 > 指南 > 组织文件
```
### 自定义面包屑链接标题
默认情况下，每个面包屑链接是根据页面的 `title` 参数生成的。你可以通过指定 `linkTitle` 来自定义。
例如，如果我们希望面包屑显示为 `Foo Bar` 而不是 `Organize Files`：
```yaml {filename="content/docs/guide/organize-files.md"}
---
linkTitle: Foo Bar
title: 组织文件
---
```
现在会生成以下面包屑：
```
文档 > 指南 > Foo Bar
```
### 隐藏面包屑
你可以通过在页面的前言中指定 `breadcrumbs: false` 来完全隐藏面包屑：
```yaml {filename="content/docs/guide/organize-files.md"}
---
breadcrumbs: false
title: 组织文件
---
```
## 配置内容目录
默认情况下，Hugo 使用根目录 `content/` 来构建网站。
如果你需要使用不同的目录来存放内容，例如 `docs/`，可以通过在站点配置文件 `hugo.yaml` 中设置 [`contentDir`](https://gohugo.io/getting-started/configuration/#contentdir) 参数来实现。
## 添加图片
添加图片的最简单方法是将图片文件放在与 Markdown 文件相同的目录中。
例如，将图片文件 `image.png` 与 `my-page.md` 文件放在一起：
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
然后，我们可以使用以下 Markdown 语法将图片添加到内容中：
```markdown {filename="content/docs/my-page.md"}
![](image.png)
```
我们还可以利用 Hugo 的 [页面包][page-bundles] 功能将图片文件与 Markdown 文件一起组织。为此，将 `my-page.md` 文件转换为目录 `my-page`，并将内容放入名为 `index.md` 的文件中，然后将图片文件放入 `my-page` 目录中：
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/folder name="my-page" >}}
{{< filetree/file name="index.md" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
```markdown {filename="content/docs/my-page/index.md"}
![](image.png)
```
或者，我们也可以将图片文件放在 `static` 目录中，这样所有页面都可以访问这些图片：
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
{{< filetree/folder name="images" >}}
{{< filetree/file name="image.png" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
注意，图片路径以斜杠 `/` 开头，并且相对于静态目录：
```markdown {filename="content/docs/my-page.md"}
![](/images/image.png)
```
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles

21
exampleSite/content/docs/guide/shortcodes/_index.fa.md
View File

@ -1,21 +0,0 @@
---
title: کدهای کوتاه
weight: 9
prev: /docs/guide/diagrams
next: /docs/guide/shortcodes/filetree
---
[کدهای کوتاه Hugo](https://gohugo.io/content-management/shortcodes/) قطعه‌های ساده‌ای در داخل پرونده‌های محتوای شما هستند که قالب‌های داخلی یا سفارشی را فراخوانی می‌کنند.
هگزترا مجموعه‌ای از کدهای کوتاه زیبا را برای بهبود محتوای شما ارائه می‌کند.
{{< cards >}}
{{< card link="filetree" title="FileTree" icon="folder-tree" >}}
{{< card link="icon" title="آیکون" icon="badge-check" >}}
{{< card link="details" title="جزئیات" icon="chevron-right" >}}
{{< card link="tabs" title="زبانه‌ها" icon="collection" >}}
{{< card link="callout" title="فراخوانی" icon="warning" >}}
{{< card link="cards" title="کارت‌ها" icon="card" >}}
{{< card link="steps" title="مراحل" icon="one" >}}
{{< /cards >}}

29
exampleSite/content/docs/guide/shortcodes/_index.ja.md
View File

@ -1,29 +0,0 @@
---
title: ショートコード
weight: 9
prev: /docs/guide/diagrams
next: /docs/guide/shortcodes/callout
---
[Hugo ショートコード](https://gohugo.io/content-management/shortcodes/)は、コンテンツファイル内に埋め込まれるシンプルなスニペットで、組み込みまたはカスタムテンプレートを呼び出します。
Hextra は、コンテンツを強化するための美しいショートコードのコレクションを提供します。
{{< cards >}}
{{< card link="callout" title="コールアウト" icon="warning" >}}
{{< card link="cards" title="カード" icon="card" >}}
{{< card link="details" title="詳細" icon="chevron-right" >}}
{{< card link="filetree" title="FileTree" icon="folder-tree" >}}
{{< card link="icon" title="アイコン" icon="badge-check" >}}
{{< card link="steps" title="ステップ" icon="one" >}}
{{< card link="tabs" title="タブ" icon="collection" >}}
{{< /cards >}}
<div style="padding-top:4rem"></div>
Hugo と Hextra が提供する追加のショートコード:
{{< cards >}}
{{< card link="jupyter" title="Jupyter Notebook" icon="jupyter" tag="alpha" >}}
{{< card link="others" title="その他" icon="view-grid" >}}
{{< /cards >}}

29
exampleSite/content/docs/guide/shortcodes/_index.md
View File

@ -1,29 +0,0 @@
---
title: Shortcodes
weight: 9
prev: /docs/guide/diagrams
next: /docs/guide/shortcodes/callout
---
[Hugo Shortcodes](https://gohugo.io/content-management/shortcodes/) are simple snippets inside your content files calling built-in or custom templates.
Hextra provides a collection of beautiful shortcodes to enhance your content.
{{< cards >}}
{{< card link="callout" title="Callout" icon="warning" >}}
{{< card link="cards" title="Cards" icon="card" >}}
{{< card link="details" title="Details" icon="chevron-right" >}}
{{< card link="filetree" title="FileTree" icon="folder-tree" >}}
{{< card link="icon" title="Icon" icon="badge-check" >}}
{{< card link="steps" title="Steps" icon="one" >}}
{{< card link="tabs" title="Tabs" icon="collection" >}}
{{< /cards >}}
<div style="padding-top:4rem"></div>
Additional shortcodes provided by Hugo and Hextra:
{{< cards >}}
{{< card link="jupyter" title="Jupyter Notebook" icon="jupyter" tag="alpha" >}}
{{< card link="others" title="Others" icon="view-grid" >}}
{{< /cards >}}

29
exampleSite/content/docs/guide/shortcodes/_index.zh-cn.md
View File

@ -1,29 +0,0 @@
---
title: 短代码
weight: 9
prev: /docs/guide/diagrams
next: /docs/guide/shortcodes/callout
---
[Hugo 短代码](https://gohugo.io/content-management/shortcodes/)是内容文件中的简单片段，用于调用内置或自定义模板。
Hextra 提供了一系列精美的短代码，以增强您的内容。
{{< cards >}}
{{< card link="callout" title="标注" icon="warning" >}}
{{< card link="cards" title="卡片" icon="card" >}}
{{< card link="details" title="详情" icon="chevron-right" >}}
{{< card link="filetree" title="文件树" icon="folder-tree" >}}
{{< card link="icon" title="图标" icon="badge-check" >}}
{{< card link="steps" title="步骤" icon="one" >}}
{{< card link="tabs" title="标签页" icon="collection" >}}
{{< /cards >}}
<div style="padding-top:4rem"></div>
Hugo 和 Hextra 提供的其他短代码：
{{< cards >}}
{{< card link="jupyter" title="Jupyter 笔记本" icon="jupyter" tag="alpha" >}}
{{< card link="others" title="其他" icon="view-grid" >}}
{{< /cards >}}

78
exampleSite/content/docs/guide/shortcodes/callout.fa.md
View File

@ -1,78 +0,0 @@
---
title: کامپوننت فراخوانی
linkTitle: فراخوانی
aliases:
- فراخوانی‌ها
---
یک کامپوننت داخلی برای نشان دادن اطلاعات مهم به خواننده.
<!--more-->
## مثال
{{< callout emoji="👾">}}
**فراخوانی** یک متن کوتاه است که برای جلب توجه در نظر گرفته شده است.
{{< /callout >}}
{{< callout type="info" >}}
**فراخوانی** یک متن کوتاه است که برای جلب توجه در نظر گرفته شده است.
{{< /callout >}}
{{< callout type="warning" >}}
**فراخوانی** یک متن کوتاه است که برای جلب توجه در نظر گرفته شده است.
{{< /callout >}}
{{< callout type="error" >}}
**فراخوانی** یک متن کوتاه است که برای جلب توجه در نظر گرفته شده است.
{{< /callout >}}
## استفاده
### پیش‌فرض
{{< callout emoji="🌐">}}
Hugo را می‌توانید برای ایجاد طیف گسترده‌ای از وب‌سایت‌ها، از جمله وبلاگ‌ها، نمونه‌کارها، سایت‌های مستندسازی و غیره استفاده کرد.
{{< /callout >}}
```markdown
{{</* callout emoji="🌐" */>}}
Hugo را می‌توانید برای ایجاد طیف گسترده‌ای از وب‌سایت‌ها، از جمله وبلاگ‌ها، نمونه‌کارها، سایت‌های مستندسازی و غیره استفاده کرد.
{{</* /callout */>}}
```
### اطلاعات
{{< callout type="info" >}}
لطفا برای مشاهده آخرین نسخه‌ها به گیت‌هاب مراجعه کنید.
{{< /callout >}}
```markdown
{{</* callout type="info" */>}}
لطفا برای مشاهده آخرین نسخه‌ها به گیت‌هاب مراجعه کنید.
{{</* /callout */>}}
```
### هشدار
{{< callout type="warning" >}}
این API در نسخه بعدی منسوخ خواهد شد.
{{< /callout >}}
```markdown
{{</* callout type="warning" */>}}
این API در نسخه بعدی منسوخ خواهد شد.
{{</* /callout */>}}
```
### خطا
{{< callout type="error" >}}
مشکلی پیش آمد و اتفاقی رخ خواهد شد.
{{< /callout >}}
```markdown
{{</* callout type="error" */>}}
مشکلی پیش آمد و اتفاقی رخ خواهد شد.
{{</* /callout */>}}
```

83
exampleSite/content/docs/guide/shortcodes/callout.ja.md
View File

@ -1,83 +0,0 @@
---
title: コールアウトコンポーネント
linkTitle: コールアウト
aliases:
- callouts
prev: /docs/guide/shortcodes
---
読者に重要な情報を示すための組み込みコンポーネントです。
<!--more-->
> [!NOTE]
> [GitHubスタイルのアラート](../../markdown#alerts)は[v0.9.0](https://github.com/imfing/hextra/releases/tag/v0.9.0)以降でサポートされています。
> これはMarkdown構文を活用してコールアウトをレンダリングし、コンテンツの移植性と可読性を向上させます。
## 例
{{< callout emoji="👾">}}
**コールアウト**は、注意を引くための短いテキストです。
{{< /callout >}}
{{< callout type="info" >}}
**コールアウト**は、注意を引くための短いテキストです。
{{< /callout >}}
{{< callout type="warning" >}}
**コールアウト**は、注意を引くための短いテキストです。
{{< /callout >}}
{{< callout type="error" >}}
**コールアウト**は、注意を引くための短いテキストです。
{{< /callout >}}
## 使用方法
### デフォルト
{{< callout emoji="🌐">}}
Hugoは、ブログ、ポートフォリオ、ドキュメントサイトなど、さまざまなウェブサイトを作成するために使用できます。
{{< /callout >}}
```markdown
{{</* callout emoji="🌐" */>}}
Hugoは、ブログ、ポートフォリオ、ドキュメントサイトなど、さまざまなウェブサイトを作成するために使用できます。
{{</* /callout */>}}
```
### 情報
{{< callout type="info" >}}
最新のリリースを確認するには、GitHubをご覧ください。
{{< /callout >}}
```markdown
{{</* callout type="info" */>}}
最新のリリースを確認するには、GitHubをご覧ください。
{{</* /callout */>}}
```
### 警告
{{< callout type="warning" >}}
このAPIは次のバージョンで非推奨になります。
{{< /callout >}}
```markdown
{{</* callout type="warning" */>}}
**コールアウト**は、注意を引くための短いテキストです。
{{</* /callout */>}}
```
### エラー
{{< callout type="error" >}}
何か問題が発生し、爆発しそうです。
{{< /callout >}}
```markdown
{{</* callout type="error" */>}}
何か問題が発生し、爆発しそうです。
{{</* /callout */>}}
```

83
exampleSite/content/docs/guide/shortcodes/callout.md
View File

@ -1,83 +0,0 @@
---
title: Callout Component
linkTitle: Callout
aliases:
- callouts
prev: /docs/guide/shortcodes
---
A built-in component to show important information to the reader.
<!--more-->
> [!NOTE]
> [GitHub-style alerts](../../markdown#alerts) are supported since [v0.9.0](https://github.com/imfing/hextra/releases/tag/v0.9.0).
> It leverages Markdown syntax to render the callout which ensures better portability and readability of the content.
## Example
{{< callout emoji="👾">}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
{{< callout type="info" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
{{< callout type="warning" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
{{< callout type="error" >}}
A **callout** is a short piece of text intended to attract attention.
{{< /callout >}}
## Usage
### Default
{{< callout emoji="🌐">}}
Hugo can be used to create a wide variety of websites, including blogs, portfolios, documentation sites, and more.
{{< /callout >}}
```markdown
{{</* callout emoji="🌐" */>}}
Hugo can be used to create a wide variety of websites, including blogs, portfolios, documentation sites, and more.
{{</* /callout */>}}
```
### Info
{{< callout type="info" >}}
Please visit GitHub to see the latest releases.
{{< /callout >}}
```markdown
{{</* callout type="info" */>}}
Please visit GitHub to see the latest releases.
{{</* /callout */>}}
```
### Warning
{{< callout type="warning" >}}
This API will be deprecated in the next version.
{{< /callout >}}
```markdown
{{</* callout type="warning" */>}}
A **callout** is a short piece of text intended to attract attention.
{{</* /callout */>}}
```
### Error
{{< callout type="error" >}}
Something went wrong and it's going to explode.
{{< /callout >}}
```markdown
{{</* callout type="error" */>}}
Something went wrong and it's going to explode.
{{</* /callout */>}}
```

83
exampleSite/content/docs/guide/shortcodes/callout.zh-cn.md
View File

@ -1,83 +0,0 @@
---
title: 提示框组件
linkTitle: 提示框
aliases:
- 提示框
prev: /docs/guide/shortcodes
---
一个内置组件，用于向读者展示重要信息。
<!--more-->
> [!NOTE]
> 自 [v0.9.0](https://github.com/imfing/hextra/releases/tag/v0.9.0) 起支持 [GitHub 风格的提醒](../../markdown#alerts)。
> 它利用 Markdown 语法来渲染提示框，确保内容具有更好的可移植性和可读性。
## 示例
{{< callout emoji="👾">}}
**提示框** 是一段简短的文本，旨在吸引注意力。
{{< /callout >}}
{{< callout type="info" >}}
**提示框** 是一段简短的文本，旨在吸引注意力。
{{< /callout >}}
{{< callout type="warning" >}}
**提示框** 是一段简短的文本，旨在吸引注意力。
{{< /callout >}}
{{< callout type="error" >}}
**提示框** 是一段简短的文本，旨在吸引注意力。
{{< /callout >}}
## 用法
### 默认
{{< callout emoji="🌐">}}
Hugo 可用于创建各种类型的网站，包括博客、作品集、文档站点等。
{{< /callout >}}
```markdown
{{</* callout emoji="🌐" */>}}
Hugo 可用于创建各种类型的网站，包括博客、作品集、文档站点等。
{{</* /callout */>}}
```
### 信息
{{< callout type="info" >}}
请访问 GitHub 查看最新版本。
{{< /callout >}}
```markdown
{{</* callout type="info" */>}}
请访问 GitHub 查看最新版本。
{{</* /callout */>}}
```
### 警告
{{< callout type="warning" >}}
此 API 将在下一个版本中弃用。
{{< /callout >}}
```markdown
{{</* callout type="warning" */>}}
**提示框** 是一段简短的文本，旨在吸引注意力。
{{</* /callout */>}}
```
### 错误
{{< callout type="error" >}}
出错了，系统即将崩溃。
{{< /callout >}}
```markdown
{{</* callout type="error" */>}}
出错了，系统即将崩溃。
{{</* /callout */>}}
```

64
exampleSite/content/docs/guide/shortcodes/cards.fa.md
View File

@ -1,64 +0,0 @@
---
title: کامپوننت کارت‌ها
linkTitle: کارت‌ها
---
## مثال
{{< cards >}}
{{< card link="../callout" title="فراخوانی" icon="warning" >}}
{{< card link="/fa" title="بدون آیکون" >}}
{{< /cards >}}
{{< cards >}}
{{< card link="/" title="کارت تصویر" image="https://source.unsplash.com/featured/800x600?landscape" subtitle="یک چشم‌انداز Unsplash" >}}
{{< card link="/" title="تصویر محلی" image="/images/card-image-unprocessed.jpg" subtitle="تصویر خام در دایرکتوری استاتیک است." >}}
{{< card link="/" title="تصویر محلی" image="images/space.jpg" subtitle="تصویر در دایرکتوری assets می‌باشد و پردازش توسط Hugo شده است." method="Resize" options="600x q80 webp" >}}
{{< /cards >}}
## استفاده
```
{{</* cards */>}}
{{</* card link="../callout" title="فراخوانی" icon="warning" */>}}
{{</* card link="/fa" title="بدون آیکون" */>}}
{{</* /cards */>}}
```
```
{{</* cards */>}}
{{</* card link="/" title="کارت تصویر" image="https://source.unsplash.com/featured/800x600?landscape" subtitle="یک چشم‌انداز Unsplash" */>}}
{{</* card link="/" title="تصویر محلی" image="/images/card-image-unprocessed.jpg" subtitle="تصویر خام در دایرکتوری استاتیک است." */>}}
{{</* card link="/" title="تصویر محلی" image="images/space.jpg" subtitle="تصویر در دایرکتوری assets می‌باشد و پردازش توسط Hugo شده است." method="Resize" options="600x q80 webp" */>}}
{{</* /cards */>}}
```
## پارامترهای کارت
| پارامتر | توضیحات |
|----------- |---------------------------------------|
| `link` | نشانی اینترنتی (داخلی یا خارجی). |
| `title` | عنوان برای کارت. |
| `subtitle` | عنوان زیرنویس (از مارک‌داون پشتیبانی می‌کند).. |
| `icon` | نام آیکون. |
## کارت تصویر
علاوه بر این، کارت از افزودن تصویر و پردازش از طریق این پارامترها پشتیبانی می‌کند:
| پارامتر | توضیحات |
|----------- |---------------------------------------------|
| `image` | نشانی اینترنتی تصویر کارت را مشخص می‌کند. |
| `method` | روش پردازش تصویر Hugo را تنظیم می‌کند. |
| `options` | گزینه‌های پردازش تصویر Hugo را پیکربندی می‌کند. |
کارت از سه نوع تصویر پشتیبانی می‌کند:
1. تصویر از راه دور: نشانی اینترنتی کامل در پارامتر `image`.
2. تصویر استاتیک: از مسیر نسبی در دایرکتوری `static/` Hugo استفاده کنید.
3. تصویر پردازش شده: از مسیر نسبی در دایرکتوری `assets/` Hugo استفاده کنید.
هگزترا در صورت نیاز به پردازش تصویر در حین ساخت، به طور خودکار تشخیص می‌دهد و پارامتر `options` یا تنظیمات پیش‌فرض را اعمال می‌کند (تغییر اندازه، 800x، کیفیت 80، فرمت WebP).
در حال حاضر این `method` را پشتیبانی می‌کند: `Resize`، `Fit`، `Fill` و `Crop`.
برای اطلاعات بیشتر در مورد دستورات، روش‌ها و گزینه‌های پردازش تصویر داخلی Hugo به [مستندات پردازش تصویر](https://gohugo.io/content-management/image-processing/) آن‌ها مراجعه کنید.

115
exampleSite/content/docs/guide/shortcodes/cards.ja.md
View File

@ -1,115 +0,0 @@
---
title: カードコンポーネント
linkTitle: カード
---
## 例
{{< cards >}}
{{< card link="../callout" title="コールアウト" icon="warning" >}}
{{< card link="../callout" title="タグ付きカード" icon="tag" tag="カスタムタグ">}}
{{< card link="/" title="アイコンなし" >}}
{{< /cards >}}
{{< cards >}}
{{< card link="/" title="画像カード" image="https://github.com/user-attachments/assets/71b7e3ec-1a8d-4582-b600-5425c6cc0407" subtitle="インターネット画像" >}}
{{< card link="/" title="ローカル画像" image="/images/card-image-unprocessed.jpg" subtitle="staticディレクトリ下の未加工画像。" >}}
{{< card link="/" title="ローカル画像" image="images/space.jpg" subtitle="assetsディレクトリ下の画像、Hugoで処理済み。" method="Resize" options="600x q80 webp" >}}
{{< /cards >}}
## 使用方法
```
{{</* cards */>}}
{{</* card link="../callout" title="コールアウト" icon="warning" */>}}
{{</* card link="../callout" title="タグ付きカード" icon="tag" tag= "カスタムタグ" */>}}
{{</* card link="/" title="アイコンなし" */>}}
{{</* /cards */>}}
```
```
{{</* cards */>}}
{{</* card link="/" title="画像カード" image="https://source.unsplash.com/featured/800x600?landscape" subtitle="Unsplashの風景画像" */>}}
{{</* card link="/" title="ローカル画像" image="/images/card-image-unprocessed.jpg" subtitle="staticディレクトリ下の未加工画像。" */>}}
{{</* card link="/" title="ローカル画像" image="images/space.jpg" subtitle="assetsディレクトリ下の画像、Hugoで処理済み。" method="Resize" options="600x q80 webp" */>}}
{{</* /cards */>}}
```
## カードパラメータ
| パラメータ | 説明 |
|----------- |-----------------------------------------------------------------|
| `link` | URL（内部または外部）。 |
| `title` | カードのタイトル見出し。 |
| `subtitle` | サブタイトル見出し（Markdown対応）。 |
| `icon` | アイコンの名前。 |
| `tag` | タグ内のテキスト。 |
| `tagColor` | タグの色: `gray`（デフォルト）、`yellow`、`red`、`blue`。 |
## 画像カード
さらに、カードは画像の追加と以下のパラメータを通じた処理をサポートします:
| パラメータ | 説明 |
|----------- |---------------------------------------------|
| `image` | カードの画像URLを指定します。 |
| `method` | Hugoの画像処理メソッドを設定します。 |
| `options` | Hugoの画像処理オプションを設定します。 |
カードは3種類の画像をサポートします:
1. リモート画像: `image`パラメータに完全なURLを指定。
2. 静的画像: Hugoの`static/`ディレクトリ内の相対パスを使用。
3. 処理済み画像: Hugoの`assets/`ディレクトリ内の相対パスを使用。
Hextraはビルド時に画像処理が必要かどうかを自動検出し、`options`パラメータまたはデフォルト設定（Resize、800x、品質80、WebPフォーマット）を適用します。
現在サポートされている`method`は`Resize`、`Fit`、`Fill`、`Crop`です。
Hugoの組み込み画像処理コマンド、メソッド、オプションの詳細については、[画像処理ドキュメント](https://gohugo.io/content-management/image-processing/)を参照してください。
## タグ
カードはタグの追加をサポートしており、追加のステータス情報を表示するのに役立ちます。
{{< cards >}}
{{< card link="../callout" title="デフォルトタグ付きカード" tag="タグテキスト" >}}
{{< card link="../callout" title="エラータグ付きカード" tag="タグテキスト" tagType="error" >}}
{{< card link="../callout" title="情報タグ付きカード" tag="タグテキスト" tagType="info" >}}
{{< card link="../callout" title="警告タグ付きカード" tag="タグテキスト" tagType="warning" >}}
{{< card link="/" title="画像カード" image="https://github.com/user-attachments/assets/71b7e3ec-1a8d-4582-b600-5425c6cc0407" subtitle="インターネット画像" tag="タグテキスト" tagType="error" >}}
{{< /cards >}}
```
{{</* cards */>}}
{{</* card link="../callout" title="デフォルトタグ色付きカード" tag="タグテキスト" */>}}
{{</* card link="../callout" title="デフォルト赤タグ付きカード" tag="タグテキスト" tagType="error" */>}}
{{</* card link="../callout" title="青タグ付きカード" tag="タグテキスト" tagType="info" */>}}
{{</* card link="../callout" title="黄色タグ付きカード" tag="タグテキスト" tagType="warning" */>}}
{{</* /cards */>}}
```
## 列
`cards`ショートコードに`cols`パラメータを渡すことで、カードが広がる最大列数を指定できます。ただし、小さい画面では列は折りたたまれます。
{{< cards cols="1" >}}
{{< card link="/" title="上部カード" >}}
{{< card link="/" title="下部カード" >}}
{{< /cards >}}
{{< cards cols="2" >}}
{{< card link="/" title="左カード" >}}
{{< card link="/" title="右カード" >}}
{{< /cards >}}
```
{{</* cards cols="1" */>}}
{{</* card link="/" title="上部カード" */>}}
{{</* card link="/" title="下部カード" */>}}
{{</* /cards */>}}
{{</* cards cols="2" */>}}
{{</* card link="/" title="左カード" */>}}
{{</* card link="/" title="右カード" */>}}
{{</* /cards */>}}
```

116
exampleSite/content/docs/guide/shortcodes/cards.md
View File

@ -1,116 +0,0 @@
---
title: Cards Component
linkTitle: Cards
---
## Example
{{< cards >}}
{{< card link="../callout" title="Callout" icon="warning" >}}
{{< card link="../callout" title="Card with tag" icon="tag" tag="custom tag">}}
{{< card link="/" title="No Icon" >}}
{{< /cards >}}
{{< cards >}}
{{< card link="/" title="Image Card" image="https://github.com/user-attachments/assets/71b7e3ec-1a8d-4582-b600-5425c6cc0407" subtitle="Internet Image" >}}
{{< card link="/" title="Local Image" image="/images/card-image-unprocessed.jpg" subtitle="Raw image under static directory." >}}
{{< card link="/" title="Local Image" image="images/space.jpg" subtitle="Image under assets directory, processed by Hugo." method="Resize" options="600x q80 webp" >}}
{{< /cards >}}
## Usage
```
{{</* cards */>}}
{{</* card link="../callout" title="Callout" icon="warning" */>}}
{{</* card link="../callout" title="Card with tag" icon="tag" tag= "A custom tag" */>}}
{{</* card link="/" title="No Icon" */>}}
{{</* /cards */>}}
```
```
{{</* cards */>}}
{{</* card link="/" title="Image Card" image="https://source.unsplash.com/featured/800x600?landscape" subtitle="Unsplash Landscape" */>}}
{{</* card link="/" title="Local Image" image="/images/card-image-unprocessed.jpg" subtitle="Raw image under static directory." */>}}
{{</* card link="/" title="Local Image" image="images/space.jpg" subtitle="Image under assets directory, processed by Hugo." method="Resize" options="600x q80 webp" */>}}
{{</* /cards */>}}
```
## Card Parameters
| Parameter | Description |
|----------- |-----------------------------------------------------------------|
| `link` | URL (internal or external). |
| `title` | Title heading for the card. |
| `subtitle` | Subtitle heading (supports Markdown). |
| `icon` | Name of the icon. |
| `tag` | Text in tag. |
| `tagColor` | Color of the tag: `gray` (default), `yellow`, `red` and `blue`. |
## Image Card
Additionally, the card supports adding image and processing through these parameters:
| Parameter | Description |
|----------- |---------------------------------------------|
| `image` | Specifies the image URL for the card. |
| `method` | Sets Hugo's image processing method. |
| `options` | Configures Hugo's image processing options. |
Card supports three kinds of images:
1. Remote image: the full URL in the `image` parameter.
2. Static image: use the relative path in Hugo's `static/` directory.
3. Processed image: use the relative path in Hugo's `assets/` directory.
Hextra auto-detects if image processing is needed during build and applies the `options` parameter or default settings (Resize, 800x, Quality 80, WebP Format).
It currently supports these `method`: `Resize`, `Fit`, `Fill` and `Crop`.
For more on Hugo's built in image processing commands, methods, and options see their [Image Processing Documentation](https://gohugo.io/content-management/image-processing/).
## Tags
Card supports adding tags which could be useful to show extra status information.
{{< cards >}}
{{< card link="../callout" title="Card with default tag" tag="tag text" >}}
{{< card link="../callout" title="Card with error tag" tag="tag text" tagType="error" >}}
{{< card link="../callout" title="Card with info tag" tag="tag text" tagType="info" >}}
{{< card link="../callout" title="Card with warning tag" tag="tag text" tagType="warning" >}}
{{< card link="/" title="Image Card" image="https://github.com/user-attachments/assets/71b7e3ec-1a8d-4582-b600-5425c6cc0407" subtitle="Internet Image" tag="tag text" tagType="error" >}}
{{< /cards >}}
```
{{</* cards */>}}
{{</* card link="../callout" title="Card with default tag color" tag="tag text" */>}}
{{</* card link="../callout" title="Card with default red tag" tag="tag text" tagType="error" */>}}
{{</* card link="../callout" title="Card with blue tag" tag="tag text" tagType="info" */>}}
{{</* card link="../callout" title="Card with yellow tag" tag="tag text" tagType="warning" */>}}
{{</* /cards */>}}
```
## Columns
You can specify the maximum number of columns for cards to span by passing the `cols` parameter to the `cards` shortcode. Note that columns will still be collapsed on smaller screens.
{{< cards cols="1" >}}
{{< card link="/" title="Top Card" >}}
{{< card link="/" title="Bottom Card" >}}
{{< /cards >}}
{{< cards cols="2" >}}
{{< card link="/" title="Left Card" >}}
{{< card link="/" title="Right Card" >}}
{{< /cards >}}
```
{{</* cards cols="1" */>}}
{{</* card link="/" title="Top Card" */>}}
{{</* card link="/" title="Bottom Card" */>}}
{{</* /cards */>}}
{{</* cards cols="2" */>}}
{{</* card link="/" title="Left Card" */>}}
{{</* card link="/" title="Right Card" */>}}
{{</* /cards */>}}
```

115
exampleSite/content/docs/guide/shortcodes/cards.zh-cn.md
View File

@ -1,115 +0,0 @@
---
title: 卡片组件
linkTitle: 卡片
---
## 示例
{{< cards >}}
{{< card link="../callout" title="提示框" icon="warning" >}}
{{< card link="../callout" title="带标签的卡片" icon="tag" tag="自定义标签">}}
{{< card link="/" title="无图标" >}}
{{< /cards >}}
{{< cards >}}
{{< card link="/" title="图片卡片" image="https://github.com/user-attachments/assets/71b7e3ec-1a8d-4582-b600-5425c6cc0407" subtitle="网络图片" >}}
{{< card link="/" title="本地图片" image="/images/card-image-unprocessed.jpg" subtitle="静态目录下的原始图片。" >}}
{{< card link="/" title="本地图片" image="images/space.jpg" subtitle="资源目录下的图片，由 Hugo 处理。" method="Resize" options="600x q80 webp" >}}
{{< /cards >}}
## 用法
```
{{</* cards */>}}
{{</* card link="../callout" title="提示框" icon="warning" */>}}
{{</* card link="../callout" title="带标签的卡片" icon="tag" tag= "自定义标签" */>}}
{{</* card link="/" title="无图标" */>}}
{{</* /cards */>}}
```
```
{{</* cards */>}}
{{</* card link="/" title="图片卡片" image="https://source.unsplash.com/featured/800x600?landscape" subtitle="Unsplash 风景" */>}}
{{</* card link="/" title="本地图片" image="/images/card-image-unprocessed.jpg" subtitle="静态目录下的原始图片。" */>}}
{{</* card link="/" title="本地图片" image="images/space.jpg" subtitle="资源目录下的图片，由 Hugo 处理。" method="Resize" options="600x q80 webp" */>}}
{{</* /cards */>}}
```
## 卡片参数
| 参数 | 描述 |
|----------- |-----------------------------------------------------------------|
| `link` | URL（内部或外部）。 |
| `title` | 卡片的标题。 |
| `subtitle` | 卡片的副标题（支持 Markdown）。 |
| `icon` | 图标的名称。 |
| `tag` | 标签中的文本。 |
| `tagColor` | 标签的颜色：`gray`（默认）、`yellow`、`red` 和 `blue`。 |
## 图片卡片
此外，卡片支持通过以下参数添加图片并进行处理：
| 参数 | 描述 |
|-----------|--------------------------------------|
| `image` | 指定卡片的图片 URL。 |
| `method` | 设置 Hugo 的图片处理方法。 |
| `options` | 配置 Hugo 的图片处理选项。 |
卡片支持三种类型的图片：
1. 远程图片：`image` 参数中的完整 URL。
2. 静态图片：使用 Hugo `static/` 目录中的相对路径。
3. 处理后的图片：使用 Hugo `assets/` 目录中的相对路径。
Hextra 在构建时自动检测是否需要图片处理，并应用 `options` 参数或默认设置（Resize，800x，质量 80，WebP 格式）。
目前支持以下 `method`：`Resize`、`Fit`、`Fill` 和 `Crop`。
有关 Hugo 内置图片处理命令、方法和选项的更多信息，请参阅其[图片处理文档](https://gohugo.io/content-management/image-processing/)。
## 标签
卡片支持添加标签，这对于显示额外的状态信息非常有用。
{{< cards >}}
{{< card link="../callout" title="带默认标签的卡片" tag="标签文本" >}}
{{< card link="../callout" title="带错误标签的卡片" tag="标签文本" tagType="error" >}}
{{< card link="../callout" title="带信息标签的卡片" tag="标签文本" tagType="info" >}}
{{< card link="../callout" title="带警告标签的卡片" tag="标签文本" tagType="warning" >}}
{{< card link="/" title="图片卡片" image="https://github.com/user-attachments/assets/71b7e3ec-1a8d-4582-b600-5425c6cc0407" subtitle="网络图片" tag="标签文本" tagType="error" >}}
{{< /cards >}}
```
{{</* cards */>}}
{{</* card link="../callout" title="带默认标签颜色的卡片" tag="标签文本" */>}}
{{</* card link="../callout" title="带红色标签的卡片" tag="标签文本" tagType="error" */>}}
{{</* card link="../callout" title="带蓝色标签的卡片" tag="标签文本" tagType="info" */>}}
{{</* card link="../callout" title="带黄色标签的卡片" tag="标签文本" tagType="warning" */>}}
{{</* /cards */>}}
```
## 列数
您可以通过将 `cols` 参数传递给 `cards` 短代码来指定卡片的最大列数。请注意，在较小的屏幕上，列仍会折叠。
{{< cards cols="1" >}}
{{< card link="/" title="顶部卡片" >}}
{{< card link="/" title="底部卡片" >}}
{{< /cards >}}
{{< cards cols="2" >}}
{{< card link="/" title="左侧卡片" >}}
{{< card link="/" title="右侧卡片" >}}
{{< /cards >}}
```
{{</* cards cols="1" */>}}
{{</* card link="/" title="顶部卡片" */>}}
{{</* card link="/" title="底部卡片" */>}}
{{</* /cards */>}}
{{</* cards cols="2" */>}}
{{</* card link="/" title="左侧卡片" */>}}
{{</* card link="/" title="右侧卡片" */>}}
{{</* /cards */>}}
```

43
exampleSite/content/docs/guide/shortcodes/details.fa.md
View File

@ -1,43 +0,0 @@
---
title: جزئیات
---
یک کامپوننت داخلی برای نمایش محتوای قابل باز و بسته شدن.
<!--more-->
## مثال
{{% details title="جزئیات" %}}
این محتوای جزئیات است.
مارک‌داون **پشتیبانی می‌شود**.
{{% /details %}}
{{% details title="برای نمایش روی من کلیک کنید" closed="true" %}}
این به طور پیش‌فرض پنهان می‌شود.
{{% /details %}}
## استفاده
````markdown
{{%/* details title="جزئیات" */%}}
این محتوای جزئیات است.
مارک‌داون **پشتیبانی می‌شود**.
{{%/* /details */%}}
````
````markdown
{{%/* details title="برای نمایش روی من کلیک کنید"closed="true" */%}}
این به طور پیش‌فرض پنهان می‌شود.
{{%/* /details */%}}
````

43
exampleSite/content/docs/guide/shortcodes/details.ja.md
View File

@ -1,43 +0,0 @@
---
title: 詳細
---
折りたたみ可能なコンテンツを表示するための組み込みコンポーネント。
<!--more-->
## 例
{{% details title="詳細" %}}
これは詳細のコンテンツです。
Markdownは**サポートされています**。
{{% /details %}}
{{% details title="クリックして表示" closed="true" %}}
これはデフォルトで非表示になります。
{{% /details %}}
## 使い方
````markdown
{{%/* details title="詳細" */%}}
これは詳細のコンテンツです。
Markdownは**サポートされています**。
{{%/* /details */%}}
````
````markdown
{{%/* details title="クリックして表示" closed="true" */%}}
これはデフォルトで非表示になります。
{{%/* /details */%}}
````

43
exampleSite/content/docs/guide/shortcodes/details.md
View File

@ -1,43 +0,0 @@
---
title: Details
---
A built-in component to display a collapsible content.
<!--more-->
## Example
{{% details title="Details" %}}
This is the content of the details.
Markdown is **supported**.
{{% /details %}}
{{% details title="Click me to reveal" closed="true" %}}
This will be hidden by default.
{{% /details %}}
## Usage
````markdown
{{%/* details title="Details" */%}}
This is the content of the details.
Markdown is **supported**.
{{%/* /details */%}}
````
````markdown
{{%/* details title="Click me to reveal" closed="true" */%}}
This will be hidden by default.
{{%/* /details */%}}
````

43
exampleSite/content/docs/guide/shortcodes/details.zh-cn.md
View File

@ -1,43 +0,0 @@
---
title: 详情
---
一个内置组件，用于显示可折叠的内容。
<!--more-->
## 示例
{{% details title="详情" %}}
这是详情的内容。
支持 **Markdown**。
{{% /details %}}
{{% details title="点击我展开" closed="true" %}}
默认情况下，这部分内容会被隐藏。
{{% /details %}}
## 用法
````markdown
{{%/* details title="详情" */%}}
这是详情的内容。
支持 **Markdown**。
{{%/* /details */%}}
````
````markdown
{{%/* details title="点击我展开" closed="true" */%}}
默认情况下，这部分内容会被隐藏。
{{%/* /details */%}}
````

36
exampleSite/content/docs/guide/shortcodes/filetree.fa.md
View File

@ -1,36 +0,0 @@
---
title: کامپوننت FileTree
linkTitle: FileTree
prev: /docs/guide/shortcodes
next: /docs/guide/shortcodes/icon
---
## مثال
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="docs" state="closed" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="introduction.md" >}}
{{< filetree/file name="introduction.fa.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/file name="hugo.toml" >}}
{{< /filetree/container >}}
## استفاده
```text {filename="Markdown"}
{{</* filetree/container */>}}
{{</* filetree/folder name="content" */>}}
{{</* filetree/file name="_index.md" */>}}
{{</* filetree/folder name="docs" state="closed" */>}}
{{</* filetree/file name="_index.md" */>}}
{{</* filetree/file name="introduction.md" */>}}
{{</* filetree/file name="introduction.fa.md" */>}}
{{</* /filetree/folder */>}}
{{</* /filetree/folder */>}}
{{</* filetree/file name="hugo.toml" */>}}
{{</* /filetree/container */>}}
```

34
exampleSite/content/docs/guide/shortcodes/filetree.ja.md
View File

@ -1,34 +0,0 @@
---
title: FileTree コンポーネント
linkTitle: FileTree
---
## 例
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="docs" state="closed" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="introduction.md" >}}
{{< filetree/file name="introduction.fr.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/file name="hugo.toml" >}}
{{< /filetree/container >}}
## 使用方法
```text {filename="Markdown"}
{{</* filetree/container */>}}
{{</* filetree/folder name="content" */>}}
{{</* filetree/file name="_index.md" */>}}
{{</* filetree/folder name="docs" state="closed" */>}}
{{</* filetree/file name="_index.md" */>}}
{{</* filetree/file name="introduction.md" */>}}
{{</* filetree/file name="introduction.fr.md" */>}}
{{</* /filetree/folder */>}}
{{</* /filetree/folder */>}}
{{</* filetree/file name="hugo.toml" */>}}
{{</* /filetree/container */>}}
```

34
exampleSite/content/docs/guide/shortcodes/filetree.md
View File

@ -1,34 +0,0 @@
---
title: FileTree Component
linkTitle: FileTree
---
## Example
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="docs" state="closed" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="introduction.md" >}}
{{< filetree/file name="introduction.fr.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/file name="hugo.toml" >}}
{{< /filetree/container >}}
## Usage
```text {filename="Markdown"}
{{</* filetree/container */>}}
{{</* filetree/folder name="content" */>}}
{{</* filetree/file name="_index.md" */>}}
{{</* filetree/folder name="docs" state="closed" */>}}
{{</* filetree/file name="_index.md" */>}}
{{</* filetree/file name="introduction.md" */>}}
{{</* filetree/file name="introduction.fr.md" */>}}
{{</* /filetree/folder */>}}
{{</* /filetree/folder */>}}
{{</* filetree/file name="hugo.toml" */>}}
{{</* /filetree/container */>}}
```

34
exampleSite/content/docs/guide/shortcodes/filetree.zh-cn.md
View File

@ -1,34 +0,0 @@
---
title: 文件树组件
linkTitle: 文件树
---
## 示例
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="docs" state="closed" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/file name="introduction.md" >}}
{{< filetree/file name="introduction.fr.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< filetree/file name="hugo.toml" >}}
{{< /filetree/container >}}
## 用法
```text {filename="Markdown"}
{{</* filetree/container */>}}
{{</* filetree/folder name="content" */>}}
{{</* filetree/file name="_index.md" */>}}
{{</* filetree/folder name="docs" state="closed" */>}}
{{</* filetree/file name="_index.md" */>}}
{{</* filetree/file name="introduction.md" */>}}
{{</* filetree/file name="introduction.fr.md" */>}}
{{</* /filetree/folder */>}}
{{</* /filetree/folder */>}}
{{</* filetree/file name="hugo.toml" */>}}
{{</* /filetree/container */>}}
```

47
exampleSite/content/docs/guide/shortcodes/icon.fa.md
View File

@ -1,47 +0,0 @@
---
title: آیکون
---
برای استفاده از این کد کوتاه درون‌خطی، باید آن را در پیکربندی فعال کنید:
```yaml {filename="hugo.yaml"}
enableInlineShortcodes: true
```
فهرست آیکون‌های موجود را می‌توانید در [`data/icons.yaml`](https://github.com/imfing/hextra/blob/main/data/icons.yaml) پیدا کنید.
<!--more-->
## مثال
{{< icon "academic-cap" >}}
{{< icon "cake" >}}
{{< icon "gift" >}}
{{< icon "sparkles" >}}
## استفاده
```
{{</* icon "github" */>}}
```
آیکون‌های با طرح‌های متفاوت در [Heroicons](https://v1.heroicons.com/) نسخه ۱ خارج از جعبه در دسترس هستند.
### چجوری آیکون‌های خودمان را اضافه کنیم
پرونده `data/icons.yaml` را ایجاد کنید، سپس آیکون‌های SVG خود را در فرمت زیر اضافه کنید:
```yaml {filename="data/icons.yaml"}
your-icon: <svg>your icon svg content</svg>
```
سپس می‌توان آن را در کد کوتاه مانند زیر استفاده کرد:
```
{{</* icon "your-icon" */>}}
{{</* card icon="your-icon" */>}}
```
نکته: [Iconify Design](https://iconify.design/) مکانی عالی برای پیدا کردن آیکون‌های SVG برای سایت شما است.

46
exampleSite/content/docs/guide/shortcodes/icon.ja.md
View File

@ -1,46 +0,0 @@
---
title: アイコン
---
このショートコードをインラインで使用するには、設定でインラインショートコードを有効にする必要があります:
```yaml {filename="hugo.yaml"}
enableInlineShortcodes: true
```
利用可能なアイコンのリストは、[`data/icons.yaml`](https://github.com/imfing/hextra/blob/main/data/icons.yaml) で確認できます。
<!--more-->
## 例
{{< icon "academic-cap" >}}
{{< icon "cake" >}}
{{< icon "gift" >}}
{{< icon "sparkles" >}}
## 使用方法
```
{{</* icon "github" */>}}
```
[Heroicons](https://v1.heroicons.com/) v1 のアウトラインアイコンがデフォルトで利用可能です。
### 独自のアイコンを追加する方法
`data/icons.yaml` ファイルを作成し、以下の形式で独自のSVGアイコンを追加します:
```yaml {filename="data/icons.yaml"}
your-icon: <svg>your icon svg content</svg>
```
その後、ショートコードで以下のように使用できます:
```
{{</* icon "your-icon" */>}}
{{</* card icon="your-icon" */>}}
```
ヒント: [Iconify Design](https://iconify.design/) は、サイト用のSVGアイコンを見つけるのに最適な場所です。

46
exampleSite/content/docs/guide/shortcodes/icon.md
View File

@ -1,46 +0,0 @@
---
title: Icon
---
To use this shortcode inline, inline shortcode needs to be enabled in the config:
```yaml {filename="hugo.yaml"}
enableInlineShortcodes: true
```
List of available icons can be found in [`data/icons.yaml`](https://github.com/imfing/hextra/blob/main/data/icons.yaml).
<!--more-->
## Example
{{< icon "academic-cap" >}}
{{< icon "cake" >}}
{{< icon "gift" >}}
{{< icon "sparkles" >}}
## Usage
```
{{</* icon "github" */>}}
```
[Heroicons](https://v1.heroicons.com/) v1 outline icons are available out of the box.
### How to add your own icons
Create `data/icons.yaml` file, then add your own SVG icons in the following format:
```yaml {filename="data/icons.yaml"}
your-icon: <svg>your icon svg content</svg>
```
It then can be used in the shortcode like this:
```
{{</* icon "your-icon" */>}}
{{</* card icon="your-icon" */>}}
```
Tip: [Iconify Design](https://iconify.design/) is a great place to find SVG icons for your site.

46
exampleSite/content/docs/guide/shortcodes/icon.zh-cn.md
View File

@ -1,46 +0,0 @@
---
title: 图标
---
要在行内使用此短代码，需要在配置中启用行内短代码：
```yaml {filename="hugo.yaml"}
enableInlineShortcodes: true
```
可用图标的列表可以在 [`data/icons.yaml`](https://github.com/imfing/hextra/blob/main/data/icons.yaml) 中找到。
<!--more-->
## 示例
{{< icon "academic-cap" >}}
{{< icon "cake" >}}
{{< icon "gift" >}}
{{< icon "sparkles" >}}
## 用法
```
{{</* icon "github" */>}}
```
[Heroicons](https://v1.heroicons.com/) v1 的轮廓图标默认可用。
### 如何添加自定义图标
创建 `data/icons.yaml` 文件，然后按照以下格式添加自定义的 SVG 图标：
```yaml {filename="data/icons.yaml"}
your-icon: <svg>your icon svg content</svg>
```
然后可以在短代码中这样使用：
```
{{</* icon "your-icon" */>}}
{{</* card icon="your-icon" */>}}
```
提示：[Iconify Design](https://iconify.design/) 是寻找网站 SVG 图标的好地方。

79
exampleSite/content/docs/guide/shortcodes/jupyter.ja.md
View File

@ -1,79 +0,0 @@
---
title: "Jupyter Notebook コンポーネント"
linktitle: "Jupyter Notebook"
math: true
sidebar:
exclude: true
---
{{< callout >}}Jupyter Notebook をショートコード経由で含める実験的な機能です。すべてのセルタイプがサポートされているわけではありません。{{< /callout >}}
[Jupyter Notebook](https://jupyter.org/) は、[Project Jupyter](https://jupyter.org/) の言語に依存しない HTML ノートブックアプリケーションです。これを使用すると、ライブコード、数式、視覚化、および説明文を含むドキュメントを作成して共有できます。
<!--more-->
## 使用方法
### ローカルノートブックを使用する
Jupyter Notebook ショートコードを使用するには、プロジェクト内に Jupyter Notebook ファイルが必要です。[画像を追加する](../../organize-files#add-images)方法と同様に、Jupyter Notebook を `assets` フォルダに追加できます。
{{< filetree/container >}}
{{< filetree/folder name="assets" >}}
{{< filetree/file name="notebook.ipynb" >}}
{{< /filetree/folder >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
`jupyter` ショートコードを使用してページに Jupyter Notebook を含めます：
```markdown {filename="content/docs/my-page.md"}
---
title: My Page
math: true
---
{{%/* jupyter "notebook.ipynb" */%}}
```
あるいは、Hugo の [ページバンドル][page-bundles] 機能を利用して、Jupyter Notebook を Markdown ファイルと一緒に整理することもできます。
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/folder name="my-page" >}}
{{< filetree/file name="index.md" >}}
{{< filetree/file name="notebook.ipynb" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
```markdown {filename="content/docs/my-page/index.md"}
---
title: My Page
math: true
---
{{%/* jupyter "notebook.ipynb" */%}}
```
### リモートノートブックを使用する
ノートブックファイルの URL を指定して、リモートノートブックを使用することもできます。たとえば、[What is the Jupyter Notebook](https://github.com/jupyter/notebook/blob/main/docs/source/examples/Notebook/What%20is%20the%20Jupyter%20Notebook.ipynb) ノートブックをページに含めるには、次のショートコードを使用します：
```
{{%/* jupyter "https://raw.githubusercontent.com/jupyter/notebook/main/docs/source/examples/Notebook/What%20is%20the%20Jupyter%20Notebook.ipynb" */%}}
```
## ノートブックの例
{{< callout type="info" >}}以下は、プロジェクトの assets フォルダに含まれているノートブックファイルの例です。{{< /callout >}}
{{% jupyter "example.ipynb" %}}
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles

79
exampleSite/content/docs/guide/shortcodes/jupyter.md
View File

@ -1,79 +0,0 @@
---
title: "Jupyter Notebook Component"
linktitle: "Jupyter Notebook"
math: true
sidebar:
exclude: true
---
{{< callout >}}Experimental feature to include Jupyter Notebooks via a shortcode. Note that not all cell types are supported.{{< /callout >}}
[Jupyter Notebook](https://jupyter.org/) is a language-agnostic HTML notebook application for [Project Jupyter](https://jupyter.org/). It allows you to create and share documents that contain live code, equations, visualizations, and narrative text.
<!--more-->
## How to use
### Using a local notebook
To use the Jupyter Notebook shortcode, you need to have a Jupyter Notebook file in your project. Similar to how you would [add images](../../organize-files#add-images) to the project, you can add Jupyter Notebooks to the `assets` folder.
{{< filetree/container >}}
{{< filetree/folder name="assets" >}}
{{< filetree/file name="notebook.ipynb" >}}
{{< /filetree/folder >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
Include the Jupyter Notebook in the page using the `jupyter` shortcode:
```markdown {filename="content/docs/my-page.md"}
---
title: My Page
math: true
---
{{%/* jupyter "notebook.ipynb" */%}}
```
Alternatively, you can utilize the [page bundles][page-bundles] feature of Hugo to organize the Jupyter Notebooks together with the Markdown file.
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/folder name="my-page" >}}
{{< filetree/file name="index.md" >}}
{{< filetree/file name="notebook.ipynb" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
```markdown {filename="content/docs/my-page/index.md"}
---
title: My Page
math: true
---
{{%/* jupyter "notebook.ipynb" */%}}
```
### Using a remote notebook
You can also use a remote notebook by providing the URL to the notebook file. For example, to include [What is the Jupyter Notebook](https://github.com/jupyter/notebook/blob/main/docs/source/examples/Notebook/What%20is%20the%20Jupyter%20Notebook.ipynb) notebook in the page, you can use the following shortcode:
```
{{%/* jupyter "https://raw.githubusercontent.com/jupyter/notebook/main/docs/source/examples/Notebook/What%20is%20the%20Jupyter%20Notebook.ipynb" */%}}
```
## Example Notebook
{{< callout type="info" >}}The following is an example of a notebook file that is included in the project assets folder.{{< /callout >}}
{{% jupyter "example.ipynb" %}}
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles

79
exampleSite/content/docs/guide/shortcodes/jupyter.zh-cn.md
View File

@ -1,79 +0,0 @@
---
title: "Jupyter Notebook 组件"
linktitle: "Jupyter Notebook"
math: true
sidebar:
exclude: true
---
{{< callout >}}实验性功能：通过短代码嵌入 Jupyter Notebook。请注意，并非所有单元格类型都受支持。{{< /callout >}}
[Jupyter Notebook](https://jupyter.org/) 是 [Project Jupyter](https://jupyter.org/) 的一个语言无关的 HTML 笔记本应用程序。它允许你创建和共享包含实时代码、方程、可视化和叙述性文本的文档。
<!--more-->
## 使用方法
### 使用本地笔记本
要使用 Jupyter Notebook 短代码，你需要在项目中有一个 Jupyter Notebook 文件。类似于如何[添加图片](../../organize-files#add-images)到项目中，你可以将 Jupyter Notebooks 添加到 `assets` 文件夹。
{{< filetree/container >}}
{{< filetree/folder name="assets" >}}
{{< filetree/file name="notebook.ipynb" >}}
{{< /filetree/folder >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/file name="my-page.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
使用 `jupyter` 短代码将 Jupyter Notebook 包含在页面中：
```markdown {filename="content/docs/my-page.md"}
---
title: 我的页面
math: true
---
{{%/* jupyter "notebook.ipynb" */%}}
```
或者，你可以利用 Hugo 的[页面包][page-bundles]功能将 Jupyter Notebooks 与 Markdown 文件一起组织。
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/folder name="docs" >}}
{{< filetree/folder name="my-page" >}}
{{< filetree/file name="index.md" >}}
{{< filetree/file name="notebook.ipynb" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
```markdown {filename="content/docs/my-page/index.md"}
---
title: 我的页面
math: true
---
{{%/* jupyter "notebook.ipynb" */%}}
```
### 使用远程笔记本
你也可以通过提供笔记本文件的 URL 来使用远程笔记本。例如，要在页面中包含 [What is the Jupyter Notebook](https://github.com/jupyter/notebook/blob/main/docs/source/examples/Notebook/What%20is%20the%20Jupyter%20Notebook.ipynb) 笔记本，你可以使用以下短代码：
```
{{%/* jupyter "https://raw.githubusercontent.com/jupyter/notebook/main/docs/source/examples/Notebook/What%20is%20the%20Jupyter%20Notebook.ipynb" */%}}
```
## 示例笔记本
{{< callout type="info" >}}以下是包含在项目 assets 文件夹中的笔记本文件示例。{{< /callout >}}
{{% jupyter "example.ipynb" %}}
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles

77
exampleSite/content/docs/guide/shortcodes/others.ja.md
View File

@ -1,77 +0,0 @@
---
title: その他のショートコード
linkTitle: その他
sidebar:
exclude: true
---
{{< callout emoji="ℹ️" >}}
これらの一部はHugoの組み込みショートコードです。
これらのショートコードは安定性が低く、いつでも変更される可能性があります。
{{< /callout >}}
## バッジ
```
{{</* badge "バッジ" */>}}
```
結果:
{{< badge "バッジ" >}}
バリエーション:
```
{{</* badge content="info" type="info" */>}}
{{</* badge content="warning" type="warning" */>}}
{{</* badge content="error" type="error" */>}}
```
結果:
{{< badge content="info" type="info" >}} &nbsp;
{{< badge content="warning" type="warning" >}} &nbsp;
{{< badge content="error" type="error" >}}
リンクとアイコン付き:
```
{{</* badge content="リリース" link="https://github.com/imfing/hextra/releases" icon="github" */>}}
```
結果:
{{< badge content="リリース" link="https://github.com/imfing/hextra/releases" icon="github" >}}
## YouTube
YouTube動画を埋め込みます。
```
{{</* youtube VIDEO_ID */>}}
```
結果:
{{< youtube id=dQw4w9WgXcQ loading=lazy >}}
詳細については、[HugoのYouTubeショートコード](https://gohugo.io/content-management/shortcodes/#youtube)を参照してください。
## PDF
PDFショートコードを使用すると、コンテンツ内にPDFファイルを埋め込むことができます。
```
{{</* pdf "https://example.com/sample.pdf" */>}}
```
また、プロジェクトディレクトリ内にPDFファイルを配置し、相対パスを使用することもできます。
```
{{</* pdf "path/to/file.pdf" */>}}
```
例:
{{< pdf "https://upload.wikimedia.org/wikipedia/commons/1/13/Example.pdf" >}}

77
exampleSite/content/docs/guide/shortcodes/others.md
View File

@ -1,77 +0,0 @@
---
title: Other Shortcodes
linkTitle: Others
sidebar:
exclude: true
---
{{< callout emoji="ℹ️" >}}
Some of these are Hugo built-in shortcodes.
These shortcodes are considered less stable and may be changed anytime.
{{< /callout >}}
## Badge
```
{{</* badge "Badge" */>}}
```
Result:
{{< badge "Badge" >}}
Variants:
```
{{</* badge content="info" type="info" */>}}
{{</* badge content="warning" type="warning" */>}}
{{</* badge content="error" type="error" */>}}
```
Result:
{{< badge content="info" type="info" >}} &nbsp;
{{< badge content="warning" type="warning" >}} &nbsp;
{{< badge content="error" type="error" >}}
With link and icon:
```
{{</* badge content="Releases" link="https://github.com/imfing/hextra/releases" icon="github" */>}}
```
Result:
{{< badge content="Releases" link="https://github.com/imfing/hextra/releases" icon="github" >}}
## YouTube
Embed a YouTube video.
```
{{</* youtube VIDEO_ID */>}}
```
Result:
{{< youtube id=dQw4w9WgXcQ loading=lazy >}}
For more information, see [Hugo's YouTube Shortcode](https://gohugo.io/content-management/shortcodes/#youtube).
## PDF
With PDF shortcode, you can embed a PDF file in your content.
```
{{</* pdf "https://example.com/sample.pdf" */>}}
```
You can also place the PDF file in your project directory and use the relative path.
```
{{</* pdf "path/to/file.pdf" */>}}
```
Example:
{{< pdf "https://upload.wikimedia.org/wikipedia/commons/1/13/Example.pdf" >}}

77
exampleSite/content/docs/guide/shortcodes/others.zh-cn.md
View File

@ -1,77 +0,0 @@
---
title: 其他短代码
linkTitle: 其他
sidebar:
exclude: true
---
{{< callout emoji="ℹ️" >}}
其中一些是 Hugo 内置的短代码。
这些短代码被认为不太稳定，可能会随时更改。
{{< /callout >}}
## 徽章
```
{{</* badge "徽章" */>}}
```
结果：
{{< badge "徽章" >}}
变体：
```
{{</* badge content="信息" type="info" */>}}
{{</* badge content="警告" type="warning" */>}}
{{</* badge content="错误" type="error" */>}}
```
结果：
{{< badge content="信息" type="info" >}} &nbsp;
{{< badge content="警告" type="warning" >}} &nbsp;
{{< badge content="错误" type="error" >}}
带链接和图标：
```
{{</* badge content="发布" link="https://github.com/imfing/hextra/releases" icon="github" */>}}
```
结果：
{{< badge content="发布" link="https://github.com/imfing/hextra/releases" icon="github" >}}
## YouTube
嵌入 YouTube 视频。
```
{{</* youtube 视频ID */>}}
```
结果：
{{< youtube id=dQw4w9WgXcQ loading=lazy >}}
更多信息，请参阅 [Hugo 的 YouTube 短代码](https://gohugo.io/content-management/shortcodes/#youtube)。
## PDF
使用 PDF 短代码，您可以在内容中嵌入 PDF 文件。
```
{{</* pdf "https://example.com/sample.pdf" */>}}
```
您也可以将 PDF 文件放在项目目录中并使用相对路径。
```
{{</* pdf "path/to/file.pdf" */>}}
```
示例：
{{< pdf "https://upload.wikimedia.org/wikipedia/commons/1/13/Example.pdf" >}}

42
exampleSite/content/docs/guide/shortcodes/steps.fa.md
View File

@ -1,42 +0,0 @@
---
title: مراحل
next: /docs/guide/deploy-site
---
یک کامپوننت داخلی برای نمایش یک سری مراحل.
## مثال
{{% steps %}}
### مرحله ۱
این اولین مرحله است.
### مرحله ۲
این دومین مرحله است.
### مرحله ۳
این سومین مرحله است.
{{% /steps %}}
## استفاده
سرتیتر مارک‌داون h3 را در کد کوتاه `steps` قرار دهید.
```
{{%/* steps */%}}
### مرحله ۱
این اولین مرحله است.
### مرحله ۲
این دومین مرحله است.
{{%/* /steps */%}}
```

46
exampleSite/content/docs/guide/shortcodes/steps.ja.md
View File

@ -1,46 +0,0 @@
---
title: ステップ
---
ステップのシリーズを表示するための組み込みコンポーネント。
## 例
{{% steps %}}
### ステップ 1
これは最初のステップです。
### ステップ 2
これは2番目のステップです。
### ステップ 3
これは3番目のステップです。
{{% /steps %}}
## 使い方
{{< callout emoji="ℹ️" >}}
このショートコードは**Markdownコンテンツ専用**であることに注意してください。
HTMLコンテンツや他のショートコードをステップの内容として使用すると、期待通りにレンダリングされない場合があります。
{{< /callout >}}
`steps` ショートコード内にMarkdownのh3ヘッダーを配置します。
```
{{%/* steps */%}}
### ステップ 1
これは最初のステップです。
### ステップ 2
これは2番目のステップです。
{{%/* /steps */%}}
```

47
exampleSite/content/docs/guide/shortcodes/steps.md
View File

@ -1,47 +0,0 @@
---
title: Steps
---
A built-in component to display a series of steps.
## Example
{{% steps %}}
### Step 1
This is the first step.
### Step 2
This is the second step.
### Step 3
This is the third step.
{{% /steps %}}
## Usage
{{< callout emoji="ℹ️" >}}
Please note that this shortcode is intended **only for Markdown content**.
If you put HTML content or other shortcodes as step content, it may not render as expected.
{{< /callout >}}
Put Markdown h3 header within `steps` shortcode.
```
{{%/* steps */%}}
### Step 1
This is the first step.
### Step 2
This is the second step.
{{%/* /steps */%}}
```

Some files were not shown because too many files have changed in this diff Show More