مستندات
راهنما
شورت‌کدها
تب‌ها

تب‌ها

مثال

macOS: یک سیستم عامل دسکتاپ توسط اپل.
Linux: یک سیستم عامل متن‌باز.
Windows: یک سیستم عامل دسکتاپ توسط مایکروسافت.

نحوه استفاده

پیش‌فرض 

{{< tabs items="JSON,YAML,TOML" >}}

  {{< tab >}}**JSON**: JavaScript Object Notation (JSON) یک فرمت متنی استاندارد برای نمایش داده‌های ساختاریافته بر اساس نحو شیء جاوااسکریپت است.{{< /tab >}}
  {{< tab >}}**YAML**: YAML یک زبان سریال‌سازی داده‌های قابل خواندن توسط انسان است.{{< /tab >}}
  {{< tab >}}**TOML**: TOML هدفش این است که یک فرمت فایل پیکربندی حداقلی باشد که به دلیل معناشناسی واضح، خواندنش آسان باشد.{{< /tab >}}

{{< /tabs >}}

مشخص کردن ایندکس انتخاب شده

از ویژگی defaultIndex برای مشخص کردن تب انتخاب شده استفاده کنید. ایندکس از 0 شروع می‌شود.

{{< tabs items="JSON,YAML,TOML" defaultIndex="1" >}}

  {{< tab >}}**JSON**: JavaScript Object Notation (JSON) یک فرمت متنی استاندارد برای نمایش داده‌های ساختاریافته بر اساس نحو شیء جاوااسکریپت است.{{< /tab >}}
  {{< tab >}}**YAML**: YAML یک زبان سریال‌سازی داده‌های قابل خواندن توسط انسان است.{{< /tab >}}
  {{< tab >}}**TOML**: TOML هدفش این است که یک فرمت فایل پیکربندی حداقلی باشد که به دلیل معناشناسی واضح، خواندنش آسان باشد.{{< /tab >}}

{{< /tabs >}}

تب YAML به طور پیش‌فرض انتخاب خواهد شد.

JSON: JavaScript Object Notation (JSON) یک فرمت متنی استاندارد برای نمایش داده‌های ساختاریافته بر اساس نحو شیء جاوااسکریپت است.
YAML: YAML یک زبان سریال‌سازی داده‌های قابل خواندن توسط انسان است.
TOML: TOML هدفش این است که یک فرمت فایل پیکربندی حداقلی باشد که به دلیل معناشناسی واضح، خواندنش آسان باشد.

استفاده از Markdown

نحو Markdown شامل بلوک کد نیز پشتیبانی می‌شود:

{{< tabs items="JSON,YAML,TOML" >}}

  {{< tab >}}
  ```json
  { "hello": "world" }
  ```
  {{< /tab >}}

  ... سایر تب‌ها را به همین ترتیب اضافه کنید

{{< /tabs >}}
{ "hello": "world" }
hello: world
hello = "world"

همگام‌سازی تب‌ها

تب‌هایی که لیست items یکسانی دارند می‌توانند همگام‌سازی شوند. وقتی فعال باشد، انتخاب یک تب تمام تب‌های دیگر با items یکسان را به‌روز می‌کند و انتخاب را در بین صفحات به خاطر می‌سپارد.

به صورت جهانی در فایل hugo.yaml در بخش page فعال کنید:

hugo.yaml
params:
  page:
    tabs:
      sync: true

با فعال کردن این گزینه، دو بلوک تب زیر همیشه آیتم انتخاب شده یکسانی را نمایش خواهند داد:

{{< tabs items="A,B" >}}

  {{< tab >}}محتوای A{{< /tab >}}
  {{< tab >}}محتوای B{{< /tab >}}

{{< /tabs >}}

{{< tabs items="A,B" >}}

  {{< tab >}}محتوای دوم A{{< /tab >}}
  {{< tab >}}محتوای دوم B{{< /tab >}}

{{< /tabs >}}
آخرین به‌روزرسانی در
آیکوناستقرار سایت