پیکربندی

هدف از پیکربندی ها این است که پوسته ها را تا حدی قابل تنظیم بدون نیاز به تغییر کد پوسته است. تنظیمات ممکن است برای این امکان استفاده شود که وبلاگ نویس بتواند ویژگی ها را روشن یا خاموش کند، رنگ ها و فونت ها را تغییر دهد یا حتی کلیدهای API را برای سرویس های خارجی تعریف کند.

تمام تنظیمات با مقادیر پیش فرض به config.yaml اضافه می شوند. دو نوع پیکربندی وجود دارد.

• تنظیمات HB-aware - HB از این پیکربندی ها آگاه است و بر اساس مقادیر آنها تصمیم می گیرد. شما نیز می توانید از مقادیر آنها در قالب ها استفاده کنید.
• تنظیمات پوسته - HB از این تنظیمات بی اطلاع است. می توانید از آنها در قالب های محتوای پویا یا سبک ها استفاده کنید.

همه تنظیمات در قالب های موجود در دسترس هستند _config متغیر مسیر.

تنظیمات شناخته‌شدهٔ سامانه

تنظیمات HB-aware باید در ENGLISH_UPPER_SNAKE_CASE در config.yaml نوشته شوند.

• THEME_NAME - نام پوسته
  • مورد نیاز: فقط اگر انتشار
• THEME_VERSION - نسخه معنایی پوسته
  • الزامی: فقط در صورت انتشار
• THEME_FONTS - فونت برای بارگذاری در وبلاگ. ببینید فونت ها.
  • الزامی: فقط در صورت انتشار
• DEMO_URL - می توان از آن برای تنظیم نسخه نمایشی سفارشی URL هنگام انتشار استفاده کرد
  • مورد نیاز: خیر
  • مقدار پیش‌فرض: تولید خودکار
• POSTS_PER_PAGINATION - تعداد پست های بارگذاری شده در ابتدا در _posts متغیر مسیر
  • مورد نیاز: خیر
  • مقدار پیش فرض: 10

تنظیمات پوسته

تنظیمات پوسته (رنگ‌ها، فونت‌ها و غیره) باید به زبان english_lower_snake_case نوشته شوند.

نمونهٔ config.yaml

در حالی که می‌توانید از تنظیمات چند تو در تو YAML استفاده کنید، توصیه می‌کنیم فقط تا یک یا دو سطح تودرتو استفاده کنید.

THEME_NAME: hello
THEME_VERSION: 1.0.0
THEME_FONTS: 'mulish:400,700'
POSTS_PER_PAGINATION: 15

dark_theme: Yes
accent_color: 0000000
image_service:
  api_key:
  api_version: 2

در این مثال، 3 خط اول تنظیمات HB-aware هستند. بقیه تنظیمات پوسته هستند. می توانید هر تعداد که نیاز دارید پیکربندی پوسته اضافه کنید.

تعریف تنظیمات

config.def.yaml پیکربندی های پوسته شما را “توضیح” می کند. این به وبلاگ نویس کمک می کند تا بفهمد هر پیکربندی چه کاری انجام می دهد. همچنین به ارائه فایل config.yaml در کنسول → Theme به جای فایل به عنوان یک رابط کاربری کمک می کند.

این یک نمونه فایل config.def.yaml است که پیکربندی های مثال قبلی را توضیح می دهد.

dark_theme:
  $name: Dark theme
  $description: Turn on dark theme for this blog
  $type: checkbox

accent_color:
  $name: Accent Color
  $description: Main color of the blog
  $type: color

image_service:
  $name: Image Service API Details

  api_key:
    $name: API Key
    $description: ...
    $type: text
    $maxlength: 255

  api_version:
    $name: API Version
    $description: ...
    $type: number
    $min: 1
    $max: 2

تعاریف پیکربندی

اینها تعاریف پشتیبانی شده برای پیکربندی پوسته هستند:

• $type - نوع پیکربندی. پشتیبانی شده $type sرا ببینید.
• $name - نام پیکربندی.
• $description - شرح پیکربندی.
• $minlength - حداقل تعداد کاراکترها در یک ورودی.
• $maxlength - حداکثر تعداد کاراکترها در یک ورودی.
• $min - حداقل مقدار برای یک عدد.
• $max - حداکثر مقدار برای یک عدد.

پشتیبانی از $type s

اینها انواع پشتیبانی شده برای پیکربندی پوسته هستند:

مثال رادیو

می‌توانید گزینه‌های رادیویی را در $options ، که یک لیست جفت key: label است، تنظیم کنید. key مقدار واقعی است که در فایل config.yaml ذخیره می شود. label چیزی است که کاربر خواهد دید.

some_key:
  $title: When to use caching
  $type: radio
  $options:
    all: For All Posts and Pages
    posts: Only Posts
    pages: Only Pages

استفاده از تنظیمات در قالب‌ها

پس از تعریف تنظیمات، می توانید از آنها در قالب های خود استفاده کنید. شما می توانید از طریق متغیر مسیر _config به تنظیمات دسترسی داشته باشید.

مثال: متغیرهای CSS قابل تنظیم.

config.yaml:

colors:
  accent: '#896c6b'

font:
  size: 16
  family: 'Nunito, sans-serif'

line_height: 24

box:
  radius: 20
  shadow: '0 0 30px rgba(0,0,0,0.05)'

سپس، از تنظیمات در قالب های خود استفاده کنید.

<style>
	:root {
	    --color-accent: {{ _config.colors.accent }};
	    --font-size: {{ _config.font.size }}px;
	    --font-family: {{ _config.font.family }};
	    --line-height: {{ _config.line_height }}px;
	    --box-radius: {{ _config.box.radius }}px;
	    --box-shadow: {{ _config.box.shadow }};
	}
</style>