هگزترا v0.11 منتشر شد! 🎉 تازه‌ها را ببینید

تب‌ها

مثال

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

نحوه استفاده

پیش‌فرض

{{< tabs >}}

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

{{< /tabs >}}

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

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

{{< tabs >}}

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

{{< /tabs >}}

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

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

استفاده از Markdown

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

{{< tabs >}}

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

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

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

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

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

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

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

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

{{< tabs >}}

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

{{< /tabs >}}

{{< tabs >}}

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

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