chore: update fa and ja translations

This commit is contained in:
Xin
2025-08-14 22:07:15 +08:00
parent 24debf9b0c
commit b9bcf5b470
29 changed files with 1758 additions and 592 deletions

View File

@@ -0,0 +1,20 @@
---
title: このサイトについて
toc: false
---
Hextra は、モダンな静的サイトを構築するためのシンプルで高速かつ柔軟なテーマとして設計されています。特にドキュメントサイトの構築に適していますが、ブログやポートフォリオなど様々な種類のサイトにも利用可能です。
Hugo は Jekyll と同様に静的サイトジェネレータですが、単一のバイナリで構成されている点が特徴です。これにより様々なプラットフォームでのインストールと実行が容易で、極めて高速かつ信頼性が高く、数千ページあるサイトでもミリ秒単位でレンダリング可能です。
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/)

View File

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

View File

@@ -1,6 +1,6 @@
---
title: راهنمای استفاده سینتکس مارک‌داون
date: 2024-03-03
title: راهنمای نحو Markdown
date: 2020-01-01
authors:
- name: imfing
link: https://github.com/imfing
@@ -14,123 +14,117 @@ authors:
tags:
- Markdown
- مثال
- راهنمای
- راهنما
excludeSearch: true
---
این مقاله نمونه‌ای از سینتکس ابتدایی مارک‌داون را آموزش می‌دهد، که می‌توانید در پرونده‌های محتوای Hugo استفاده کنید.
این مقاله نمونه‌ای از نحو پایه‌ای Markdown را ارائه می‌دهد که می‌توان در فایل‌های محتوای Hugo استفاده کرد.
<!--more-->
## سینتکس ابتدایی
## نحو پایه
### سرتیترها
```
# سرتیتر ۱
## سرتیتر ۲
### سرتیتر ۳
#### سرتیتر ۴
##### سرتیتر ۵
###### سرتیتر ۶
# سرتیتر 1
## سرتیتر 2
### سرتیتر 3
#### سرتیتر 4
##### سرتیتر 5
###### سرتیتر 6
```
## سرتیتر ۲
### سرتیتر ۳
#### سرتیتر ۴
##### سرتیتر ۵
###### سرتیتر ۶
## سرتیتر 2
### سرتیتر 3
#### سرتیتر 4
##### سرتیتر 5
###### سرتیتر 6
### تاکید
### تأکید
```text
*این متن کج خواهد بود*
_این متن هم کج خواهد بود_
*این متن به صورت ایتالیک نمایش داده می‌شود*
_این نیز به صورت ایتالیک نمایش داده می‌شود_
**این متن توپر خواهد بود**
__این متن هم توپر خواهد بود__
**این متن به صورت پررنگ نمایش داده می‌شود**
__این نیز به صورت پررنگ نمایش داده می‌شود__
_شما **می‌توانید** آنها را ترکیب کنید_
_شما می‌توانید **آنها را ترکیب** کنید_
```
*این متن کج خواهد بود*
*این متن به صورت ایتالیک نمایش داده می‌شود*
_این متن هم کج خواهد بود_
_این نیز به صورت ایتالیک نمایش داده می‌شود_
**این متن توپر خواهد بود**
**این متن به صورت پررنگ نمایش داده می‌شود**
__این متن هم توپر خواهد بود__
__این نیز به صورت پررنگ نمایش داده می‌شود__
_شما **می‌توانید** آنها را ترکیب کنید_
_شما می‌توانید **آنها را ترکیب** کنید_
### فهرست‌ها
#### مرتب نشده
#### بدون ترتیب
```
* مورد ۱
* مورد ۲
* مورد ۱الف
* مورد ۲الف
* مورد ۲ب
```
* مورد ۱
* مورد ۲
* مورد ۱الف
* مورد ۲الف
* مورد ۲ب
#### مرتب شده
#### با ترتیب
```
1. مورد ۱
2. مورد ۲
3. مورد ۳
1. مورد ۳الف
2. مورد ۳ب
۱. مورد ۱
۲. مورد ۲
۳. مورد ۳
۱. مورد ۳الف
۲. مورد ۳ب
```
1. مورد ۱
2. مورد ۲
3. مورد ۳
1. مورد ۳الف
2. مورد ۳ب
### عکس‌ها
### تصاویر
```markdown
![آرم گیت‌هاب](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
![لوگوی GitHub](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
```
![آرم گیت‌هاب](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
![لوگوی GitHub](https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png)
### پیوندها
```markdown
[هیوگو](https://gohugo.io)
[Hugo](https://gohugo.io)
```
[هیوگو](https://gohugo.io)
[Hugo](https://gohugo.io)
### بلوک نقل‌قول
### نقل‌قولها
```markdown
همانطور که نیوتن گفت:
همانطور که نیوتن گفت:
> اگر فاصله دورتری را دیده‌ام با ایستادن بر شانه‌های غول‌ها بوده است.
> اگر من دورتر را دیده‌ام، به این دلیل است که بر شانه‌های غول‌ها ایستاده‌ام.
```
> اگر فاصله دورتری را دیده‌ام با ایستادن بر شانه‌های غول‌ها بوده است.
> اگر من دورتر را دیده‌ام، به این دلیل است که بر شانه‌های غول‌ها ایستاده‌ام.
### کد درون‌خطی
```markdown
`کد` درون‌خطی دارای `بک‌-تیک در اطراف` خود است.
کد `درون‌خطی` با `علامت back-tick` احاطه شده است.
```
`کد` درون‌خطی دارای `بک‌-تیک در اطراف` خود است.
کد `درون‌خطی` با `علامت back-tick` احاطه شده است.
### بلوک‌های کد
#### برجسته‌کردن سینتکس(Syntax)
#### هایلایت سینتکس
````markdown
```go
@@ -146,21 +140,21 @@ func main() {
}
```
### جدولها
### جداول
```markdown
| عنوان | توضیحات |
| سینتکس | توضیحات |
| --------- | ----------- |
| سرتیتر | عنوان |
| پاراگراف | متن |
| هدر | عنوان |
| پاراگراف | متن |
```
| عنوان | توضیحات |
| سینتکس | توضیحات |
| --------- | ----------- |
| سرتیتر | عنوان |
| پاراگراف | متن |
| هدر | عنوان |
| پاراگراف | متن |
## منابع
- [سینتکس مارک‌داون](https://www.markdownguide.org/basic-syntax/)
- [مارک‌داون هیوگو](https://gohugo.io/content-management/formats/#markdown)
- [نحو Markdown](https://www.markdownguide.org/basic-syntax/)
- [Markdown در Hugo](https://gohugo.io/content-management/formats/#markdown)

View File

@@ -0,0 +1,248 @@
---
title: "Hextra v0.10"
date: 2025-08-14
authors:
- name: imfing
link: https://github.com/imfing
image: https://github.com/imfing.png
tags:
- انتشار
draft: true
---
Hextra v0.10.0 یک انتشار بزرگ است که مملو از قابلیت‌های جدید، ارتقاهای معماری و بهبودهای کیفیت زندگی می‌باشد.
<!--more-->
همچنین شامل مشارکت‌های 10 [مشارکت‌کننده جدید](#contributors) بوده و درخواست‌های دیرینه جامعه را برطرف می‌کند.
## راهنمای ارتقا
> [!IMPORTANT]
> **تغییرات شکست‌آمیز**: این انتشار شامل چندین تغییر شکست‌آمیز است. لطفاً قبل از ارتقا، چک‌لیست و [راهنمای مهاجرت](#migration-guide) را بررسی کنید.
قبل از ارتقا به v0.10.0، مطمئن شوید که:
- Hugo v0.146.0+ (نسخه extended) نصب شده است
- CSS سفارشی را برای تغییرات نام کلاس بررسی کرده‌اید (به [تغییرات پیشوند کلاس‌های CSS](#css-class-prefix-changes) و [Tailwind CSS v4](#tailwind-css-v4) مراجعه کنید)
- تأیید کرده‌اید که محیط ساخت دسترسی به اینترنت برای دانلود دارایی‌ها هنگام استفاده از LaTeX و/یا Mermaid دارد
پس از آماده‌سازی، ماژول Hugo را به‌روزرسانی کنید:
```bash
hugo mod get -u github.com/imfing/hextra@v0.10.0
```
## ویژگی‌های جدید
در زیر لیستی از ویژگی‌های جدید قابل توجه در این انتشار آمده است:
- [**پشتیبانی از منوی کشویی در نوار ناوبری**](#dropdown-menu-support-in-navbar): ایجاد منوهای ناوبری سلسله‌مراتبی
- [**تجربه جستجوی بهبودیافته**](#enhanced-search-experience): جستجوی بهبودیافته در تمام سرتیترها با دقت بهتر
- [**پشتیبانی از llms.txt**](#llmstxt-support): تولید خلاصه سایت مناسب برای هوش مصنوعی
- [**هایلایت کردن اسکرول فهرست مطالب**](#table-of-contents-scroll-highlighting): هایلایت کردن خودکار سرتیترها هنگام اسکرول صفحه
- [**تبدیل همگام تب‌ها**](#synchronized-tab-switching): همگام‌سازی انتخاب تب‌ها در چندین گروه تب
- [**صفحه‌بندی لیست وبلاگ**](#blog-list-pagination): اضافه کردن کنترل‌های صفحه‌بندی به صفحات لیست وبلاگ
- [**پشتیبانی از MathJax**](#mathjax-support): موتور رندر ریاضی جایگزین در کنار KaTeX
### پشتیبانی از منوی کشویی در نوار ناوبری
منوهای کشویی را در نوار ناوبری خود برای سازماندهی بهتر موارد ناوبری ایجاد کنید.
```yaml {filename="hugo.yaml"}
menu:
main:
- identifier: products
name: "محصولات"
- name: "محصول الف"
parent: products
url: "/product-a"
- name: "محصول ب"
parent: products
url: "/product-b"
```
![ناوبری منوی کشویی](https://github.com/user-attachments/assets/1816f9b9-7fe3-46e8-9546-f15e43e9914a)
### تجربه جستجوی بهبودیافته
- **جستجو در تمام سرتیترها**: یافتن محتوا در تمام سطوح سرتیترها، نه فقط عنوان صفحات
- **دقت بهتر نتایج**: مدیریت بهتر عنوان‌ها و دقت پیونددهی
- **ناوبری ثابت نتایج**: نتایج جستجو اکنون به بخش‌های صحیح صفحه پیوند می‌خورند
با تشکر ویژه از [@ldez](https://github.com/ldez) برای پیشبرد قابلیت‌های جستجو!
![نتایج جستجوی بهبودیافته](https://github.com/user-attachments/assets/f819652a-95d4-4843-b7e2-c7953a8cabe8)
### پشتیبانی از llms.txt
Hextra اکنون از فرمت خروجی [llms.txt](https://llmstxt.org/) برای سایت شما پشتیبانی می‌کند، که سایت شما را برای ابزارهای هوش مصنوعی و مدل‌های زبانی برای زمینه و مرجع قابل دسترس‌تر می‌سازد.
```yaml {filename="hugo.yaml"}
outputs:
home: [html, llms]
```
این یک فایل `llms.txt` در ریشه سایت شما ایجاد می‌کند.
![مثال llms txt](https://github.com/user-attachments/assets/c6e929bb-0fce-4ab2-af15-a71c5a38b22c)
### هایلایت کردن اسکرول فهرست مطالب
فهرست مطالب اکنون به‌طور خودکار بخش فعلی را هنگام اسکرول صفحه هایلایت می‌کند، که ناوبری را شهودی‌تر می‌سازد.
![هایلایت اسکرول ToC](https://github.com/user-attachments/assets/d623fb99-7000-428b-af95-384eb722f0eb)
### تبدیل همگام تب‌ها
تب‌هایی با موارد یکسان اکنون در سراسر صفحه همگام می‌شوند. هنگامی که همگام‌سازی فعال است، انتخاب یک تب تمام گروه‌های تب که لیست موارد یکسانی دارند را به‌روزرسانی می‌کند (و انتخاب شما به خاطر سپرده می‌شود).
```yaml {filename="hugo.yaml"}
params:
page:
tabs:
sync: true
```
### صفحه‌بندی لیست وبلاگ
کنترل‌های صفحه‌بندی پایه به صفحات لیست وبلاگ اضافه شده‌اند.
```yaml {filename="hugo.yaml"}
params:
blog:
list:
pagerSize: 20 # پست‌ها در هر صفحه
```
![صفحه‌بندی وبلاگ](https://github.com/user-attachments/assets/60405fb4-ec36-4733-ba13-b4066396b5c5)
### پشتیبانی از MathJax
عبارات ریاضی را با [MathJax](https://www.mathjax.org/) در کنار پشتیبانی پیش‌فرض KaTeX رندر کنید. موتوری را انتخاب کنید که بهترین تناسب را با نیازهای شما دارد.
```yaml {filename="hugo.yaml"}
params:
math:
engine: "mathjax" # پیش‌فرض "katex" است
```
## بهبودهای فنی
### چارچوب و سیستم ساخت
- **مهاجرت به Tailwind CSS v4**: مهاجرت کامل به [Tailwind CSS v4](https://tailwindcss.com/blog/tailwindcss-v4) با پشتیبانی بهبودیافته سفارشی‌سازی.
- **سیستم قالب Hugo**: سازگار با [سیستم قالب جدید Hugo](https://gohugo.io/templates/new-templatesystem-overview/) (v0.146.0+) برای سازگاری آینده.
- **رندر سمت سرور ریاضی**: مدیریت بهتر رندر معادلات ریاضی با استفاده از رندر بومی Hugo به‌صورت پیش‌فرض.
- **ارتقای FlexSearch 0.8**: ارتقای موتور جستجو [FlexSearch](https://github.com/nextapps-de/flexsearch) برای نتایج سریع‌تر و دقیق‌تر با رمزگذاری بهبودیافته محتوای CJK (چینی، ژاپنی، کرهای).
- **مدیریت بهبودیافته دارایی‌ها**: دارایی‌های KaTeX و Mermaid از بارگیری از CDN یا محلی پشتیبانی می‌کنند
## بهبودهای کیفیت زندگی
- **تغییر دینامیک favicon**: به‌روزرسانی خودکار favicon بر اساس ترجیحات طرح رنگ
- **صفحه‌بندی معکوس**: نویسندگان اکنون می‌توانند `reversePagination` را در front matter صفحه تنظیم کنند
- **کنترل نمایه‌سازی گوگل**: پارامتر صفحه جدید برای مسدود کردن نمایه‌سازی گوگل در صورت نیاز
- **بهبودهای مدیریت عرض**: کنترل‌های طراحی پاسخگو بهتر از طریق متغیرهای CSS
- **بهبودهای استایل**: استایل‌های مدرن برای جدول Markdown و خط افقی
## رفع اشکالات و پایداری
- **همگام‌سازی تم Giscus**: نظرات اکنون به درستی تغییرات حالت تاریک/روشن را دنبال می‌کنند
- **دقت نتایج جستجو**: رفع مشکلات پیونددهی و فرار عنوان در نتایج جستجو
- **تبدیل تب‌ها**: رفع مشکلات ناوبری در حالت غیرهمگام تب
- **اسکرول فانتوم**: رفع رفتار ناخواسته اسکرول هنگام غیرفعال بودن پاورقی
- **دسترسی تصویر**: جلوگیری از رندر تکراری متن alt
- **رندر پیوند**: بهبود مدیریت URL پایه برای ساختارهای پیچیده سایت
---
## راهنمای مهاجرت
- [**نیازمندی‌های نسخه Hugo**](#hugo-version-requirements): نیاز به Hugo v0.146.0+ (نسخه extended) دارد
- [**تغییرات پیشوند کلاس‌های CSS**](#css-class-prefix-changes): کلاس‌های CSS کامپوننت اکنون از پیشوند سازگار `hextra-` استفاده می‌کنند
- [**مدیریت دارایی‌ها**](#asset-management-for-katex-and-mermaid): دارایی‌های KaTeX و Mermaid اکنون در زمان ساخت دانلود می‌شوند
- [**Tailwind CSS v4**](#tailwind-css-v4): کامپایل CSS داخلی اکنون از Tailwind CSS v4.x با پیشوند `hx:` استفاده می‌کند
#### نیازمندی‌های نسخه Hugo
**تأثیر**: سایت‌هایی که از نسخه‌های قدیمی Hugo استفاده می‌کنند
Hextra v0.10.0 به دلیل پذیرش سیستم قالب جدید، نیاز به Hugo v0.146.0 یا بالاتر (نسخه extended) دارد.
**اقدام مورد نیاز**: قبل از ارتقای Hextra، Hugo را به v0.146.0+ به‌روزرسانی کنید
#### تغییرات پیشوند کلاس‌های CSS
**تأثیر**: سایت‌هایی با CSS سفارشی که کلاس‌های کامپوننت Hextra را هدف قرار می‌دهند
Hextra v0.10.0 پیشوند سازگار `hextra-` را برای اکثر کلاس‌های CSS کامپوننت معرفی می‌کند تا قابلیت نگهداری را بهبود بخشد و از تداخل با استایل‌های کاربر جلوگیری کند.
**اقدام مورد نیاز**: اگر CSS سفارشی دارید که کامپوننت‌های Hextra را هدف قرار می‌دهد، نام کلاس‌های زیر را به‌روزرسانی کنید:
| حوزه | قبل | بعد |
| -------------------- | ---------------------------- | ------------------------------------------------- |
| جستجو (ظرف) | `.search-wrapper` | `.hextra-search-wrapper` |
| جستجو (ورودی) | `.search-input` | `.hextra-search-input` |
| جستجو (نتایج) | `.search-results` | `.hextra-search-results` |
| جستجو (عنوان) | `.search-wrapper .title` | `.hextra-search-wrapper .hextra-search-title` |
| جستجو (مورد فعال) | `.search-wrapper .active` | `.hextra-search-wrapper .hextra-search-active` |
| جستجو (بدون نتیجه) | `.search-wrapper .no-result` | `.hextra-search-wrapper .hextra-search-no-result` |
| جستجو (پیشوند) | `.search-wrapper .prefix` | `.hextra-search-wrapper .hextra-search-prefix` |
| جستجو (گزیده) | `.search-wrapper .excerpt` | `.hextra-search-wrapper .hextra-search-excerpt` |
| جستجو (مطابقت) | `.search-wrapper .match` | `.hextra-search-wrapper .hextra-search-match` |
| تارنما محو | `.nav-container-blur` | `.hextra-nav-container-blur` |
| منوی همبرگر | `.hamburger-menu` | `.hextra-hamburger-menu` |
| تغییر تم | `.theme-toggle` | `.hextra-theme-toggle` |
| تغییر زبان | `.language-switcher` | `.hextra-language-switcher` |
| ظرف نوار کناری | `.sidebar-container` | `.hextra-sidebar-container` |
| مورد فعال نوار کناری | `.sidebar-active-item` | `.hextra-sidebar-active-item` |
| نام فایل کد | `.filename` | `.hextra-code-filename` |
| آیکون کپی | `.copy-icon` | `.hextra-copy-icon` |
| آیکون موفقیت | `.success-icon` | `.hextra-success-icon` |
| مراحل | `.steps` | `.hextra-steps` |
#### مدیریت دارایی‌ها برای KaTeX و Mermaid
**تأثیر**: سایت‌هایی که از KaTeX یا Mermaid استفاده می‌کنند
Hextra v0.10.0 اکنون دارایی‌های KaTeX و Mermaid را از CDN در زمان ساخت دانلود می‌کند.
**چه چیزی تغییر کرده است:**
- فرآیند ساخت اکنون نیاز به دسترسی به اینترنت برای دانلود این دارایی‌ها دارد
- دیگر پس از ساخت، فراخوانی CDN خارجی برای این دارایی‌ها وجود ندارد
**اقدام مورد نیاز**:
- مطمئن شوید که محیط ساخت شما دسترسی به اینترنت برای دانلود دارایی‌ها دارد
- سایت‌های در محیط‌های ایزوله ممکن است نیاز به پیش‌دانلود این دارایی‌ها و پیکربندی Hextra برای بارگیری آنها داشته باشند
#### Tailwind CSS v4
**تأثیر**: سایت‌هایی با CSS سفارشی گسترده که کلاس‌های Tailwind Hextra `hx-*` را هدف قرار می‌دهند
در حالی که Hextra مهاجرت Tailwind CSS v4 را به صورت داخلی مدیریت می‌کند، سایت‌هایی با سفارشی‌سازی‌های سنگین ممکن است نیاز به تنظیمات بیشتری داشته باشند.
**چه چیزی تغییر کرده است:**
- کامپایل CSS داخلی اکنون از Tailwind CSS v4.x استفاده می‌کند
- کلاس‌های ابزار اکنون با پیشوند `hx:` به جای `hx-` هستند
## مشارکت‌کنندگان
این انتشار با مشارکت‌های 10 مشارکت‌کننده جدید ممکن شد:
- [@oosquare](https://github.com/oosquare) - فونت‌های KaTeX، قلاب‌های رندر تصویر، بهبودهای مدیریت پیوند
- [@Zabriskije](https://github.com/Zabriskije) - رفع اسکرول فانتوم
- [@miniwater](https://github.com/miniwater) - مرکزسازی پاورقی سفارشی، بهبودهای متن alt تصویر
- [@MattDodsonEnglish](https://github.com/MattDodsonEnglish) - کنترل‌های نمایه‌سازی گوگل، مستندات OpenGraph
- [@KStocky](https://github.com/KStocky) - ویژگی صفحه‌بندی معکوس
- [@PrintN](https://github.com/PrintN) - اضافه شدن نمایش مستندات
- [@hobobandy](https://github.com/hobobandy) - بهبودهای فاصله عنوان
- [@dlwocks31](https://github.com/dlwocks31) - به‌روزرسانی ترجمه کرهای
- [@TwoAnts](https://github.com/TwoAnts) - رفع تغییر تم Giscus
- [@ldez](https://github.com/ldez) - بهبودهای جستجو و رفع اشکالات
با تشکر ویژه از مشارکت‌کنندگان بازگشتی [@deining](https://github.com/deining) و [@yuri1969](https://github.com/yuri1969) برای حمایت مستمرشان در مستندات، ترجمه‌ها و بهبودهای فنی.
**تغییرات کامل**: https://github.com/imfing/hextra/compare/v0.9.7...v0.10.0

View File

@@ -3,39 +3,39 @@ linkTitle: "مستندات"
title: معرفی
---
👋 سلام! به مستندات هگزترا خوش آمدید!
👋 سلام! به مستندات Hextra خوش آمدید!
<!--more-->
## هگزترا چیه؟
## Hextra چیست؟
هگزترا یک تم [Hugo][hugo] مدرن و سریع است که با [Tailwind CSS][tailwind-css] ساخته شده است.
طراحی شده برای ساخت وب‌سایت‌های زیبا برای مستندات، وبلاگ‌ها و وب‌سایت‌ها، ویژگی‌های خارج از جعبه و انعطاف‌پذیری را برای پاسخگویی نیازهای مختلف فراهم می‌کند.
Hextra یک پوسته مدرن، سریع و کامل برای [Hugo][hugo] است که با [Tailwind CSS][tailwind-css] ساخته شده است.
این پوسته برای ساخت وب‌سایت‌های زیبا برای مستندات، وبلاگ‌ها و وب‌سایت‌ها طراحی شده و امکاناتی را به صورت پیش‌فرض ارائه می‌دهد که انعطاف لازم برای پاسخگویی به نیازهای مختلف را دارد.
## ویژگی‌ها
- **طراحی زیبا** - با الهام از Nextra، هگزترا از Tailwind CSS برای ارائه یک طراحی مدرن که سایت شما را برجسته می‌کند، استفاده می‌کند.
- **طراحی واکنش‌گرا و حالت تیره** - در تمام دستگاه‌ها، از تلفن همراه، تبلت تا دسکتاپ، عالی به نظر می‌رسد. حالت تیره نیز برای انطباق با شرایط مختلف روشنایی پشتیبانی می‌شود.
- **سریع و سبک** - طراحی شده توسط Hugo، یک ایجادکننده سایت استاتیک سریع مثل رعد و برق که در یک فایل باینری قرار گرفته است، هگزترا ردپای خود را به حداقل می‌رساند. برای استفاده از آن به جاوااسکریپت یا Node.js نیازی ندارید.
- **جستجوی متن کامل** - جستجوی متن کاملا آفلاین داخلی طراحی شده توسط FlexSearch، بدون نیاز به پیکربندی اضافی.
- **امکانات کامل** - برای بهتر کردن محتوای شما مارک‌داون، برجسته‌کردن سینتکس، فرمول‌های ریاضی LaTeX، نمودارها و عناصر Shortcodeها را شامل میشه. فهرست مطالب، بردکرامب، صفحه‌بندی، پیمایش نوار کناری و موارد دیگر همه به صورت خودکار تولید می‌شوند.
- **چند زبانه و سئو آماده** - سایت‌های چند زبانه با حالت چند زبانه Hugo راحت ساخته می‌شوند. پشتیبانی خارج از جعبه برای برچسب‌های سئو، Open Graph و کارت‌های توییتر گنجانده شده است.
- **طراحی زیبا** - با الهام از Nextra، Hextra از Tailwind CSS استفاده می‌کند تا طراحی مدرنی ارائه دهد که سایت شما را برجسته می‌کند.
- **چیدمان واکنش‌گرا و حالت تاریک** - در تمام دستگاه‌ها از موبایل و تبلت تا دسکتاپ عالی به نظر می‌رسد. حالت تاریک نیز پشتیبانی می‌شود تا شرایط نوری مختلف را پوشش دهد.
- **سریع و سبک‌وزن** - با قدرت Hugo، یک مولد سایت استاتیک فوق‌العاده سریع که در یک فایل باینری واحد قرار دارد، Hextra ردپای کوچکی دارد. برای استفاده از آن نیازی به JavaScript یا Node.js نیست.
- **جستجوی تمام‌متن** - جستجوی تمام‌متن آفلاین داخلی با قدرت FlexSearch، بدون نیاز به پیکربندی اضافی.
- **کامل و آماده استفاده** - عناصر Markdown، برجسته‌سازی سینتکس، فرمول‌های ریاضی LaTeX، نمودارها و Shortcodes برای غنی‌تر کردن محتوای شما. فهرست مطالب، مسیرهای ناوبری، صفحه‌بندی، نوار کناری و موارد دیگر همگی به صورت خودکار تولید می‌شوند.
- **چندزبانه و آماده برای سئو** - ساخت سایت‌های چندزبانه با حالت چندزبانه Hugo آسان شده است. پشتیبانی پیش‌فرض برای تگ‌های سئو، Open Graph و Twitter Cards وجود دارد.
## سوال یا بازخورد؟
## سوال یا بازخورد دارید؟
{{< callout emoji="❓" >}}
هگزترا هنوز در حال توسعه است.
سوال یا بازخوردی دارید؟ با خیال راحت [یک موضوع را باز کنید](https://github.com/imfing/hextra/issues)!
Hextra هنوز در حال توسعه فعال است.
سوال یا بازخوردی دارید؟ با خیال راحت [یک issue باز کنید](https://github.com/imfing/hextra/issues)!
{{< /callout >}}
## بعدی
برای شروع کردن به بخش زیر مراجعه کنید:
برای شروع، مستقیماً به بخش زیر بروید:
{{< cards >}}
{{< card link="getting-started" title="شروع کنید" icon="document-text" subtitle="یادگیری نحوه ایجاد وب‌سایت با استفاده از هگزترا" >}}
{{< 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/
[tailwind-css]: https://tailwindcss.com/

View File

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

View File

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

View File

@@ -1,20 +1,20 @@
---
title: سفارشی‌سازی هگزترا
title: سفارشی‌سازی Hextra
linkTitle: سفارشی‌سازی
---
هگزترا برخی از گزینه‌های سفارشی‌سازی پیش‌فرض را در پرونده `hugo.yaml` برای پیکربندی تم ارائه می‌کند.
این صفحه گزینه‌های موجود و نحوه سفارشی‌سازی بیشتر تم را توضیح می‌دهد.
Hextra برخی گزینه‌های پیش‌فرض سفارشی‌سازی را در فایل پیکربندی `hugo.yaml` ارائه می‌دهد تا تم را پیکربندی کنید.
این صفحه گزینه‌های موجود و نحوه سفارشی‌سازی بیشتر تم را توضیح می‌دهد.
<!--more-->
## CSS سفارشی
برای افزودن CSS سفارشی، باید یک پرونده `assets/css/custom.css` در سایت خود ایجاد کنیم. هگزترا به طور خودکار این پرونده را بارگیری خواهد کرد.
برای افزودن CSS سفارشی، باید یک فایل `assets/css/custom.css` در سایت خود ایجاد کنیم. Hextra به طور خودکار این فایل را بارگذاری می‌کند.
### خانواده فونت
خانواده فونت برای محتوا را می‌توانید با استفاده از این سفارشی کنید:
خانواده فونت محتوا را می‌توان با استفاده از موارد زیر سفارشی کرد:
```css {filename="assets/css/custom.css"}
.content {
@@ -22,9 +22,9 @@ linkTitle: سفارشی‌سازی
}
```
### عنصر کد درونخطی
### عنصر کد درون خطی
رنگ متن ترکیب شده با `متن دیگر` را می‌توانید با موارد زیر سفارشی کرد:
رنگ متن مخلوط شده با `متن دیگر` را می‌توان با موارد زیر سفارشی کرد:
```css {filename="assets/css/custom.css"}
.content code:not(.code-block code) {
@@ -34,40 +34,218 @@ linkTitle: سفارشی‌سازی
### رنگ اصلی
رنگ اصلی تم را می‌توانید با تنظیم متغیرهای `--primary-hue` و `--primary-saturation` سفارشی کرد:
رنگ اصلی تم را می‌توان با تنظیم متغیرهای `--primary-hue`، `--primary-saturation` و `--primary-lightness` سفارشی کرد:
```css {filename="assets/css/custom.css"}
:root {
--primary-hue: 100deg;
--primary-saturation: 90%;
--primary-lightness: 50%;
}
```
### برجسته‌کردن سینتکس
### متغیرهای چیدمان کامپوننت
فهرست تم‌های برجسته‌کردن سینتکس در دسترس [گالری Chroma Styles](https://xyproto.github.io/splash/docs/all.html) موجود است. شیوه‌نامه را می‌توانید با استفاده از دستور زیر تولید کرد:
Hextra متغیرهای CSS را برای سفارشی‌سازی عرض صفحات، نوار ناوبری و پاورقی ارائه می‌دهد:
```css {filename="assets/css/custom.css"}
:root {
/* عرض صفحه - همچنین از طریق params.page.width در hugo.yaml قابل پیکربندی است */
--hextra-max-page-width: 80rem; /* پیش‌فرض: 80rem (نرمال)، 90rem (عریض)، 100% (کامل) */
/* عرض نوار ناوبری - همچنین از طریق params.navbar.width در hugo.yaml قابل پیکربندی است */
--hextra-max-navbar-width: 90rem; /* عرض مستقل نوار ناوبری */
/* عرض پاورقی - همچنین از طریق params.footer.width در hugo.yaml قابل پیکربندی است */
--hextra-max-footer-width: 80rem; /* عرض مستقل پاورقی */
}
```
### متغیرهای تم Tailwind
با شروع از Hextra v0.10.0 که بر پایه Tailwind CSS v4 ساخته شده است، می‌توانید تم را با بازنویسی متغیرهای CSS در بلوک `@layer theme` سفارشی کنید.
این به شما امکان می‌دهد ظاهر کلی را بدون نیاز به تغییر هر کلاس به صورت جداگانه سفارشی کنید.
```css {filename="assets/css/custom.css"}
@layer theme {
:root {
--hx-default-mono-font-family: "JetBrains Mono", monospace;
}
}
```
برای جزئیات بیشتر، [مستندات متغیرهای تم Tailwind](https://tailwindcss.com/docs/theme#default-theme-variable-reference) را بررسی کنید.
### سفارشی‌سازی بیشتر تم
تم را می‌توان با بازنویسی استایل‌های پیش‌فرض از طریق کلاس‌های 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
- `hextra-jupyter-code-cell` - ظرف سلول کد Jupyter
- `hextra-jupyter-code-cell-outputs-container` - ظرف خروجی‌های سلول کد Jupyter
- `hextra-jupyter-code-cell-outputs` - عنصر div خروجی سلول کد Jupyter
##### PDF
- `hextra-pdf` - عنصر ظرف PDF
##### مراحل
- `hextra-steps` - ظرف مراحل
##### تب‌ها
- `hextra-tabs-panel` - ظرف پنل تب‌ها
- `hextra-tabs-toggle` - دکمه تغییر تب‌ها
##### درخت فایل
- `hextra-filetree` - ظرف درخت فایل
##### پوشه
- `hextra-filetree-folder` - ظرف پوشه درخت فایل
#### نوار ناوبری
- `hextra-nav-container` - ظرف نوار ناوبری
- `hextra-nav-container-blur` - عنصر ظرف نوار ناوبری در حالت محو
- `hextra-hamburger-menu` - دکمه منوی همبرگری
#### پاورقی
- `hextra-footer` - عنصر پاورقی
- `hextra-custom-footer` - ظرف بخش پاورقی سفارشی
#### جستجو
- `hextra-search-wrapper` - ظرف wrapper جستجو
- `hextra-search-input` - عنصر ورودی جستجو
- `hextra-search-results` - ظرف لیست نتایج جستجو
کلاس‌های تو در تو اختیاری مورد استفاده در رابط کاربری جستجو:
- `hextra-search-title` - عنصر عنوان نتیجه
- `hextra-search-active` - لنکر نتیجه فعال
- `hextra-search-no-result` - عنصر حالت خالی
- `hextra-search-prefix` - برچسب مسیر/پیشوند برای نتایج گروه‌بندی شده
- `hextra-search-excerpt` - متن خلاصه نتیجه
- `hextra-search-match` - span پرس و جوی هایلایت شده
#### فهرست مطالب
- `hextra-toc` - ظرف فهرست مطالب
#### نوار کناری
- `hextra-sidebar-container` - ظرف نوار کناری
- `hextra-sidebar-active-item` - آیتم فعال در نوار کناری
#### تغییردهنده زبان
- `hextra-language-switcher` - دکمه تغییردهنده زبان
- `hextra-language-options` - ظرف گزینه‌های زبان
#### تغییردهنده تم
- `hextra-theme-toggle` - دکمه تغییر تم
#### دکمه کپی کد
- `hextra-code-copy-btn-container` - ظرف دکمه کپی کد
- `hextra-code-copy-btn` - دکمه کپی کد
- `hextra-copy-icon` - عنصر آیکون کپی
- `hextra-success-icon` - عنصر آیکون موفقیت
#### بلوک کد
- `hextra-code-block` - ظرف بلوک کد
- `hextra-code-filename` - عنصر نام فایل برای بلوک‌های کد
#### کارت ویژگی
- `hextra-feature-card` - عنصر لینک کارت ویژگی
#### شبکه ویژگی
- `hextra-feature-grid` - ظرف شبکه ویژگی
#### هایلایت سینتکس
لیست تم‌های هایلایت سینتکس موجود در [گالری استایل‌های Chroma](https://xyproto.github.io/splash/docs/all.html) قابل مشاهده است. برگه استایل را می‌توان با دستور زیر تولید کرد:
```shell
hugo gen chromastyles --style=github
```
برای نادیده گرفتن طرح زمینه برجسته‌کردن سینتکس پیش‌فرض، می‌توانید استایل‌های تولید شده را به پرونده CSS سفارشی اضافه کنیم.
برای بازنویسی تم پیش‌فرض هایلایت سینتکس، می‌توانیم استایل‌های تولید شده را به فایل CSS سفارشی اضافه کنیم.
## اسکریپت‌های سفارشی
با افزودن پرونده زیر می‌توانید اسکریپت‌های سفارشی را برای هر صفحه به انتهای اون اضافه کنید:
می‌توانید اسکریپت‌های سفارشی را به انتهای head برای هر صفحه با افزودن فایل زیر اضافه کنید:
```
layouts/partials/custom/head-end.html
```
## طرح‌بندی‌های سفارشی
## بخش اضافی سفارشی در پاورقی
با ایجاد پرونده‌ای با همین نام در دایرکتوری `layouts` سایت خود، می‌توانید طرح‌های تم را نادیده بگیرید.
به عنوان مثال، برای لغو طرح‌بندی `single.html` برای مستندات، یک پرونده`layouts/docs/single.html` در سایت خود ایجاد کنید.
می‌توانید بخش اضافی در پاورقی با ایجاد یک فایل `layouts/partials/custom/footer.html` در سایت خود اضافه کنید.
برای اطلاعات بیشتر، به [Templateهای هیوگو](https://gohugo.io/templates/) مراجعه کنید.
```html {filename="layouts/partials/custom/footer.html"}
<!-- عنصر پاورقی شما اینجا -->
```
بخش اضافه شده قبل از بخش کپی‌رایت در پاورقی اضافه می‌شود.
می‌توانید از [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) و [سینتکس قالب Hugo](https://gohugo.io/templates/) برای افزودن محتوای خود استفاده کنید.
متغیرهای Hugo موجود در بخش پاورقی عبارتند از: `.switchesVisible` و `.displayCopyright`.
## چیدمان‌های سفارشی
چیدمان‌های تم را می‌توان با ایجاد یک فایل با همان نام در دایرکتوری `layouts` سایت خود بازنویسی کرد.
به عنوان مثال، برای بازنویسی چیدمان `single.html` برای مستندات، یک فایل `layouts/docs/single.html` در سایت خود ایجاد کنید.
برای اطلاعات بیشتر، به [مستندات قالب‌های Hugo][hugo-template-docs] مراجعه کنید.
## سفارشی‌سازی بیشتر
چیزی را که دنبالش بودید پیدا نکردید؟ با خیال راحت [بحثی را باز کنید](https://github.com/imfing/hextra/discussions) یا به موضوع کمک کنید!
آیا آنچه را که به دنبالش بودید پیدا نکردید؟ با خیال راحت [یک بحث باز کنید](https://github.com/imfing/hextra/discussions) یا به تم کمک کنید!
[hugo-template-docs]: https://gohugo.io/templates/

View File

@@ -4,13 +4,13 @@ weight: 1
prev: /docs/advanced
---
هگزترا از ایجاد سایت با چندین زبان با استفاده از [حالت چند زبانه](https://gohugo.io/content-management/multilingual/) Hugo پشتیبانی می‌کند.
Hextra از ایجاد سایت با چندین زبان با استفاده از [حالت چندزبانه](https://gohugo.io/content-management/multilingual/) هوگو پشتیبانی می‌کند.
<!--more-->
## فعال‌سازی چند زبانه
## فعال‌سازی چندزبانه
برای اینکه سایت ما چند زبانه شود، باید زبان‌های پشتیبانی شده را به Hugo بگوییم. باید به پرونده پیکربندی سایت اضافه کنیم:
برای چندزبانه کردن سایت، باید به هوگو زبان‌های پشتیبانی شده را اطلاع دهیم. باید به فایل پیکربندی سایت اضافه کنیم:
```yaml {filename="hugo.yaml"}
defaultContentLanguage: en
@@ -18,33 +18,33 @@ languages:
en:
languageName: English
weight: 1
fa:
languageName: فارسی
fr:
languageName: Français
weight: 2
ja:
languageName: 日本語
weight: 3
```
## مدیریت ترجمه‌ها بر اساس نام پرونده
## مدیریت ترجمه‌ها بر اساس نام فایل
Hugo از مدیریت ترجمه با نام پرونده پشتیبانی می‌کند. به عنوان مثال، اگر یک پرونده `content/docs/_index.md` به زبان انگلیسی داشته باشیم، می توانیم یک پرونده `content/docs/_index.fa.md` برای ترجمه فارسی ایجاد کنیم.
هوگو از مدیریت ترجمهها بر اساس نام فایل پشتیبانی می‌کند. به عنوان مثال، اگر فایلی به نام `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.fa.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) پشتیبانی می‌کند.
توجه: هوگو از [ترجمه بر اساس دایرکتوری محتوا](https://gohugo.io/content-management/multilingual/#translation-by-content-directory) نیز پشتیبانی می‌کند.
## ترجمه آیتم‌های منو
برای ترجمه آیتم‌های منو در نوار پیمایش، باید فیلد `identifier` را تنظیم کنیم:
برای ترجمه آیتم‌های منو در نوار ناوبری، باید فیلد `identifier` را تنظیم کنیم:
```yaml {filename="hugo.yaml"}
menu:
@@ -59,25 +59,25 @@ menu:
weight: 2
```
و آنها را در پرونده i18n مربوطه ترجمه کنید:
و آنها را در فایل i18n مربوطه ترجمه کنیم:
```yaml {filename="i18n/fa.yaml"}
documentation: مستندات
blog: وبلاگ
```yaml {filename="i18n/fr.yaml"}
documentation: Documentation
blog: Blog
```
## ترجمه رشته‌ها
برای ترجمه رشته‌ها در مکان‌های دیگر، باید ترجمه را به پرونده i18n مربوطه اضافه کنیم:
برای ترجمه رشته‌ها در سایر قسمت‌ها، باید ترجمه را به فایل i18n مربوطه اضافه کنیم:
```yaml {filename="i18n/fa.yaml"}
readMore: ادامه مطلب
```yaml {filename="i18n/fr.yaml"}
readMore: Lire la suite
```
فهرستی از رشته‌های استفاده شده در تم را می‌توان در پرونده `i18n/en.yaml` پیدا کرد.
لیستی از رشته‌های استفاده شده در قالب را می‌توان در فایل `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/)
- [حالت چندزبانه هوگو](https://gohugo.io/content-management/multilingual/)
- [چندزبانه هوگو بخش 1: ترجمه محتوا](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-1-managing-content-translation/)
- [چندزبانه هوگو بخش 2: بومی‌سازی رشته‌ها](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-2-i18n-string-localization/)

View File

@@ -1,5 +1,5 @@
---
title: شروع کنید
title: شروع به کار
weight: 1
tags:
- مستندات
@@ -8,32 +8,34 @@ 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) را بررسی کنید.
ما یک [گردش کار 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/)
[🌐 نسخه نمایشی ](https://imfing.github.io/hextra-starter-template/)
## شروع به عنوان پروژه جدید
دو راه اصلی برای اضافه کردن تم هگزترا به پروژه Hugo وجود دارد:
دو روش اصلی برای افزودن تم Hextra به پروژه Hugo شما وجود دارد:
1. **ماژول‌های Hugo (توصیه می‌شود)**: ساده‌ترین و توصیه شده‌ترین. [ماژول‌های Hugo](https://gohugo.io/hugo-modules/) به شما امکان می‌دهند تم را مستقیما از منبع آنلاین آن وارد کنید. تم به صورت خودکار دانلود و توسط Hugo مدیریت می‌شود.
2. **ساب‌ماژول گیت**: در عوض، هگزترا را به عنوان یک [ساب‌ماژول گیت](https://git-scm.com/book/en/v2/Git-Tools-Submodules) اضافه کنید. تم توسط گیت دانلود شده و در پوشه `themes` پروژه شما ذخیره می‌شود.
1. **ماژول‌های Hugo (توصیه شده)**: ساده‌ترین و توصیهشده‌ترین روش. [ماژول‌های Hugo](https://gohugo.io/hugo-modules/) به شما امکان می‌دهند تم را مستقیماً از منبع آنلاین آن دریافت کنید. تم به صورت خودکار دانلود شده و توسط Hugo مدیریت می‌شود.
### هگزترا را به عنوان ماژول Hugo راه‌اندازی کنید
2. **زیرماژول Git**: به عنوان جایگزین، Hextra را به عنوان یک [زیرماژول Git](https://git-scm.com/book/en/v2/Git-Tools-Submodules) اضافه کنید. تم توسط Git دانلود شده و در پوشه `themes` پروژه شما ذخیره می‌شود.
### راه‌اندازی Hextra به عنوان ماژول Hugo
#### پیش‌نیازها
قبل از شروع، باید این نرم‌افزارها را نصب کنید:
قبل از شروع، باید نرم‌افزارهای زیر را نصب کرده باشید:
- [Hugo (extended version)](https://gohugo.io/installation/)
- [Hugo (نسخه extended)](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
- [Go](https://go.dev/)
@@ -41,24 +43,24 @@ prev: /docs
{{% steps %}}
### راه‌انداختن یک سایت جدید Hugo
### راه‌اندازی یک سایت جدید 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` را برای استفاده از تم هگزترا پیکربندی کنید:
فایل `hugo.yaml` را برای استفاده از تم Hextra با افزودن موارد زیر پیکربندی کنید:
```yaml
module:
@@ -66,9 +68,9 @@ module:
- path: github.com/imfing/hextra
```
### اولین صفحه‌های محتوای خود را ایجاد کنید
### ایجاد اولین صفحات محتوای شما
ایجاد صفحه محتوای جدید برای صفحه اصلی و صفحه مستندات:
صفحه محتوای جدید برای صفحه اصلی و صفحه مستندات ایجاد کنید:
```shell
hugo new content/_index.md
@@ -81,72 +83,72 @@ hugo new content/docs/_index.md
hugo server --buildDrafts --disableFastRender
```
پیش‌نمایش سایت جدید شما در `http://localhost:1313/` در دسترس است.
تبریک می‌گوییم، پیش‌نمایش سایت جدید شما در `http://localhost:1313/` در دسترس است.
{{% /steps %}}
{{% details title="چگونه تم را به‌روز کنیم؟" %}}
{{% details title="چگونه تم را به‌روزرسانی کنیم؟" %}}
برای به‌روزرسانی همه ماژول‌های Hugo در پروژه خود به آخرین نسخه‌هایشان، دستور زیر را اجرا کنید:
برای به‌روزرسانی تمام ماژول‌های Hugo در پروژه خود به آخرین نسخه‌ها، دستور زیر را اجرا کنید:
```shell
hugo mod get -u
```
برای به‌روزرسانی هگزترا به [آخرین نسخه منتشر شده](https://github.com/imfing/hextra/releases)، دستور زیر را اجرا کنید:
برای به‌روزرسانی Hextra به [آخرین نسخه منتشر شده](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) مراجعه کنید.
برای جزئیات بیشتر، [ماژول‌های Hugo](https://gohugo.io/hugo-modules/use-modules/#update-all-modules) را ببینید.
{{% /details %}}
### هگزترا را به عنوان ساب‌ماژول Git راه‌اندازی کنید
### راه‌اندازی Hextra به عنوان زیرماژول Git
#### پیش‌نیازها
قبل از شروع، باید این نرم‌افزارها را نصب کنید:
قبل از شروع، باید نرم‌افزارهای زیر را نصب کرده باشید:
- [Hugo (extended version)](https://gohugo.io/installation/)
- [Hugo (نسخه extended)](https://gohugo.io/installation/)
- [Git](https://git-scm.com/)
#### مراحل
{{% steps %}}
### راه‌انداختن یک سایت جدید Hugo
### راه‌اندازی یک سایت جدید Hugo
```shell
hugo new site my-site --format=yaml
```
### افزودن تم هگسترا به عنوان یک ساب‌ماژول Git
### افزودن تم Hextra به عنوان زیرماژول Git
به دایرکتوری سایت بروید و یک مخزن Git جدید را مقداردهی اولیه کنید:
به دایرکتوری سایت بروید و یک مخزن Git جدید راه‌اندازی کنید:
```shell
cd my-site
git init
```
سپس، تم هگسترا را به عنوان یک ساب‌ماژول Git اضافه کنید:
سپس، تم Hextra را به عنوان زیرماژول Git اضافه کنید:
```shell
git submodule add https://github.com/imfing/hextra.git themes/hextra
```
با افزودن موارد زیر، `hugo.yaml` را برای استفاده از تم هگزترا پیکربندی کنید:
فایل `hugo.yaml` را برای استفاده از تم Hextra با افزودن موارد زیر پیکربندی کنید:
```yaml
theme: hextra
```
### اولین صفحه‌های محتوای خود را ایجاد کنید
### ایجاد اولین صفحات محتوای شما
ایجاد صفحه محتوای جدید برای صفحه اصلی و صفحه مستندات:
صفحه محتوای جدید برای صفحه اصلی و صفحه مستندات ایجاد کنید:
```shell
hugo new content/_index.md
@@ -164,39 +166,39 @@ hugo server --buildDrafts --disableFastRender
{{% /steps %}}
هنگام استفاده از [CI/CD](https://en.wikipedia.org/wiki/CI/CD) برای به‌کاراندازی وب‌سایت Hugo، از اجرای دستور زیر قبل از اجرای دستور `hugo` مطمئن شوید و ضروری است.
هنگام استفاده از [CI/CD](https://en.wikipedia.org/wiki/CI/CD) برای استقرار سایت Hugo، ضروری است که قبل از اجرای دستور `hugo`، دستور زیر اجرا شود.
```shell
git submodule update --init
```
اجرا نشدن این دستور باعث می‌شود که پوشه تم با پرونده‌های تم هگزترا پر نشود و منجر به خرابی ساخت شود.
عدم اجرای این دستور منجر به پر نشدن پوشه تم با فایل‌های تم Hextra شده و باعث شکست ساخت می‌شود.
{{% details title="چگونه تم را به‌روز کنیم؟" %}}
{{% details title="چگونه تم را به‌روزرسانی کنیم؟" %}}
برای به‌روزرسانی تمام ساب‌ماژول‌های در مخزن خود به آخرین commitها که موجود هست، دستور زیر را اجرا کنید:
برای به‌روزرسانی تمام زیرماژول‌های مخزن شما به آخرین کامیت‌ها، دستور زیر را اجرا کنید:
```shell
git submodule update --remote
```
برای به‌روزرسانی هگزترا به آخرین commit، دستور زیر را اجرا کنید:
برای به‌روزرسانی Hextra به آخرین کامیت، دستور زیر را اجرا کنید:
```shell
git submodule update --remote themes/hextra
```
برای جزئیات بیشتر به [ساب‌ماژول‌های Git](https://git-scm.com/book/en/v2/Git-Tools-Submodules) مراجعه کنید.
برای جزئیات بیشتر، [زیرماژول‌های 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/organize-files" title="سازماندهی فایلها" icon="document-duplicate" >}}
{{< card link="../guide/configuration" title="پیکربندی" icon="adjustments" >}}
{{< card link="../guide/markdown" title="مارک‌داون" icon="markdown" >}}
{{< /cards >}}
{{< card link="../guide/markdown" title="Markdown" icon="markdown" >}}
{{< /cards >}}

View File

@@ -7,17 +7,17 @@ sidebar:
open: true
---
برای یادگیری نحوه استفاده از هگزترا، بخش‌های زیر را کاوش کنید:
برای یادگیری نحوه استفاده از Hextra، بخش‌های زیر را بررسی کنید:
<!--more-->
{{< cards >}}
{{< card link="organize-files" title="سازماندهی پروندهها" icon="document-duplicate" >}}
{{< 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="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 >}}
{{< card link="deploy-site" title="استقرار سایت" icon="server" >}}
{{< /cards >}}

View File

@@ -1,11 +1,13 @@
---
title: پیکربندی
weight: 2
tags:
- پیکربندی
---
Hugo پیکربندی خود را از `hugo.yaml` در ریشه سایت Hugo شما می‌خواند.
پرونده پیکربندی جایی است که می‌توانید تمام جنبه‌های سایت خود را پیکربندی کنید.
پرونده پیکربندی این سایت [`exampleSite/hugo.yaml`](https://github.com/imfing/hextra/blob/main/exampleSite/hugo.yaml) را در گیت‌هاب بررسی کنید تا ایده‌ای جامع از تنظیمات موجود و بهترین شیوه‌ها بدست آورید.
Hugo تنظیمات خود را از فایل `hugo.yaml` در ریشه سایت شما می‌خواند.
فایل پیکربندی جایی است که می‌توانید تمام جنبه‌های سایت خود را تنظیم کنید.
برای آشنایی جامع با تنظیمات موجود و بهترین روش‌ها، فایل پیکربندی این سایت [`exampleSite/hugo.yaml`](https://github.com/imfing/hextra/blob/main/exampleSite/hugo.yaml) را در GitHub بررسی کنید.
<!--more-->
@@ -13,7 +15,7 @@ Hugo پیکربندی خود را از `hugo.yaml` در ریشه سایت Hugo
### منو
منوی سمت چپ بالا در قسمت `menu.main` در پرونده پیکربندی تعریف شده است:
منوی بالای صفحه در بخش `menu.main` در فایل پیکربندی تعریف می‌شود:
```yaml {filename="hugo.yaml"}
menu:
@@ -24,14 +26,14 @@ menu:
- name: وبلاگ
pageRef: /blog
weight: 2
- name: درباره ما
- name: درباره
pageRef: /about
weight: 3
- name: جستجو
weight: 4
params:
type: search
- name: گیت‌هاب
- name: GitHub
weight: 5
url: "https://github.com/imfing/hextra"
params:
@@ -40,35 +42,56 @@ menu:
انواع مختلفی از آیتم‌های منو وجود دارد:
1. پیوند به صفحه‌ای در سایت با `pageRef`
```yaml
- name: مستندات
pageRef: /docs
```
2. پیوند به یک نشانی اینترنتی با `url`
```yaml
- name: گیت‌هاب
url: "https://github.com"
```
1. لینک به یک صفحه در سایت با `pageRef`
```yaml
- name: مستندات
pageRef: /docs
```
2. لینک به یک URL خارجی با `url`
```yaml
- name: GitHub
url: "https://github.com"
```
3. نوار جستجو با `type: search`
```yaml
- name: جستجو
params:
type: search
```
```yaml
- name: جستجو
params:
type: search
```
4. آیکون
```yaml
- name: گیت‌هاب
params:
icon: github
```
```yaml
- name: GitHub
params:
icon: github
```
این آیتم‌های منو را می‌توانید با تنظیم پارامتر `weight` مرتب کنید.
این آیتم‌های منو را می‌توان با تنظیم پارامتر `weight` مرتب کرد.
### آرم و عنوان
### منوهای تو در تو
برای تغییر آرم پیش‌فرض، `hugo.yaml` را ویرایش کنید و مسیر را به پرونده آرم خود در دایرکتوری `static` اضافه کنید.
به صورت اختیاری، می‌توانید پیوندی را که کاربران هنگام کلیک کردن روی آرم شما به آن هدایت می‌شوند، تغییر دهید، همچنین عرض و ارتفاع آرم را به پیکسل تنظیم کنید.
با تعریف آیتم‌های منوی فرزند می‌توانید منوهای کشویی ایجاد کنید. منوهای فرزند با کلیک روی آیتم منوی والد نمایش داده می‌شوند.
```yaml {filename="hugo.yaml"}
menu:
main:
- identifier: sdk
name: SDK
- identifier: python
name: Python ↗
url: https://python.org
parent: sdk
- identifier: go
name: Go
url: https://go.dev
parent: sdk
```
آیتم‌های منوی فرزند باید پارامتر `parent` را با مقدار `identifier` والد مشخص کنند.
### لوگو و عنوان
برای تغییر لوگوی پیش‌فرض، فایل `hugo.yaml` را ویرایش کرده و مسیر فایل لوگوی خود را در دایرکتوری `static` اضافه کنید.
همچنین می‌توانید لینکی که کاربران با کلیک روی لوگو به آن هدایت می‌شوند را تغییر دهید و عرض و ارتفاع لوگو را بر حسب پیکسل تنظیم کنید.
```yaml {filename="hugo.yaml"}
params:
@@ -87,10 +110,10 @@ params:
### نوار کناری اصلی
برای نوار کناری اصلی، به طور خودکار از ساختار دایرکتوری محتوا تولید می‌شود.
برای جزئیات بیشتر به صفحه [سازماندهی پروندهها](/fa/docs/guide/organize-files) مراجعه کنید.
برای نوار کناری اصلی، به طور خودکار از ساختار دایرکتوری محتوا ایجاد می‌شود.
برای جزئیات بیشتر به صفحه [سازماندهی فایلها](/docs/guide/organize-files) مراجعه کنید.
برای حذف یک صفحه از نوار کناری سمت راست، پارامتر`sidebar.exclude` را در قسمت بالایی صفحه تنظیم کنید:
برای حذف یک صفحه از نوار کناری چپ، پارامتر `sidebar.exclude` را در front matter صفحه تنظیم کنید:
```yaml {filename="content/docs/guide/configuration.md"}
---
@@ -100,9 +123,9 @@ sidebar:
---
```
### پیوندهای اضافی
### لینک‌های اضافی
پیوندهای اضافی نوار کناری در زیر بخش `menu.sidebar` در پرونده پیکربندی تعریف شده است:
لینک‌های اضافی نوار کناری در بخش `menu.sidebar` در فایل پیکربندی تعریف می‌شوند:
```yaml {filename="hugo.yaml"}
menu:
@@ -111,19 +134,19 @@ menu:
params:
type: separator
weight: 1
- name: "درباره ما"
- name: "درباره"
pageRef: "/about"
weight: 2
- name: "مستندات هیوگو ↖"
- name: "مستندات Hugo ↗"
url: "https://gohugo.io/documentation/"
weight: 3
```
## نوار کناری سمت چپ
## نوار کناری راست
### فهرست مطالب
فهرست مطالب به طور خودکار از سرتیرهای موجود در پرونده محتوا تولید می‌شود. می‌توان آن را با تنظیم `toc: false` در قسمت بالایی صفحه غیرفعال کرد.
فهرست مطالب به طور خودکار از عناوین موجود در فایل محتوا ایجاد می‌شود. می‌توانید آن را با تنظیم `toc: false` در front matter صفحه غیرفعال کنید.
```yaml {filename="content/docs/guide/configuration.md"}
---
@@ -132,9 +155,9 @@ toc: false
---
```
### پیوند ویرایش صفحه
### لینک ویرایش صفحه
برای پیکربندی پیوند ویرایش صفحه، می‌توانیم پارامتر `params.editURL.base` را در پرونده پیکربندی تنظیم کنیم:
برای پیکربندی لینک ویرایش صفحه، می‌توانیم پارامتر `params.editURL.base` را در فایل پیکربندی تنظیم کنیم:
```yaml {filename="hugo.yaml"}
params:
@@ -143,8 +166,8 @@ params:
base: "https://github.com/your-username/your-repo/edit/main"
```
پیوندهای ویرایش به طور خودکار برای هر صفحه براساس نشانی اینترنتی ارائه شده به عنوان دایرکتوری ریشه ایجاد می‌شود.
اگر می‌خواهید پیوند ویرایش را برای یک صفحه خاص تنظیم کنید، می‌توانید پارامتر `editURL` را در قسمت بالای صفحه تنظیم کنید:
لینک‌های ویرایش به طور خودکار برای هر صفحه بر اساس URL ارائه شده به عنوان دایرکتوری ریشه ایجاد می‌شوند.
اگر می‌خواهید لینک ویرایش را برای یک صفحه خاص تنظیم کنید، می‌توانید پارامتر `editURL` را در front matter صفحه تنظیم کنید:
```yaml {filename="content/docs/guide/configuration.md"}
---
@@ -155,22 +178,22 @@ editURL: "https://example.com/edit/this/page"
## پاورقی
### کپیرایت
### کپی رایت
برای تغییر متن کپیرایت نمایش داده شده در پاورقی وب‌سایت خود، باید پرونده‌ای به نام `i18n/fa.yaml` ایجاد کنید.
در این پرونده متن کپیرایت جدید خود را مطابق شکل زیر مشخص کنید:
برای تغییر متن کپی رایت نمایش داده شده در پاورقی سایت، باید یک فایل به نام `i18n/en.yaml` ایجاد کنید.
در این فایل، متن جدید کپی رایت را به صورت زیر مشخص کنید:
```yaml {filename="i18n/fa.yaml"}
copyright: "© ۲۰۲۴ متن شما در اینجا"
```yaml {filename="i18n/en.yaml"}
copyright: "© 2024 متن دلخواه شما"
```
برای مرجع شما، یک مثال [`i18n/en.yaml`](https://github.com/imfing/hextra/blob/main/i18n/en.yaml) را می‌توانید در مخزن گیت‌هاب پیدا کنید. علاوه بر این، می‌توانید از فرمت مارک‌داون در متن کپیرایت استفاده کنید.
برای مرجع، یک فایل نمونه [`i18n/en.yaml`](https://github.com/imfing/hextra/blob/main/i18n/en.yaml) در مخزن GitHub موجود است. همچنین می‌توانید از قالب Markdown در متن کپی رایت استفاده کنید.
## سایر موارد
### Favicon
### فاوآیکون
برای سفارشی کردن [favicon](https://en.wikipedia.org/wiki/Favicon) برای سایت خود، پرونده‌های آیکون را درون پوشه `static` قرار دهید تا [faviconهای پیش‌فرض در تم](https://github.com/imfing/hextra/tree/main/static) جایگزین شود:
برای سفارشی کردن [فاوآیکون](https://fa.wikipedia.org/wiki/فاوآیکون) سایت، فایل‌های آیکون را در پوشه `static` قرار دهید تا [فاوآیکون‌های پیش‌فرض قالب](https://github.com/imfing/hextra/tree/main/static) را جایگزین کنید:
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
@@ -186,14 +209,30 @@ copyright: "© ۲۰۲۴ متن شما در اینجا"
{{< /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) برای تولید این آیکون‌ها استفاده کنید.
حداقل، فایل `favicon.svg` را در پوشه `static` قرار دهید. این فایل به عنوان فاوآیکون پیش‌فرض سایت استفاده می‌شود.
می‌توانید یک فاوآیکون SVG تطبیقی ایجاد کنید که به ترجیحات تم سیستم پاسخ دهد با استفاده از media queryهای CSS درون خود SVG، با پیروی از روش توضیح داده شده در [ساخت یک فاوآیکون تطبیقی](https://web.dev/articles/building/an-adaptive-favicon).
#### پشتیبانی از حالت تاریک
برای پشتیبانی بهتر از حالت تاریک، فایل `favicon-dark.svg` را در کنار `favicon.svg` در پوشه `static` قرار دهید. وقتی هر دو فایل موجود باشند، Hextra به طور خودکار:
- از `favicon.svg` برای حالت روشن یا زمانی که ترجیح تمی مشخص نشده استفاده می‌کند
- به `favicon-dark.svg` تغییر می‌کند وقتی سیستم کاربر در حالت تاریک تنظیم شده است
- تنظیمات `prefers-color-scheme` سیستم را برای تغییر خودکار رعایت می‌کند
تغییر فاوآیکون حالت تاریک در تمام مرورگرهای مدرن، از جمله Firefox، کار می‌کند و تجربه‌ای یکپارچه که با تم سایت شما مطابقت دارد ارائه می‌دهد.
#### فرمت‌های اضافی
در حالی که `favicon.ico` عمدتاً برای مرورگرهای قدیمی است، مرورگرهای مدرن از فاوآیکون‌های SVG پشتیبانی می‌کنند که به دلیل مقیاس‌پذیری و حجم کم فایل ترجیح داده می‌شوند.
در صورت نیاز از ابزارهایی مانند [favicon.io](https://favicon.io/) یا [favycon](https://github.com/ruisaraiva19/favycon) برای تولید فرمت‌های اضافی فاوآیکون استفاده کنید.
### پیکربندی تم
از تنظیمات `theme` برای پیکربندی حالت پیش‌فرض تم و دکمه جابه‌جایی استفاده کنید و به بازدیدکنندگان اجازه دهید بین حالت روشن یا تیره جابجا شوند.
از تنظیم `theme` برای پیکربندی حالت پیش‌فرض تم و دکمه تغییر تم استفاده کنید، که به بازدیدکنندگان امکان تغییر بین حالت روشن یا تاریک را می‌دهد.
```yaml {filename="hugo.yaml"}
params:
@@ -205,16 +244,32 @@ params:
گزینه‌های `theme.default`:
- `light` - همیشه از حالت روشن استفاده شود
- `dark` - همیشه از حالت تیره استفاده شود
- `system` - همگام‌سازی با تنظیمات سیستمعامل (پیش‌فرض)
- `light` - همیشه از حالت روشن استفاده کنید
- `dark` - همیشه از حالت تاریک استفاده کنید
- `system` - همگام با تنظیمات سیستم عامل (پیش‌فرض)
پارامتر `theme.displayToggle` به شما این امکان را می‌دهد که یک دکمه جابجایی برای تغییر حالت تم‌ها نمایش دهید.
وقتی روی `true` تنظیم شود، بازدیدکنندگان می‌توانند بین حالت روشن یا تیره جابه‌جا شوند و تنظیمات پیش‌فرض را نادیده بگیرند.
پارامتر `theme.displayToggle` به شما امکان می‌دهد دکمه‌ای برای تغییر تم نمایش دهید.
وقتی روی `true` تنظیم شود، بازدیدکنندگان می‌توانند بین حالت روشن یا تاریک تغییر دهند و تنظیم پیش‌فرض را لغو کنند.
### آخرین تغییر صفحه
تاریخ آخرین تغییر صفحه را می‌توان با فعال کردن پرچم `params.displayUpdatedDate` نمایش داد. برای استفاده از تاریخ commit Git به عنوان منبع، پرچم `enableGitInfo` را نیز فعال کنید.
برای سفارشی کردن فرمت تاریخ، پارامتر `params.dateFormat` را تنظیم کنید. چیدمان آن با [`time.Format`](https://gohugo.io/functions/time/format/) Hugo مطابقت دارد.
```yaml {filename="hugo.yaml"}
# تجزیه commit Git
enableGitInfo: true
params:
# نمایش تاریخ آخرین تغییر
displayUpdatedDate: true
dateFormat: "January 2, 2006"
```
### برچسب‌ها
برای نمایش برچسب‌های صفحه، گزینه‌های زیر را در فایل پیکربندی تنظیم کنید:
برای نمایش برچسب‌های صفحه، پرچم‌های زیر را در فایل پیکربندی تنظیم کنید:
```yaml {filename="hugo.yaml"}
params:
@@ -227,7 +282,7 @@ params:
### عرض صفحه
عرض صفحه را می‌توان با پارامتر `params.page.width` در پرونده پیکربندی سفارشی کرد:
عرض صفحه را می‌توان با پارامتر `params.page.width` در فایل پیکربندی سفارشی کرد:
```yaml {filename="hugo.yaml"}
params:
@@ -236,35 +291,53 @@ params:
width: wide
```
سه گزینه در دسترس وجود دارد: `full`، `wide` و normal`. به طور پیش‌فرض، عرض صفحه روی normal` تنظیم شده است.
سه گزینه موجود است: `full`, `wide`, و `normal`. به طور پیش‌فرض، عرض صفحه روی `normal` تنظیم شده است.
به طور مشابه، عرض نوار ناوبری و پاورقی را می‌توان با پارامترهای `params.navbar.width` و `params.footer.width` سفارشی کرد.
### فهرست جستجو
### نمایه FlexSearch
جستجوی متن کامل توسط [FlexSearch](https://github.com/nextapps-de/flexsearch) پیاده‌سازی شده و به طور پیش‌فرض فعال است.
برای سفارشی کردن فهرست جستجو، پارامتر `params.search.flexsearch.index` را در پرونده پیکربندی تنظیم کنید:
جستجوی تمام متن با قدرت [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
# نمایه صفحه بر اساس: content | summary | heading | title
index: content
```
گزینه‌های `flexsearch.index`:
- `content` - محتوای کامل صفحه (پیش‌فرض)
- `summary` - خلاصه صفحه، برای جزئیات بیشتر به [خلاصه مطالب Hugo](https://gohugo.io/content-management/summaries/) مراجعه کنید
- `heading` - سرتیترهای سطح ۱ و سطح ۲
- `title` - فقط شامل عنوان صفحه است
- `summary` - خلاصه صفحه، برای جزئیات بیشتر به [خلاصه‌های محتوای Hugo](https://gohugo.io/content-management/summaries/) مراجعه کنید
- `heading` - عناوین سطح 1 و سطح 2
- `title` - فقط عنوان صفحه را شامل شود
برای حذف یک صفحه از فهرست جستجو، `excludeSearch: true` را در قسمت بالای صفحه تنظیم کنید:
برای سفارشی کردن tokenize جستجو، پارامتر `params.search.flexsearch.tokenize` را در فایل پیکربندی تنظیم کنید:
```yaml {filename="hugo.yaml"}
params:
search:
# ...
flexsearch:
# full | forward | reverse | strict
tokenize: forward
```
گزینه‌های [`flexsearch.tokenize`](https://github.com/nextapps-de/flexsearch/#tokenizer-prefix-search):
- `strict` - نمایه‌گذاری کل کلمات
- `forward` - نمایه‌گذاری تدریجی کلمات در جهت جلو
- `reverse` - نمایه‌گذاری تدریجی کلمات در هر دو جهت
- `full` - نمایه‌گذاری هر ترکیب ممکن
برای حذف یک صفحه از نمایه جستجوی FlexSearch، `excludeSearch: true` را در front matter صفحه تنظیم کنید:
```yaml {filename="content/docs/guide/configuration.md"}
---
@@ -273,12 +346,59 @@ excludeSearch: true
---
```
### گوگل آنالیتیکس
### Google Analytics
برای فعال کردن [گوگل آنالیتیکس](https://marketingplatform.google.com/about/analytics/)، پرچم `services.googleAnalytics.ID` را در `hugo.yaml` تنظیم کنید:
برای فعال کردن [Google Analytics](https://marketingplatform.google.com/about/analytics/)، پرچم `services.googleAnalytics.ID` را در `hugo.yaml` تنظیم کنید:
```yaml {filename="hugo.yaml"}
services:
googleAnalytics:
ID: G-MEASUREMENT_ID
```
### نمایه Google Search
برای [مسدود کردن Google Search](https://developers.google.com/search/docs/crawling-indexing/block-indexing) از نمایه‌گذاری یک صفحه، `noindex` را در front matter صفحه روی true تنظیم کنید:
```yaml
title: پیکربندی (نسخه آرشیو)
params:
noindex: true
```
برای حذف یک دایرکتوری کامل، از کلید [`cascade`](https://gohugo.io/configuration/cascade/) در فایل `_index.md` والد استفاده کنید.
> [!NOTE]
> برای مسدود کردن خزنده‌های جستجو، می‌توانید یک [قالب `robots.txt`](https://gohugo.io/templates/robots/) ایجاد کنید.
> با این حال، دستورالعمل‌های `robots.txt` لزوماً صفحه را از نتایج جستجوی Google خارج نمی‌کنند.
### پشتیبانی از LLMS.txt
برای فعال کردن فرمت خروجی [llms.txt](https://llmstxt.org/) برای سایت شما، که یک طرح متنی ساختاریافته برای [مدل‌های زبانی بزرگ](https://fa.wikipedia.org/wiki/مدل_زبانی_بزرگ) و عامل‌های هوش مصنوعی ارائه می‌دهد، فرمت خروجی `llms` را به `hugo.yaml` سایت خود اضافه کنید:
```diff {filename="hugo.yaml"}
outputs:
- home: [html]
+ home: [html, llms]
page: [html]
section: [html, rss]
```
این کار یک فایل `llms.txt` در ریشه سایت شما ایجاد می‌کند که شامل:
- عنوان و توضیحات سایت
- لیست سلسله مراتبی تمام بخش‌ها و صفحات
- خلاصه صفحات و تاریخ انتشار
- لینک‌های مستقیم به تمام محتوا
فایل llms.txt به طور خودکار از ساختار محتوای شما ایجاد می‌شود و سایت شما را برای ابزارهای هوش مصنوعی و مدل‌های زبانی برای زمینه و مرجع قابل دسترس‌تر می‌کند.
### Open Graph
برای افزودن متادیتای [Open Graph](https://ogp.me/) به یک صفحه، مقادیر را در پارامترهای frontmatter اضافه کنید.
از آنجا که یک صفحه می‌تواند چندین تگ `image` و `video` داشته باشد، مقادیر آنها را در یک آرایه قرار دهید.
سایر ویژگی‌های Open Graph می‌توانند فقط یک مقدار داشته باشند.
به عنوان مثال، این صفحه یک تگ `og:image` (که تصویری برای پیش‌نمایش در اشتراک‌گذاری‌های اجتماعی پیکربندی می‌کند) و یک تگ `og:audio` دارد.
```yaml {filename

View File

@@ -1,90 +1,92 @@
---
title: به‌کاراندازی سایت
title: استقرار سایت
prev: /docs/guide/shortcodes
next: /docs/advanced
---
Hugo وبسایت‌های استاتیک را ایجاد می‌کند و امکان گزینه‌های میزبانی انعطاف‌پذیر را فراهم می‌کند.
این صفحه راهنماهایی برای به‌کاراندازی سایت هگزترا شما در پلتفرم‌های مختلف ارائه می‌کند.
Hugo وبسایت‌های استاتیک تولید می‌کند که امکان میزبانی انعطاف‌پذیر را فراهم می‌سازد.
این صفحه راهنماهایی برای استقرار سایت Hextra شما روی پلتفرم‌های مختلف ارائه می‌دهد.
<!--more-->
## گیت‌هاب Pages
## GitHub Pages
[گیت‌هاب Pages](https://docs.github.com/pages) روشی توصیه شده برای به‌کاراندازی و میزبانی وبسایت شما به صورت رایگان است.
[GitHub Pages](https://docs.github.com/pages) روش توصیهشده برای استقرار و میزبانی رایگان وبسایت شماست.
اگر سایت را با استفاده از [hextra-starter-template](https://github.com/imfing/hextra-starter-template) راه‌اندازی سریع پیاده‌سازی می‌کنید، گردش کار گیت‌هاب Actions را به صورت خارج از جعبه ارائه کرده‌ایم که به‌کاراندازی خودکار در گیت‌هاب Pages به شما کمک می‌کند.
اگر سایت را با استفاده از [hextra-starter-template](https://github.com/imfing/hextra-starter-template) راه‌اندازی کرده‌اید، این قالب از پیش یک گردش کار GitHub Actions برای استقرار خودکار در GitHub Pages ارائه می‌دهد.
{{% details title="پیکربندی گیت‌هاب Actions" closed="true" %}}
{{% details title="پیکربندی GitHub Actions" closed="true" %}}
در زیر یک پیکربندی مثال از [hextra-starter-template](https://github.com/imfing/hextra-starter-template) آورده شده است:
در زیر یک نمونه پیکربندی از [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
# نمونه گردش کار برای ساخت و استقرار یک سایت Hugo در GitHub Pages
name: استقرار سایت Hugo در Pages
on:
# Runs on pushes targeting the default branch
# در push به شاخه پیش‌فرض اجرا می‌شود
push:
branches: ["main"]
# Allows you to run this workflow manually from the Actions tab
# امکان اجرای دستی این گردش کار از تب Actions
workflow_dispatch:
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
# تنظیم مجوزهای GITHUB_TOKEN برای امکان استقرار در 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
# پیش‌فرض bash
defaults:
run:
shell: bash
jobs:
# Build job
# کار ساخت
build:
runs-on: ubuntu-latest
env:
HUGO_VERSION: 0.117.0
HUGO_VERSION: 0.147.7
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
fetch-depth: 0 # دریافت تمام تاریخچه برای .GitInfo و .Lastmod
submodules: recursive
- name: راه‌اندازی Go
uses: actions/setup-go@v5
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
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:
# For maximum backward compatibility with Hugo modules
# برای حداکثر سازگاری با ماژول‌های Hugo
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
--baseURL "${{ steps.pages.outputs.base_url }}/"
- name: آپلود آرتیفکت
uses: actions/upload-pages-artifact@v3
with:
path: ./public
# Deployment job
# کار استقرار
deploy:
environment:
name: github-pages
@@ -92,22 +94,22 @@ jobs:
runs-on: ubuntu-latest
needs: build
steps:
- name: Deploy to GitHub Pages
- name: استقرار در GitHub Pages
id: deployment
uses: actions/deploy-pages@v2
uses: actions/deploy-pages@v4
```
{{% /details %}}
{{< callout >}}
در تنظیمات مخزن خود، **Pages** > **Build and deployment** > **Source** را روی **GitHub Actions** تنظیم کنید:
در تنظیمات مخزن، بخش **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>/` است.
به طور پیش‌فرض، گردش کار GitHub Actions فوق `.github/workflows/pages.yaml` فرض می‌کند که سایت در `https://<USERNAME>.github.io/<REPO>/` مستقر می‌شود.
اگر در حال استفاده از `https://<USERNAME>.github.io/` هستید، سپس `--baseURL` را تغییر دهید:
اگر در `https://<USERNAME>.github.io/` مستقر می‌کنید، `--baseURL` را اصلاح کنید:
```yaml {filename=".github/workflows/pages.yaml",linenos=table,linenostart=54,hl_lines=[4]}
run: |
@@ -116,47 +118,47 @@ run: |
--baseURL "https://${{ github.repository_owner }}.github.io/"
```
اگر می‌خواهید روی دامنه شخصی خود استقرار پیدا کند، لطفا مقدار `--baseURL` را بر این اساس تغییر دهید.
اگر در دامنه خود مستقر می‌کنید، لطفاً مقدار `--baseURL` را متناسب با آن تغییر دهید.
## کلودفلر Pages
## Cloudflare Pages
1. کد منبع سایت خود را در یک مخزن Git (به عنوان مثال گیت‌هاب) قرار دهید
2. وارد [پیشخوان کلودفلر](https://dash.cloudflare.com/) شوید و حساب خود را انتخاب کنید
3. در صفحه اصلی حساب‌کاربری، **Workers & Pages** > **Create application** > **Pages** > **Connect to Git** را انتخاب کنید
4. مخزن را انتخاب کنید و در بخش Set up builds and Deployments اطلاعات زیر را وارد کنید:
1. کد منبع سایت را در یک مخزن Git (مثلاً GitHub) قرار دهید.
2. به [داشبورد Cloudflare](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` |
| تنظیمات | مقدار |
| ---------------- | -------------------- |
| شاخه تولید | `main` |
| دستور ساخت | `hugo --gc --minify` |
| دایرکتوری ساخت | `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/).
- [استقرار یک سایت 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 خود (گیت‌هاب، گیت‌لب و غیره) ارسال کنید.
2. [وارد کردن پروژه](https://app.netlify.com/start) به Netlify
1. کد خود را به مخزن Git (GitHub, GitLab و غیره) push کنید.
2. [پروژه را به Netlify وارد کنید](https://app.netlify.com/start).
3. اگر از [hextra-starter-template][hextra-starter-template] استفاده نمی‌کنید، موارد زیر را به صورت دستی پیکربندی کنید:
- دستور Build را روی `hugo --gc --minify` پیکربندی کنید
- دایرکتوری Publish را برای `public` مشخص کنید
- `HUGO_VERSION` متغیر محیط استقرار را اضافه کنید و روی `0.119.0` تنظیم کنید
4. استقرار!
- دستور ساخت را روی `hugo --gc --minify` تنظیم کنید.
- دایرکتوری انتشار را روی `public` مشخص کنید.
- متغیر محیطی `HUGO_VERSION` را اضافه کرده و روی `0.147.7` تنظیم کنید، یا آن را در فایل `netlify.toml` مشخص کنید.
4. استقرار دهید!
برای جزئیات بیشتر [Hugo را در Netlify](https://docs.netlify.com/integrations/frameworks/hugo/) بررسی کنید.
برای جزئیات بیشتر، [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` تنظیم کنید
1. کد خود را به مخزن Git (GitHub, GitLab و غیره) push کنید.
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)
![پیکربندی استقرار Vercel](https://github.com/imfing/hextra/assets/5097752/887d949b-8d05-413f-a2b4-7ab92192d0b3)

View File

@@ -4,15 +4,15 @@ weight: 6
next: /docs/guide/shortcodes
---
در حال حاضر، هگزترا از [Mermaid](#mermaid) برای نمودارها پشتیبانی می‌کند.
در حال حاضر، Hextra از [Mermaid](#mermaid) برای نمودارها پشتیبانی می‌کند.
<!--more-->
## Mermaid
[Mermaid](https://github.com/mermaid-js/mermaid#readme) یک ابزار نمودار و نمودار مبتنی بر جاوااسکریپت است که تعاریف متنی الهام گرفته از مارک‌داون را دریافت می‌کند و نمودارها را به صورت پویا در مرورگر ایجاد می‌کند. به عنوان مثال، Mermaid می‌تواند نمودارهای فلوچارت، نمودارهای توالی، نمودارهای دایره‌ای و موارد دیگر را رندر کند.
[Mermaid](https://github.com/mermaid-js/mermaid#readme) یک ابزار نمودار و چارت مبتنی بر جاوااسکریپت است که تعاریف متنی الهامگرفته از Markdown را گرفته و به صورت پویا در مرورگر نمودارها را ایجاد می‌کند. به عنوان مثال، Mermaid می‌تواند فلوچارتها، نمودارهای توالی، نمودارهای دایره‌ای و موارد دیگر را رندر کند.
استفاده از Mermaid در هگزترا به سادگی نوشتن یک بلوک کد با مجموعه زبان `mermaid` است:
استفاده از Mermaid در Hextra به سادگی نوشتن یک بلوک کد با زبان تنظیم شده `mermaid` است:
````markdown
```mermaid
@@ -24,7 +24,7 @@ graph TD;
```
````
به صورت زیر رندر خواهد شد:
به صورت زیر رندر می‌شود:
```mermaid
graph TD;
@@ -50,4 +50,4 @@ sequenceDiagram
Bob-->>John: Jolly good!
```
برای اطلاعات بیشتر، لطفا به [مستندات Mermaid](https://mermaid-js.github.io/mermaid/#/) مراجعه کنید.
برای اطلاعات بیشتر، لطفاً به [مستندات Mermaid](https://mermaid-js.github.io/mermaid/#/) مراجعه کنید.

View File

@@ -3,32 +3,35 @@ title: "LaTeX"
weight: 4
---
به طور پیش‌فرض، \(\KaTeX\) برای رندر کردن عبارتهای ریاضی LaTeX استفاده می‌شود.
نیازی به فعال‌سازی دستی نیست، می‌توانید فوراً از عبارت‌های ریاضی LaTeX در محتوای مارک‌داون خود استفاده کنید.
عبارات ریاضی LaTeX به طور پیش‌فرض با استفاده از \(\KaTeX\) نمایش داده می‌شوند. کافی است آنها را در محتوای Markdown خود قرار دهید بدون نیاز به هیچ پیکربندی دستی.
## مثال
## نحوه استفاده
هر دو عبارت‌های ریاضی درونخطی و پاراگراف جداگانه LaTeX در محتوای مارک‌داون پشتیبانی می‌شوند.
می‌توانید از LaTeX هم برای عبارات درون خطی و هم برای بلوک‌های بزرگتر متن استفاده کنید.
### درونخطی
### ریاضی درون خطی
برای قرار دادن یک عبارت درون یک خط متن، آن را بین `\(` و `\)` قرار دهید.
```markdown {filename="page.md"}
این \(\sigma(z) = \frac{1}{1 + e^{-z}}\) درونخطی است.
این \(\sigma(z) = \frac{1}{1 + e^{-z}}\) یک عبارت درون خطی است.
```
این \(\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$$
```
به صورت زیر رندر خواهد شد:
به این صورت نمایش داده می‌شود:
$$F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-j\omega t} \, dt$$
$$F(\omega) = \int_{-\infty}^{\infty} f(t)\, e^{-j \omega t} \, dt$$
به عنوان مثال، استفاده از محیط هم‌ترازی:
همچنین می‌توانید از محیط‌های LaTeX مانند `aligned` برای عبارات چندخطی استفاده کنید.
```latex {filename="page.md"}
$$
@@ -41,7 +44,7 @@ $$
$$
```
به صورت زیر رندر خواهد شد:
به این صورت نمایش داده می‌شود:
$$
\begin{aligned}
@@ -52,11 +55,28 @@ $$
\end{aligned}
$$
برای مشاهده لیست توابع پشتیبانی شده، به [توابع پشتیبانی شده توسط KaTeX](https://katex.org/docs/supported.html) مراجعه کنید.
### عبارات شیمیایی
افزونه [mhchem][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-}$$
## پیکربندی
> [!IMPORTANT]
> لطفاً [افزونه passthrough](https://gohugo.io/content-management/mathematics/) را در فایل پیکربندی Hugo فعال و پیکربندی کنید تا Hugo بتواند عبارت‌های ریاضی LaTeX را در محتوای مارک‌داون شما تشخیص دهد.
> لطفاً افزونه [passthrough](https://gohugo.io/content-management/mathematics/) را در فایل پیکربندی Hugo فعال و پیکربندی کنید تا Hugo بتواند عبارات ریاضی LaTeX را در محتوای Markdown شما تشخیص دهد.
```yaml {filename="hugo.yaml"}
markup:
@@ -69,35 +89,47 @@ markup:
enable: true
```
## توابع پشتیبانی شده
### موتور ریاضی
برای مشاهده فهرست توابع پشتیبانی شده، به [توابع پشتیبانی شده KaTeX](https://katex.org/docs/supported.html) مراجعه کنید.
[KaTeX][katex] موتور پیش‌فرضی است که برای نمایش عبارات ریاضی LaTeX در فرآیند ساخت توسط [Hugo][hugo-transform-tomath] استفاده می‌شود.
## شیمی
پیش‌فرض KaTeX است، اما در صورت نیاز به ویژگی‌هایی که فقط در [MathJax][mathjax] موجود است، می‌توانید به MathJax سوئیچ کنید.
عبارت‌های شیمی از طریق افزونه [mhchem](https://mhchem.github.io/MathJax-mhchem/) پشتیبانی می‌شوند.
#### KaTeX
درون‌خطی: \(\ce{H2O}\) آب است.
پیکربندی پیش‌فرض نیاز به هیچ تنظیمی ندارد. Hugo فایل CSS مربوط به KaTeX را از CDN دریافت می‌کند.
اگر نیاز به استفاده از نسخه خاصی از KaTeX یا استفاده از فایل‌های محلی دارید، می‌توانید این کار را در فایل `hugo.yaml` انجام دهید.
پاراگراف جداگانه:
##### تغییر آدرس پایه CDN
```markdown {filename="page.md"}
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$
```yaml {filename="hugo.yaml"}
params:
math:
engine: katex
katex:
base: "https://cdn.jsdelivr.net/npm/katex@0.16.22/dist"
```
به صورت زیر رندر خواهد شد:
##### استفاده از فایل‌های محلی
$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$
همچنین می‌توانید فایل css را در پوشه `assets` قرار دهید و فایل‌های فونت مورد نیاز KaTeX را منتشر کنید.
```yaml {filename="hugo.yaml"}
params:
math:
engine: katex
katex:
css: "css/katex.min.css"
assets:
- "fonts/KaTeX_Main-Regular.woff2"
# سایر فایل‌های فونت را اینجا اضافه کنید
```
## موتور ریاضی
این تنظیمات باعث می‌شود فایل CSS مربوط به KaTeX از `assets/css/katex.min.css` بارگیری شود به جای دانلود از CDN.
### MathJax
#### MathJax
به طور پیش‌فرض، [KaTeX][katex] برای رندر کردن عبارت‌های ریاضی LaTeX در طول فرآیند ساخت استفاده می‌شود که روش ترجیحی است.
به عنوان جایگزین، می‌توانید از [MathJax][mathjax] برای رندر کردن عبارت‌های ریاضی استفاده کنید.
برای استفاده از آن، موارد زیر را به فایل پیکربندی `hugo.yaml` اضافه کنید:
به عنوان جایگزین، می‌توانید از [MathJax][mathjax] برای نمایش عبارات ریاضی استفاده کنید:
```yaml {filename="hugo.yaml"}
params:
@@ -105,5 +137,10 @@ params:
engine: mathjax
```
> [!NOTE]
> می‌توانید MathJax را بیشتر سفارشی کنید (مثلاً تنظیمات لودر را تغییر دهید یا CDN/منبع را عوض کنید) با بازنویسی قالب در `layouts/_partials/scripts/mathjax.html` در پروژه خود. Hugo به جای نسخه پیش‌فرض قالب، از نسخه شما استفاده خواهد کرد.
[katex]: https://katex.org/
[mathjax]: https://www.mathjax.org/
[mhchem]: https://mhchem.github.io/MathJax-mhchem/
[hugo-transform-tomath]: https://gohugo.io/functions/transform/tomath/

View File

@@ -1,141 +1,183 @@
---
title: مارک‌داون
title: Markdown
weight: 2
---
Hugo از سینتکس [مارک‌داون](https://en.wikipedia.org/wiki/Markdown) برای قالب‌بندی متن، ایجاد فهرست و موارد دیگر پشتیبانی می‌کند. این صفحه برخی از رایج‌ترین نمونه‌های سینتکس مارک‌داون را به شما نشان می‌دهد.
Hugo از [Markdown](https://en.wikipedia.org/wiki/Markdown) برای قالب‌بندی متن، ایجاد لیست‌ها و موارد دیگر پشتیبانی می‌کند. این صفحه برخی از رایج‌ترین نمونه‌های نحوه استفاده از Markdown را به شما نشان می‌دهد.
<!--more-->
## مثال‌های مارک‌داون
## نمونه‌های Markdown
### ظاهر طراحی دادن به متن
### استایل‌دهی متن
| سبک | سینتکس | مثال | خروجی |
| -------- | -------- | ------ | ------ |
| توپر | `**متن توپر**` | `**متن توپر**` | **متن توپر** |
| کج | `*متن کج*` | `*متن کج*` | *متن کج* |
| خط خورده | `~~متن خط خورده~~` | `~~متن خط خورده~~` | ~~متن خط خورده~~ |
| پایین‌نویس | `<sub></sub>` | `این یک متن <sub>پایین‌نویس</sub> است` | این یک متن <sub>پایین‌نویس</sub> است |
| بالانویس | `<sup></sup>` | `این یک متن <sup>بالانویس</sup> است` | این یک متن <sup>بالانویس</sup> است |
| استایل | نحو | مثال | خروجی |
| :------------ | :----------------------- | :-------------------------------------- | :------------------------------------ |
| پررنگ | `**متن پررنگ**` | `**متن پررنگ**` | **متن پررنگ** |
| مورب | `*متن مورب*` | `*متن مورب*` | _متن مورب_ |
| خطخورده | `~~متن خطخورده~~` | `~~متن خطخورده~~` | ~~متن خطخورده~~ |
| زیرنویس | `<sub></sub>` | `این یک <sub>زیرنویس</sub> است` | این یک <sub>زیرنویس</sub> است |
| بالانویس | `<sup></sup>` | `این یک <sup>بالانویس</sup> است` | این یک <sup>بالانویس</sup> است |
### بلوک نقل‌قول
### نقل‌قولها
بلوک نقل‌قول با ذکر منبع
نقل‌قول با ذکر منبع
> با اشتراک‌گذاری حافظه ارتباط برقرار نکنید، حافظه را با برقراری ارتباط به اشتراک بگذارید.<br>
> — <cite>راب پایک[^1]</cite>
> با اشتراک‌گذاری حافظه ارتباط برقرار نکنید، بلکه با ارتباط، حافظه را اشتراک بگذارید.<br>
> — <cite>Rob Pike[^1]</cite>
[^1]: نقل‌قول بالا گزیده‌ای از [سخنرانی](https://www.youtube.com/watch?v=PAAkCSZUG1c) راب پایک در Gopherfest، در تاریخ ۲۷ آبان ۱۳۹۴ است.
[^1]: این نقل‌قول از [سخنرانی](https://www.youtube.com/watch?v=PAAkCSZUG1c) Rob Pike در Gopherfest در ۱۸ نوامبر ۲۰۱۵ گرفته شده است.
```markdown {filename=Markdown}
> با اشتراک‌گذاری حافظه ارتباط برقرار نکنید، حافظه را با برقراری ارتباط به اشتراک بگذارید.<br>
> — <cite>راب پایک[^1]</cite>
> با اشتراک‌گذاری حافظه ارتباط برقرار نکنید، بلکه با ارتباط، حافظه را اشتراک بگذارید.<br>
> — <cite>Rob Pike[^1]</cite>
[^1]: نقل‌قول بالا گزیده‌ای از [سخنرانی](https://www.youtube.com/watch?v=PAAkCSZUG1c) راب پایک در Gopherfest، در تاریخ ۲۷ آبان ۱۳۹۴ است.
[^1]: این نقل‌قول از [سخنرانی](https://www.youtube.com/watch?v=PAAkCSZUG1c) Rob Pike در Gopherfest در ۱۸ نوامبر ۲۰۱۵ گرفته شده است.
```
### جدول‌ها
### هشدارها
جدول‌ها بخشی از مشخصات اصلی مارک‌داون نیستند، اما Hugo از آنها در خارج از جعبه پشتیبانی می‌کند.
{{< 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.146.0](https://github.com/gohugoio/hugo/releases/tag/v0.146.0) یا بالاتر استفاده می‌کنید.
> [!NOTE]
> اطلاعات مفیدی که کاربران باید بدانند، حتی هنگام مرور سریع محتوا.
> [!TIP]
> توصیه‌های مفید برای انجام بهتر یا آسان‌تر کارها.
> [!IMPORTANT]
> اطلاعات کلیدی که کاربران برای رسیدن به هدف خود نیاز دارند.
> [!WARNING]
> اطلاعات فوری که نیاز به توجه فوری کاربر دارد تا از مشکلات جلوگیری شود.
> [!CAUTION]
> هشدار درباره خطرات یا نتایج منفی برخی اقدامات.
```markdown {filename=Markdown}
| نام | سن |
|--------|------|
| گودرز | ۳۰|
| آصف | ۳۴ |
> [!NOTE]
> اطلاعات مفیدی که کاربران باید بدانند، حتی هنگام مرور سریع محتوا.
> [!TIP]
> توصیه‌های مفید برای انجام بهتر یا آسان‌تر کارها.
> [!IMPORTANT]
> اطلاعات کلیدی که کاربران برای رسیدن به هدف خود نیاز دارند.
> [!WARNING]
> اطلاعات فوری که نیاز به توجه فوری کاربر دارد تا از مشکلات جلوگیری شود.
> [!CAUTION]
> هشدار درباره خطرات یا نتایج منفی برخی اقدامات.
```
#### مارک‌داون درون‌خطی درون جدول‌ها
### جداول
| کج | توپر | کد |
| -------- | -------- | ------ |
| *کج* | **توپر** | `کد` |
جداول بخشی از مشخصه اصلی Markdown نیستند، اما Hugo به صورت پیش‌فرض از آن‌ها پشتیبانی می‌کند.
| نام | سن |
| :---- | :-- |
| باب | ۲۷ |
| آلیس | ۲۳ |
```markdown {filename=Markdown}
| کج | توپر | کد |
| -------- | -------- | ------ |
| *کج* | **توپر** | `کد` |
| نام | سن |
| :---- | :-- |
| باب | ۲۷ |
| آلیس | ۲۳ |
```
#### Markdown درون‌خطی در جداول
| مورب | پررنگ | کد |
| :-------- | :------- | :----- |
| _مورب_ | **پررنگ** | `کد` |
```markdown {filename=Markdown}
| مورب | پررنگ | کد |
| :-------- | :------- | :----- |
| _مورب_ | **پررنگ** | `کد` |
```
### بلوک‌های کد
{{< cards >}}
{{< card link="../../guide/syntax-highlighting" title="برجسته‌کردن سینتکس" icon="sparkles" >}}
{{< 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)
![منظره](https://picsum.photos/800/600)
```markdown {filename=Markdown}
![landscape](https://picsum.photos/800/600)
![منظره](https://picsum.photos/800/600)
```
با توضیحات:
با عنوان:
![landscape](https://picsum.photos/800/600 "یک چشم‌انداز Unsplash")
![منظره](https://picsum.photos/800/600 "Lorem Picsum")
```markdown {filename=Markdown}
![landscape](https://picsum.photos/800/600 "یک چشم‌انداز Unsplash")
![منظره](https://picsum.photos/800/600 "Lorem Picsum")
```
برای عملکرد پیشرفته‌تر، از [shortcode Figure](https://gohugo.io/shortcodes/figure/) داخلی Hugo استفاده کنید.
## پیکربندی
Hugo از [Goldmark](https://github.com/yuin/goldmark) برای تجزیه مارک‌داون استفاده می‌کند.
رندر مارک‌داون را می‌توان در `hugo.yaml` تحت `markup.goldmark` پیکربندی کنید.
در زیر پیکربندی پیش‌فرض هگزترا را می‌توانید ببینید:
Hugo از [Goldmark](https://github.com/yuin/goldmark) برای تجزیه Markdown استفاده می‌کند.
رندر Markdown را می‌توان در `hugo.yaml` تحت `markup.goldmark` پیکربندی کرد.
در زیر پیکربندی پیش‌فرض Hextra آمده است:
```yaml {filename="hugo.yaml"}
markup:
@@ -146,11 +188,11 @@ markup:
noClasses: false
```
برای گزینه‌های پیکربندی بیشتر، به مستندات Hugo در [پیکربندی نشانه‌گذاری](https://gohugo.io/getting-started/configuration-markup/) مراجعه کنید.
برای گزینه‌های پیکربندی بیشتر، مستندات Hugo در مورد [پیکربندی Markup](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/)
- [راهنمای 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/)

View File

@@ -1,12 +1,13 @@
---
title: سازماندهی پروندهها
title: سازماندهی فایلها
weight: 1
prev: /docs/guide
---
## ساختار دایرکتوری
به طور پیش‌فرض، Hugo پرونده‌های مارک‌داون را در فهرست `content` جستجو می‌کند و ساختار فهرست، ساختار خروجی نهایی وب‌سایت شما را تعیین می‌کند. همین سایت را به عنوان مثال در نظر بگیرید:
بهطور پیش‌فرض، Hugo فایل‌های Markdown را در دایرکتوری `content` جستجو می‌کند و ساختار این دایرکتوری تعیین‌کننده ساختار نهایی خروجی وبسایت شماست.
این سایت را به عنوان مثال در نظر بگیرید:
<!--more-->
@@ -28,7 +29,7 @@ prev: /docs/guide
{{< /filetree/folder >}}
{{< /filetree/container >}}
هر یک از پرونده‌های `_index.md` صفحه اصلی هر بخش هستند که برای هر بخش مجزا است. سایر پرونده‌های مارک‌داون صفحه‌های معمولی دیگه‌ای هستند.
هر یک از فایل‌های `_index.md` صفحه اصلی مربوط به بخش خود هستند. سایر فایل‌های Markdown صفحات معمولی هستند.
```
content
@@ -46,15 +47,15 @@ content
## طرح‌بندی‌ها
هگزترا سه طرح‌بندی برای انواع مختلف محتوا ارائه می‌کند:
Hextra سه طرح‌بندی برای انواع مختلف محتوا ارائه می‌دهد:
| طرح‌بندی | دایرکتوری | ویژگی‌ها |
| :-------- | :-------------------- | :--------------------------------------------------------------- |
| `docs` | `content/docs/` | ایده‌آل برای مستندات ساختار یافته، مانند این بخش. |
| `blog` | `content/blog/` | برای نوشته‌های وبلاگ، با هر فهرست‌بندی و هم نمایش جزئیات مقاله. |
| `default` | همه دایرکتوری‌های دیگر | مشاهده مقاله تک صفحه‌ای بدون نوار کناری. |
| طرح‌بندی | دایرکتوری | ویژگی‌ها |
| :-------- | :----------------- | :----------------------------------------------------------- |
| `docs` | `content/docs/` | مناسب برای مستندات ساختاریافته، مشابه این بخش. |
| `blog` | `content/blog/` | برای پست‌های وبلاگ، با نمایش لیست و مقاله‌های تفصیلی. |
| `default` | سایر دایرکتوری‌ها | نمایش تکصفحه‌ای مقاله بدون نوار کناری. |
برای سفارشی کردن یک بخش برای منعکس کردن رفتار یک طرح داخلی، نوع طرح‌بندی مورد نظر را در قسمت بالایی قسمت _index.md` مشخص کنید.
برای سفارشی‌سازی یک بخش به منظور تقلید رفتار یک طرح‌بندی داخلی، نوع مورد نظر را در front matter فایل `_index.md` بخش مشخص کنید.
```yaml {filename="content/my-docs/_index.md"}
---
@@ -64,11 +65,11 @@ cascade:
---
```
پیکربندی مثال بالا تضمین می‌کند که پرونده‌های محتوای در داخل `content/my-docs/` به‌طور پیش‌فرض به عنوان مستندات (نوع `docs`) مورد استفاده قرار می‌گیرند.
مثال پیکربندی بالا تضمین می‌کند که فایل‌های محتوا در `content/my-docs/` به‌طور پیش‌فرض به عنوان مستندات (نوع `docs`) در نظر گرفته می‌شوند.
## ناوبری نوار کناری
ناوبری نوار کناری به طور خودکار براساس حروف الفبا ایجاد می‌شود. برای پیکربندی دستی ترتیب نوار کناری، می‌توانید از پارامتر `weight` در قسمت بالایی پرونده‌های مارک‌داون استفاده کنید.
ناوبری نوار کناری بهطور خودکار بر اساس سازماندهی محتوا به ترتیب الفبایی ایجاد می‌شود. برای پیکربندی دستی ترتیب نوار کناری، می‌توانیم از پارامتر `weight` در front matter فایل‌های Markdown استفاده کنیم.
```yaml {filename="content/docs/guide/_index.md"}
---
@@ -78,18 +79,126 @@ weight: 2
```
{{< callout emoji="">}}
توصیه می‌کنیم نوار کناری خیلی عمیق نباشد. اگر محتوای زیادی دارید، آنها را **به چند بخش تقسیم کنید**.
توصیه می‌شود نوار کناری را خیلی عمیق نگه ندارید. اگر محتوای زیادی دارید، **آنها را به چند بخش تقسیم کنید**.
{{< /callout >}}
## ناوبری بخش
### ترتیب صفحه‌بندی بخش
ترتیب صفحات، که از طریق [`PAGE.PrevInSection`](https://gohugo.io/methods/page/previnsection/) و [`PAGE.NextInSection`](https://gohugo.io/methods/page/nextinsection/) در یک [مجموعه صفحه](https://gohugo.io/quick-reference/glossary/#page-collection) قابل دسترسی هستند، به‌طور پیش‌فرض معکوس شده است.
برای غیرفعال کردن این ترتیب معکوس، می‌توانید پارامتر سفارشی `reversePagination` را در front matter صفحه به `false` تنظیم کنید. به‌طور پیش‌فرض `reversePagination` روی `true` تنظیم شده است.
#### مثال
با توجه به ساختار دایرکتوری زیر:
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="blog" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="my-blog-series" state="open" >}}
{{< filetree/file name="_index.md" >}}
{{< filetree/folder name="post-a" state="open" >}}
{{< filetree/file name="index.md" >}}
{{< /filetree/folder >}}
{{< filetree/folder name="post-b" state="open" >}}
{{< filetree/file name="index.md" >}}
{{< /filetree/folder >}}
{{< filetree/folder name="post-c" state="open" >}}
{{< filetree/file name="index.md" >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/folder >}}
{{< /filetree/container >}}
و front matter زیر در پست‌ها:
```yaml {filename="content/blog/my-blog-series/post-a/index.md"}
---
title: پست A
weight: 1
---
```
```yaml {filename="content/blog/my-blog-series/post-b/index.md"}
---
title: پست B
weight: 2
---
```
```yaml {filename="content/blog/my-blog-series/post-c/index.md"}
---
title: پست C
weight: 3
---
```
اگر خواننده در انتهای `post-b/index.md` باشد، می‌بیند که صفحه بعدی `post-a` و صفحه قبلی `post-c` است. این به دلیل تنظیم `reversePagination` روی `true` به‌طور پیش‌فرض است. این زمانی مناسب است که بخواهیم پست‌ها به ترتیب زمانی از جدیدترین به قدیمی‌ترین نمایش داده شوند. اما در مورد یک سری وبلاگ که چندین بخش دارد، معمولاً می‌خواهیم افراد ابتدا پست اول را بخوانند، سپس به پست دوم و غیره بروند. بنابراین می‌خواهیم ترتیب معکوس را غیرفعال کنیم.
می‌توانیم `reversePagination` را در هر پست وبلاگ در این سری با اضافه کردن front matter زیر به `my-blog-series/_index.md` خاموش کنیم:
```yaml {filename="content/blog/my-blog-series/_index.md"}
---
title: سری وبلاگ من
cascade:
params:
reversePagination: false
---
```
در اینجا از [`cascade`](https://gohugo.io/content-management/front-matter/#cascade-1) استفاده می‌کنیم تا این تنظیم به تمام پست‌های `my-blog-series` منتقل شود و `reversePagination` برای تمام فرزندان روی `false` تنظیم شود. این اکنون تضمین می‌کند که وقتی خواننده در `post-b/index.md` است، صفحه بعدی `post-c` و صفحه قبلی `post-a` خواهد بود.
## ناوبری مسیر راهنما
مسیرهای راهنما به‌طور خودکار بر اساس ساختار دایرکتوری `/content` ایجاد می‌شوند.
به عنوان مثال، ساختار فایل [نمایش داده شده در بالا](#directory-structure) را در نظر بگیرید. با توجه به آن ساختار، مسیرهای راهنمای بالای صفحه در `/docs/guide/organize-files/` به‌صورت خودکار به این شکل نمایش داده می‌شوند:
```
مستندات > راهنما > سازماندهی فایل‌ها
```
### سفارشی‌سازی عنوان لینک‌های مسیر راهنما
به‌طور پیش‌فرض، هر لینک مسیر راهنما بر اساس پارامتر `title` آن صفحه ایجاد می‌شود. می‌توانید این را با مشخص کردن `linkTitle` سفارشی کنید.
به عنوان مثال، اگر به جای `Organize Files` می‌خواستیم مسیر راهنما `Foo Bar` باشد:
```yaml {filename="content/docs/guide/organize-files.md"}
---
linkTitle: Foo Bar
title: سازماندهی فایل‌ها
---
```
این اکنون مسیرهای راهنمای زیر را ایجاد می‌کند:
```
مستندات > راهنما > Foo Bar
```
### مخفی کردن مسیرهای راهنما
می‌توانید مسیرهای راهنما را به‌طور کامل از یک صفحه با مشخص کردن `breadcrumbs: false` در front matter آن مخفی کنید:
```yaml {filename="content/docs/guide/organize-files.md"}
---
breadcrumbs: false
title: سازماندهی فایل‌ها
---
```
## پیکربندی دایرکتوری محتوا
به طور پیش‌فرض، دایرکتوری ریشه `content/` توسط Hugo برای ساخت سایت استفاده می‌شود.
اگر نیاز به استفاده از دایرکتوری متفاوتی برای محتوا دارید، برای مثال `docs/`، این کار را می‌توانید با تنظیم پارامتر [`contentDir`](https://gohugo.io/getting-started/configuration/#contentdir) در پیکربندی سایت `hugo.yaml` انجام دهید.
بهطور پیش‌فرض، دایرکتوری ریشه `content/` توسط Hugo برای ساخت سایت استفاده می‌شود.
اگر نیاز به استفاده از دایرکتوری دیگری برای محتوا دارید، مثلاً `docs/`، این کار را می‌توان با تنظیم پارامتر [`contentDir`](https://gohugo.io/getting-started/configuration/#contentdir) در پیکربندی سایت `hugo.yaml` انجام داد.
## افزودن تصاویر
## اضافه کردن تصاویر
برای افزودن تصاویر، ساده‌ترین راه این است که پرونده‌های عکس‌ها را در همان دایرکتوری پرونده مارک‌داون قرار دهید.
برای مثال، یک پرونده عکس `image.png` را در کنار پرونده `my-page.md` اضافه کنید:
برای اضافه کردن تصاویر، ساده‌ترین راه این است که فایل‌های تصویر را در همان دایرکتوری فایل Markdown قرار دهید.
به عنوان مثال، یک فایل تصویر `image.png` را در کنار فایل `my-page.md` اضافه کنید:
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
@@ -100,13 +209,13 @@ weight: 2
{{< /filetree/folder >}}
{{< /filetree/container >}}
سپس، می‌توانید از سینتکس مارک‌داون زیر برای افزودن عکس به محتوا استفاده کنید:
سپس می‌توانیم از سینتکس Markdown زیر برای اضافه کردن تصویر به محتوا استفاده کنیم:
```markdown {filename="content/docs/my-page.md"}
![](image.png)
```
همچنین می‌توانید از ویژگی [بسته‌های صفحه][page-bundles] Hugo برای سازماندهی پرونده‌های عکس‌ها همراه با پرونده مارک‌داون استفاده کنید. برای رسیدن به این هدف، پرونده `my-page.md` را به یک دایرکتوری `my-page` تبدیل کنید و محتوا را در پرونده‌ای به نام `index.md` قرار دهید و پرونده‌های عکس‌ها را در دایرکتوری `my-page` قرار دهید:
همچنین می‌توانیم از ویژگی [page bundles][page-bundles] Hugo استفاده کنیم تا فایل‌های تصویر را همراه با فایل Markdown سازماندهی کنیم. برای این کار، فایل `my-page.md` را به یک دایرکتوری `my-page` تبدیل کنید و محتوا را در یک فایل به نام `index.md` قرار دهید و فایل‌های تصویر را داخل دایرکتوری `my-page` قرار دهید:
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
@@ -123,7 +232,7 @@ weight: 2
![](image.png)
```
همچنین می‌توانید پرونده‌های عکس‌ها را در دایرکتوری `static` قرار دهید که عکس‌ها را برای همه صفحات در دسترس قرار می‌دهد:
به‌عنوان جایگزین، می‌توانیم فایل‌های تصویر را در دایرکتوری `static` قرار دهیم، که تصاویر را برای تمام صفحات قابل دسترس می‌کند:
{{< filetree/container >}}
{{< filetree/folder name="static" >}}
@@ -138,10 +247,10 @@ weight: 2
{{< /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
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles

View File

@@ -1,21 +1,29 @@
---
title: کدهای کوتاه
title: شورت‌کدها
weight: 9
prev: /docs/guide/diagrams
next: /docs/guide/shortcodes/filetree
next: /docs/guide/shortcodes/callout
---
[کدهای کوتاه Hugo](https://gohugo.io/content-management/shortcodes/) قطعه‌های ساده‌ای در داخل پرونده‌های محتوای شما هستند که قالب‌های داخلی یا سفارشی را فراخوانی می‌کنند.
هگزترا مجموعه‌ای از کدهای کوتاه زیبا را برای بهبود محتوای شما ارائه می‌کند.
[شورت‌کدهای Hugo](https://gohugo.io/content-management/shortcodes/) قطعه‌کدهای ساده‌ای درون فایل‌های محتوای شما هستند که تمپلیت‌های داخلی یا سفارشی را فراخوانی می‌کنند.
Hextra مجموعه‌ای از شورت‌کدهای زیبا را برای بهبود محتوای شما ارائه می‌دهد.
{{< 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="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 >}}

View File

@@ -1,55 +1,60 @@
---
title: کامپوننت فراخوانی
linkTitle: فراخوانی
title: کامپوننت Callout
linkTitle: Callout
aliases:
- فراخوانی‌ها
- callouts
prev: /docs/guide/shortcodes
---
یک کامپوننت داخلی برای نشان دادن اطلاعات مهم به خواننده.
یک کامپوننت داخلی برای نمایش اطلاعات مهم به خواننده.
<!--more-->
> [!NOTE]
> [هشدارهای سبک GitHub](../../markdown#alerts) از [نسخه 0.9.0](https://github.com/imfing/hextra/releases/tag/v0.9.0) پشتیبانی می‌شوند.
> این ویژگی از سینتکس Markdown برای رندر کردن callout استفاده می‌کند که باعث بهبود قابلیت حمل و خوانایی محتوا می‌شود.
## مثال
{{< callout emoji="👾">}}
**فراخوانی** یک متن کوتاه است که برای جلب توجه در نظر گرفته شده است.
یک **callout** متن کوتاهی است که برای جلب توجه طراحی شده است.
{{< /callout >}}
{{< callout type="info" >}}
**فراخوانی** یک متن کوتاه است که برای جلب توجه در نظر گرفته شده است.
یک **callout** متن کوتاهی است که برای جلب توجه طراحی شده است.
{{< /callout >}}
{{< callout type="warning" >}}
**فراخوانی** یک متن کوتاه است که برای جلب توجه در نظر گرفته شده است.
یک **callout** متن کوتاهی است که برای جلب توجه طراحی شده است.
{{< /callout >}}
{{< callout type="error" >}}
**فراخوانی** یک متن کوتاه است که برای جلب توجه در نظر گرفته شده است.
یک **callout** متن کوتاهی است که برای جلب توجه طراحی شده است.
{{< /callout >}}
## استفاده
## نحوه استفاده
### پیش‌فرض
{{< callout emoji="🌐">}}
Hugo را می‌توانید برای ایجاد طیف گسترده‌ای از وب‌سایت‌ها، از جمله وبلاگ‌ها، نمونه‌کارها، سایت‌های مستندسازی و غیره استفاده کرد.
Hugo می‌تواند برای ایجاد انواع مختلف وب‌سایت‌ها از جمله وبلاگ‌ها، نمونه‌کارها، سایت‌های مستندات و غیره استفاده شود.
{{< /callout >}}
```markdown
{{</* callout emoji="🌐" */>}}
Hugo را می‌توانید برای ایجاد طیف گسترده‌ای از وب‌سایت‌ها، از جمله وبلاگ‌ها، نمونه‌کارها، سایت‌های مستندسازی و غیره استفاده کرد.
Hugo می‌تواند برای ایجاد انواع مختلف وب‌سایت‌ها از جمله وبلاگ‌ها، نمونه‌کارها، سایت‌های مستندات و غیره استفاده شود.
{{</* /callout */>}}
```
### اطلاعات
{{< callout type="info" >}}
لطفا برای مشاهده آخرین نسخه‌ها به گیت‌هاب مراجعه کنید.
لطفاً برای مشاهده آخرین نسخه‌ها به GitHub مراجعه کنید.
{{< /callout >}}
```markdown
{{</* callout type="info" */>}}
لطفا برای مشاهده آخرین نسخه‌ها به گیت‌هاب مراجعه کنید.
لطفاً برای مشاهده آخرین نسخه‌ها به GitHub مراجعه کنید.
{{</* /callout */>}}
```
@@ -68,11 +73,11 @@ aliases:
### خطا
{{< callout type="error" >}}
مشکلی پیش آمد و اتفاقی رخ خواهد شد.
مشکلی پیش آمده و قرار است منفجر شود.
{{< /callout >}}
```markdown
{{</* callout type="error" */>}}
مشکلی پیش آمد و اتفاقی رخ خواهد شد.
مشکلی پیش آمده و قرار است منفجر شود.
{{</* /callout */>}}
```
```

View File

@@ -6,59 +6,110 @@ linkTitle: کارت‌ها
## مثال
{{< cards >}}
{{< card link="../callout" title="فراخوانی" icon="warning" >}}
{{< card link="/fa" title="بدون آیکون" >}}
{{< 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="تصویر در دایرکتوری assets می‌باشد و پردازش توسط Hugo شده است." method="Resize" options="600x q80 webp" >}}
{{< 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="تصویر در دایرکتوری assets، پردازش شده توسط هوگو." method="Resize" options="600x q80 webp" >}}
{{< /cards >}}
## استفاده
## نحوه استفاده
```
{{</* cards */>}}
{{</* card link="../callout" title="فراخوانی" icon="warning" */>}}
{{</* card link="/fa" title="بدون آیکون" */>}}
{{</* 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="تصویر در دایرکتوری assets می‌باشد و پردازش توسط Hugo شده است." method="Resize" options="600x q80 webp" */>}}
{{</* 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، پردازش شده توسط هوگو." method="Resize" options="600x q80 webp" */>}}
{{</* /cards */>}}
```
## پارامترهای کارت
| پارامتر | توضیحات |
|----------- |---------------------------------------|
| `link` | نشانی اینترنتی (داخلی یا خارجی). |
| `title` | عنوان برای کارت. |
| `subtitle` | عنوان زیرنویس (از مارک‌داون پشتیبانی می‌کند).. |
| `icon` | نام آیکون. |
| پارامتر | توضیحات |
|----------- |-----------------------------------------------------------------|
| `link` | URL (داخلی یا خارجی). |
| `title` | عنوان کارت. |
| `subtitle` | زیرعنوان (پشتیبانی از Markdown). |
| `icon` | نام آیکون. |
| `tag` | متن تگ. |
| `tagColor` | رنگ تگ: `gray` (پیش‌فرض), `yellow`, `red` و `blue`. |
## کارت تصویری
## کارت تصویر
علاوه بر این، کارت از افزودن تصویر و پردازش آن از طریق این پارامترها پشتیبانی می‌کند:
علاوه بر این، کارت از افزودن تصویر و پردازش از طریق این پارامترها پشتیبانی می‌کند:
| پارامتر | توضیحات |
| پارامتر | توضیحات |
|----------- |---------------------------------------------|
| `image` | نشانی اینترنتی تصویر کارت را مشخص می‌کند. |
| `method` | روش پردازش تصویر Hugo را تنظیم می‌کند. |
| `options` | گزینه‌های پردازش تصویر Hugo را پیکربندی می‌کند. |
| `image` | آدرس تصویر کارت را مشخص می‌کند. |
| `method` | روش پردازش تصویر هوگو را تنظیم می‌کند. |
| `options` | تنظیمات پردازش تصویر هوگو را پیکربندی می‌کند. |
کارت از سه نوع تصویر پشتیبانی می‌کند:
1. تصویر از راه دور: نشانی اینترنتی کامل در پارامتر `image`.
2. تصویر استاتیک: از مسیر نسبی در دایرکتوری `static/` Hugo استفاده کنید.
3. تصویر پردازش شده: از مسیر نسبی در دایرکتوری `assets/` Hugo استفاده کنید.
1. تصویر راهدور: URL کامل در پارامتر `image`.
2. تصویر استاتیک: از مسیر نسبی در دایرکتوری `static/` هوگو استفاده کنید.
3. تصویر پردازش شده: از مسیر نسبی در دایرکتوری `assets/` هوگو استفاده کنید.
هگزترا در صورت نیاز به پردازش تصویر در حین ساخت، به طور خودکار تشخیص می‌دهد و پارامتر `options` یا تنظیمات پیش‌فرض را اعمال می‌کند (تغییر اندازه، 800x، کیفیت 80، فرمت WebP).
در حال حاضر این `method` را پشتیبانی می‌کند: `Resize`، `Fit`، `Fill` و `Crop`.
Hextra به صورت خودکار تشخیص می‌دهد که آیا پردازش تصویر در زمان ساخت نیاز است و پارامتر `options` یا تنظیمات پیش‌فرض (Resize، 800x، کیفیت 80، فرمت WebP) را اعمال می‌کند.
در حال حاضر از این `method`ها پشتیبانی می‌کند: `Resize`, `Fit`, `Fill` و `Crop`.
برای اطلاعات بیشتر در مورد دستورات، روش‌ها و گزینه‌های پردازش تصویر داخلی Hugo به [مستندات پردازش تصویر](https://gohugo.io/content-management/image-processing/) آنها مراجعه کنید.
برای اطلاعات بیشتر در مورد دستورات، روش‌ها و تنظیمات پردازش تصویر هوگو، به [مستندات پردازش تصویر](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 */>}}
```

View File

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

View File

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

View File

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

View File

@@ -0,0 +1,79 @@
---
title: "کامپوننت Jupyter Notebook"
linktitle: "Jupyter Notebook"
math: true
sidebar:
exclude: true
---
{{< callout >}}ویژگی آزمایشی برای گنجاندن Jupyter Notebookها از طریق یک شورتکد. توجه داشته باشید که همه انواع سلول‌ها پشتیبانی نمی‌شوند.{{< /callout >}}
[Jupyter Notebook](https://jupyter.org/) یک برنامه نوت‌بوک HTML مستقل از زبان برای [پروژه Jupyter](https://jupyter.org/) است. این برنامه به شما امکان می‌دهد اسنادی ایجاد و به اشتراک بگذارید که شامل کد زنده، معادلات، تصاویر و متن روایی هستند.
<!--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` قرار دهید:
```markdown {filename="content/docs/my-page.md"}
---
title: صفحه من
math: true
---
{{%/* jupyter "notebook.ipynb" */%}}
```
به‌عنوان جایگزین، می‌توانید از ویژگی [بسته‌های صفحه][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: صفحه من
math: true
---
{{%/* jupyter "notebook.ipynb" */%}}
```
### استفاده از یک نوت‌بوک راه‌دور
همچنین می‌توانید از یک نوت‌بوک راه‌دور با ارائه URL به فایل نوت‌بوک استفاده کنید. به‌عنوان مثال، برای گنجاندن نوت‌بوک [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

View File

@@ -0,0 +1,78 @@
---
title: سایر شورتکدها
linkTitle: سایر
sidebar:
exclude: true
next: /docs/guide/deploy-site
---
{{< 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 VIDEO_ID */>}}
```
نتیجه:
{{< youtube id=dQw4w9WgXcQ loading=lazy >}}
برای اطلاعات بیشتر، به [شورتکد یوتیوب Hugo](https://gohugo.io/content-management/shortcodes/#youtube) مراجعه کنید.
## پی‌دی‌اف
با شورتکد پی‌دی‌اف، می‌توانید یک فایل پی‌دی‌اف را در محتوای خود تعبیه کنید.
```
{{</* pdf "https://example.com/sample.pdf" */>}}
```
همچنین می‌توانید فایل پی‌دی‌اف را در دایرکتوری پروژه خود قرار دهید و از مسیر نسبی استفاده کنید.
```
{{</* pdf "path/to/file.pdf" */>}}
```
مثال:
{{< pdf "https://upload.wikimedia.org/wikipedia/commons/1/13/Example.pdf" >}}

View File

@@ -1,6 +1,5 @@
---
title: مراحل
next: /docs/guide/deploy-site
---
یک کامپوننت داخلی برای نمایش یک سری مراحل.
@@ -10,6 +9,7 @@ next: /docs/guide/deploy-site
{{% steps %}}
### مرحله ۱
این اولین مرحله است.
### مرحله ۲
@@ -23,9 +23,14 @@ next: /docs/guide/deploy-site
{{% /steps %}}
## استفاده
## نحوه استفاده
سرتیتر مارک‌داون h3 را در کد کوتاه `steps` قرار دهید.
{{< callout emoji="" >}}
لطفاً توجه داشته باشید که این شورتکد **فقط برای محتوای Markdown** طراحی شده است.
اگر محتوای HTML یا شورتکدهای دیگر را به عنوان محتوای مرحله قرار دهید، ممکن است به درستی نمایش داده نشود.
{{< /callout >}}
عنوان h3 مارک‌داون را درون شورتکد `steps` قرار دهید.
```
{{%/* steps */%}}
@@ -39,4 +44,4 @@ next: /docs/guide/deploy-site
این دومین مرحله است.
{{%/* /steps */%}}
```
```

View File

@@ -1,70 +1,71 @@
---
title: زبانهها
title: تبها
next: /docs/guide/deploy-site
---
## مثال
{{< tabs items="JSON,YAML,TOML" >}}
{{< tabs items="macOS,Linux,Windows" >}}
{{< tab >}}**JSON**: جیسون معادل اختصاری عبارت JavaScript Object Notation به معنی «نمادگذاری اشیا در جاوا اسکریپت» است. جیسون یک قالب استاندارد باز است که امکان تبادل داده‌ها در وب با استفاده از جفت‌های خصوصیت-کلید را ممکن ساخته است.{{< /tab >}}
{{< tab >}}**YAML**: یک زبان برای سریال‌سازی داده قابل-خواندن-برای-انسان است.{{< /tab >}}
{{< tab >}}**TOML**: یک قالب پرونده پیکربندی که به هدف سادگی در خوانایی به کمک داشتن معانی مشخص با هدف «کمینه» و مینیمال بودن ارائه شده است.{{< /tab >}}
{{< tab >}}**macOS**: یک سیستم عامل دسکتاپ توسط اپل.{{< /tab >}}
{{< tab >}}**Linux**: یک سیستم عامل متن‌باز.{{< /tab >}}
{{< tab >}}**Windows**: یک سیستم عامل دسکتاپ توسط مایکروسافت.{{< /tab >}}
{{< /tabs >}}
## استفاده
## نحوه استفاده
### پیش‌فرض
```
{{</* tabs items="JSON,YAML,TOML" */>}}
{{</* tab */>}}**JSON**: جیسون معادل اختصاری عبارت JavaScript Object Notation به معنی «نمادگذاری اشیا در جاوا اسکریپت» است. جیسون یک قالب استاندارد باز است که امکان تبادل داده‌ها در وب با استفاده از جفت‌های خصوصیت-کلید را ممکن ساخته است.{{</* /tab */>}}
{{</* tab */>}}**YAML**: یک زبان برای سریال‌سازی داده قابل-خواندن-برای-انسان است.{{</* /tab */>}}
{{</* tab */>}}**TOML**: یک قالب پرونده پیکربندی که به هدف سادگی در خوانایی به کمک داشتن معانی مشخص با هدف «کمینه» و مینیمال بودن ارائه شده است.{{</* /tab */>}}
{{</* tab */>}}**JSON**: JavaScript Object Notation (JSON) یک فرمت متنی استاندارد برای نمایش داده‌های ساختاریافته بر اساس نحو شیء جاوااسکریپت است.{{</* /tab */>}}
{{</* tab */>}}**YAML**: YAML یک زبان سریال‌سازی داده‌های قابل خواندن توسط انسان است.{{</* /tab */>}}
{{</* tab */>}}**TOML**: TOML هدفش این است که یک فرمت فایل پیکربندی حداقلی باشد که به دلیل معناشناسی واضح، خواندنش آسان باشد.{{</* /tab */>}}
{{</* /tabs */>}}
```
### مشخص کردن زبانه‌ پیش‌فرض
### مشخص کردن ایندکس انتخاب شده
از ویژگی `defaultIndex` برای مشخص کردن زبانه‌ پیش‌فرض استفاده کنید. این شاخص از 0 شروع می‌شود.
از ویژگی `defaultIndex` برای مشخص کردن تب انتخاب شده استفاده کنید. ایندکس از 0 شروع می‌شود.
```
{{</* tabs items="JSON,YAML,TOML" defaultIndex="1" */>}}
{{</* tab */>}}**JSON**: جیسون معادل اختصاری عبارت JavaScript Object Notation به معنی «نمادگذاری اشیا در جاوا اسکریپت» است. جیسون یک قالب استاندارد باز است که امکان تبادل داده‌ها در وب با استفاده از جفت‌های خصوصیت-کلید را ممکن ساخته است.{{</* /tab */>}}
{{</* tab */>}}**YAML**: یک زبان برای سریال‌سازی داده قابل-خواندن-برای-انسان است.{{</* /tab */>}}
{{</* tab */>}}**TOML**: یک قالب پرونده پیکربندی که به هدف سادگی در خوانایی به کمک داشتن معانی مشخص با هدف «کمینه» و مینیمال بودن ارائه شده است.{{</* /tab */>}}
{{</* tab */>}}**JSON**: JavaScript Object Notation (JSON) یک فرمت متنی استاندارد برای نمایش داده‌های ساختاریافته بر اساس نحو شیء جاوااسکریپت است.{{</* /tab */>}}
{{</* tab */>}}**YAML**: YAML یک زبان سریال‌سازی داده‌های قابل خواندن توسط انسان است.{{</* /tab */>}}
{{</* tab */>}}**TOML**: TOML هدفش این است که یک فرمت فایل پیکربندی حداقلی باشد که به دلیل معناشناسی واضح، خواندنش آسان باشد.{{</* /tab */>}}
{{</* /tabs */>}}
```
زبانه‌ `YAML` به طور پیش‌فرض انتخاب می‌شود.
تب `YAML` به طور پیش‌فرض انتخاب خواهد شد.
{{< tabs items="JSON,YAML,TOML" defaultIndex="1" >}}
{{< tab >}}**JSON**: جیسون معادل اختصاری عبارت JavaScript Object Notation به معنی «نمادگذاری اشیا در جاوا اسکریپت» است. جیسون یک قالب استاندارد باز است که امکان تبادل داده‌ها در وب با استفاده از جفت‌های خصوصیت-کلید را ممکن ساخته است.{{< /tab >}}
{{< tab >}}**YAML**: یک زبان برای سریال‌سازی داده قابل-خواندن-برای-انسان است.{{< /tab >}}
{{< tab >}}**TOML**: یک قالب پرونده پیکربندی که به هدف سادگی در خوانایی به کمک داشتن معانی مشخص با هدف «کمینه» و مینیمال بودن ارائه شده است.{{< /tab >}}
{{< tab >}}**JSON**: JavaScript Object Notation (JSON) یک فرمت متنی استاندارد برای نمایش داده‌های ساختاریافته بر اساس نحو شیء جاوااسکریپت است.{{< /tab >}}
{{< tab >}}**YAML**: YAML یک زبان سریال‌سازی داده‌های قابل خواندن توسط انسان است.{{< /tab >}}
{{< tab >}}**TOML**: TOML هدفش این است که یک فرمت فایل پیکربندی حداقلی باشد که به دلیل معناشناسی واضح، خواندنش آسان باشد.{{< /tab >}}
{{< /tabs >}}
### استفاده از مارک‌داون
### استفاده از Markdown
سینتکس مارک‌داون از جمله بلوک کد نیز پشتیبانی می‌شود:
نحو Markdown شامل بلوک کد نیز پشتیبانی می‌شود:
````
{{</* tabs items="JSON,YAML,TOML" */>}}
{{</* tab */>}}
```json
{ "سلام": "دنیا" }
{ "hello": "world" }
```
{{</* /tab */>}}
... زبانه‌های دیگر را به همین ترتیب اضافه کنید
... سایر تب‌ها را به همین ترتیب اضافه کنید
{{</* /tabs */>}}
````
@@ -73,20 +74,52 @@ title: زبانه‌ها
{{< tab >}}
```json
{ "سلام": "دنیا" }
{ "hello": "world" }
```
{{< /tab >}}
{{< tab >}}
```yaml
سلام: دنیا
hello: world
```
{{< /tab >}}
{{< tab >}}
```toml
سلام = "دنیا"
hello = "world"
```
{{< /tab >}}
{{< /tabs >}}
### همگام‌سازی تب‌ها
تب‌هایی که لیست `items` یکسانی دارند می‌توانند همگام‌سازی شوند. وقتی فعال باشد، انتخاب یک تب تمام تب‌های دیگر با `items` یکسان را به‌روز می‌کند و انتخاب را در بین صفحات به خاطر می‌سپارد.
به صورت جهانی در فایل `hugo.yaml` در بخش `page` فعال کنید:
```yaml {filename="hugo.yaml"}
params:
page:
tabs:
sync: true
```
با فعال کردن این گزینه، دو بلوک تب زیر همیشه آیتم انتخاب شده یکسانی را نمایش خواهند داد:
```markdown
{{</* tabs items="A,B" */>}}
{{</* tab */>}}محتوای A{{</* /tab */>}}
{{</* tab */>}}محتوای B{{</* /tab */>}}
{{</* /tabs */>}}
{{</* tabs items="A,B" */>}}
{{</* tab */>}}محتوای دوم A{{</* /tab */>}}
{{</* tab */>}}محتوای دوم B{{</* /tab */>}}
{{</* /tabs */>}}
```

View File

@@ -1,69 +1,87 @@
---
title: "برجسته‌کردن سینتکس"
title: "رنگ‌آمیزی نحوی"
weight: 3
---
هیوگو از [Chroma](https://github.com/alecthomas/chroma)، یک برجسته‌کننده سینتکس عمومی در Go خالص، برای برجسته‌سازی کردن سینتکس استفاده می‌کند.
توصیه می‌شود از بک‌تیک برای بلوک‌های کد در محتوای مارک‌داون استفاده کنید. مثلا:
Hugo از [Chroma](https://github.com/alecthomas/chroma)، یک رنگ‌آمیزی نحوی همه‌منظوره در Go خالص، برای رنگ‌آمیزی نحوی استفاده می‌کند.
توصیه می‌شود برای بلوک‌های کد در محتوای Markdown از بک‌تیک استفاده کنید. به عنوان مثال:
<!--more-->
````markdown {filename="Markdown"}
```python
def say_hello():
print("سلام!")
print("Hello!")
```
````
به صورت زیر رندر خواهد شد:
به صورت زیر نمایش داده می‌شود:
```python
def say_hello():
print("سلام!")
print("Hello!")
```
## ویژگی‌ها
### Filename
### نام فایل
برای افزودن نام پرونده یا عنوان به بلوک کد، `filename` را مشخص کنید:
برای افزودن نام فایل یا عنوان به بلوک کد، ویژگی `filename` را تنظیم کنید:
````markdown {filename="Markdown"}
```python {filename="hello.py"}
def say_hello():
print("سلام!")
print("Hello!")
```
````
```python {filename="hello.py"}
def say_hello():
print("سلام!")
print("Hello!")
```
### پیوند به فایل
{{< new-feature version="v0.9.2" >}}
می‌توانید از ویژگی `base_url` برای ارائه یک URL پایه استفاده کنید که با نام فایل ترکیب می‌شود تا یک پیوند ایجاد کند.
نام فایل می‌تواند شامل یک مسیر نسبی باشد اگر محل فایل را در مسیر پایه مشخص کند.
````markdown {filename="Markdown"}
```go {base_url="https://github.com/imfing/hextra/blob/main/",filename="exampleSite/hugo.work"}
go 1.20
```
````
```go {base_url="https://github.com/imfing/hextra/blob/main/",filename="exampleSite/hugo.work"}
go 1.20
```
### شماره خطوط
برای تنظیم شماره خطوط، ویژگی `linenos` را روی `table` قرار دهید و به صورت اختیاری `linenostart` را روی شماره‌ای که خط شروع می‌شود تنظیم کنید:
برای تنظیم شماره خطوط، ویژگی `linenos` را به `table` تنظیم کنید و اختیاریاً `linenostart` را به شماره خط شروع تنظیم کنید:
````markdown {filename="Markdown"}
```python {linenos=table,linenostart=42}
def say_hello():
print("سلام!")
print("Hello!")
```
````
```python {linenos=table,linenostart=42}
def say_hello():
print("سلام!")
print("Hello!")
```
### برجسته کردن خطوط
### برجسته‌سازی خطوط
برای برجسته کردن خطوط، ویژگی `hl_lines` را به فهرستی از شماره خطوط تنظیم کنید:
برای برجسته‌سازی خطوط، ویژگی `hl_lines` را به لیستی از شماره خطوط تنظیم کنید:
````markdown {filename="Markdown"}
```python {linenos=table,hl_lines=[2,4],linenostart=1,filename="hello.py"}
def say_hello():
print("سلام!")
print("Hello!")
def main():
say_hello()
@@ -72,18 +90,25 @@ def main():
```python {linenos=table,hl_lines=[2,4],linenostart=1,filename="hello.py"}
def say_hello():
print("سلام!")
print("Hello!")
def main():
say_hello()
```
### دکمه کپی
به طور پیش‌فرض، دکمه کپی برای بلوک‌های کد فعال است.
به طور پیش‌فرض، دکمه کپی برای بلوک‌های کد فعال است. رفتار آن را می‌توان با تغییر فایل پیکربندی سایت تغییر داد:
```yaml {linenos=table,linenostart=42,filename="hugo.yaml"}
params:
highlight:
copy:
enable: true
# hover | always
display: hover
```
## زبان‌های پشتیبانی شده
برای مشاهده فهرست زبان‌های پشتیبانی شده، لطفا به [مستندات Chroma](https://github.com/alecthomas/chroma#supported-languages) مراجعه کنید.
برای مشاهده لیست زبان‌های پشتیبانی شده، لطفاً به [مستندات Chroma](https://github.com/alecthomas/chroma#supported-languages) مراجعه کنید.

View File

@@ -0,0 +1,132 @@
---
title: ショーケース
description: "Hextra で構築されたオープンソースプロジェクト"
toc: false
layout: wide
---
<div class="hx:mt-4"></div>
<p class="hx:mb-12 hx:text-center hx:text-lg hx:text-gray-500 hx:dark:text-gray-400">
Hextra で構築されたオープンソースプロジェクト
</p>
{{< cards >}}
{{< card
link="https://beginnerprivacy.com"
title="Beginner Privacy"
image="https://github.com/user-attachments/assets/a72582a8-7c54-40cd-b8e3-8fd77164687c"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/claceio/clace"
title="Clace"
image="https://github.com/user-attachments/assets/af4dbd21-a492-48dd-96fd-8542c548bd03"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/regolith-linux/regolith-desktop.com"
title="Regolith Desktop"
image="https://github.com/user-attachments/assets/4bbedd7d-67ef-4363-91f1-acb4a0c5f8d0"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/modelcontextprotocol/specification"
title="Model Context Protocol Specification"
image="https://github.com/user-attachments/assets/1bb4f952-b8fc-43b5-9cbd-cd7213c2ba90"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/jonaspleyer/cellular_raza"
title="cellular_raza"
image="https://github.com/user-attachments/assets/f24c6455-b70a-419b-b025-e3d60101b673"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/mightymoud/sidekick"
title="Sidekick"
image="https://github.com/user-attachments/assets/4ae2a9d7-77b6-42eb-a9d7-5c4599f0f812"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/welding-torch/installc"
title="Install C"
image="https://github.com/user-attachments/assets/c9a85327-c7e7-40f1-830a-b4190a5e47bd"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/axivo/website"
title="AXIVO Docs"
image="https://github.com/imfing/hextra/assets/19806136/f22f0710-23a0-430b-8bad-616283b8a3e5"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/infracourse/web"
title="Stanford CS 40"
image="https://github.com/imfing/hextra/assets/5097752/8c29470b-3994-41c8-be9a-5b41476e6f3c"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/helixml/docs"
title="Helix Docs"
image="https://github.com/imfing/hextra/assets/5097752/78045af0-4922-4358-ae73-624770909db6"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://developers.clever-cloud.com/"
title="Clever Cloud Documentation"
image="https://cellar-c2.services.clever-cloud.com/documentation/doc-screenshot.png" imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://owaspai.org/"
title="OWASP AI Security and Privacy Guide"
image="https://github.com/imfing/hextra/assets/5097752/fbb1d3a5-a0e8-4cfc-88cf-3523b0176c89"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://developers.osuny.org"
title="Osuny"
image="https://raw.githubusercontent.com/noesya/osuny-developers/main/static/images/showcase-hextra/screenshot.png"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card link="https://porter.sh/"
title="Porter"
image="https://github.com/imfing/hextra/assets/5097752/401abc3a-b4c3-4336-b95a-a6dd9afbc1de"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://hoa.moe/"
title="HITSZ OpenAuto"
image="https://raw.githubusercontent.com/HITSZ-OpenAuto/hoa.moe/main/static/images/showcase-new.png"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/remysheppard/lutheran-confessions"
title="LutheranConfessions"
image="https://github.com/imfing/hextra/assets/5097752/ad6625e4-88cd-4cad-b102-5399997d0359"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< card
link="https://github.com/imfing/hextra-starter-template/"
title="Hextra Starter Template"
image="https://user-images.githubusercontent.com/5097752/263551418-c403b9a9-a76c-47a6-8466-513d772ef0b7.jpg"
imageStyle="object-fit:cover; aspect-ratio:16/9;"
>}}
{{< /cards >}}