انتشار پوسته‌ها

آیا آماده هستید که پوسته جدید ساخته شده خود را در ما منتشر کنید لیست پوسته ها? برای انجام این کار، پوسته شما باید در یک فورک از ما توسعه یابد hyvor-blogs-themes مخزن پس از تکمیل همه چیز، یک درخواست کشش برای ما ارسال کنید main شاخه در صورت ادغام، طرح زمینه شما به طور خودکار به لیست پوسته ما اضافه می شود و سایر وبلاگ نویسان می توانند آن را به راحتی نصب کنند.

همه پوسته های موجود در لیست پوسته های ما رایگان هستند. اگر می‌خواهید یک پوسته پولی ایجاد کنید، باید آن را خارج از پلتفرم ما بفروشید و کاربران می‌توانند ZIP را از کنسول بارگذاری کنند تا آن را نصب کنند.

فهرست بررسی

برای انتشار یک پوسته در فهرست پوسته های رسمی ما، باید تمام شرایط زیر رعایت شود.

این فایل ها باید اضافه شوند:

پشتیبانی از چند زبان (دارای جابجایی زبان)

از هر دو حالت رنگ روشن و تیره پشتیبانی می کند

به تنظیمات حالت رنگ وبلاگ احترام می گذارد

صفحه بندی

جستجوی وبلاگ باید حداقل با جستجوی پست اجرا شود. به صورت اختیاری، می توانید جستجوی برچسب ها و نویسندگان را اضافه کنید.

همه پست ها باید دارای پیوندهایی به نسخه های ترجمه شده آنها (در صورت موجود بودن) باشند. به عنوان مثال: "این پست در... نیز موجود است" یا "ترجمه ها: ..."

همه نگهدارنده های مکان اضافه می شوند

_head _foot _comments _newsletter

_comments فقط باید به پست ها اضافه شود، نه صفحات.

_comments و _newsletter بلوک ها نباید نمایش داده شوند اگر مقدار هر کدام خالی است

اگر وبلاگ دارای لوگو (_blog.logo_url) باشد، آرم باید در سرصفحه نشان داده شود که لوگو را به صفحه اصلی وبلاگ پیوند می دهد.

بین المللی

<html lang="{{ _lang.code }}" dir="{{ _lang.direction }}"></html> اضافه شد

از زبان های RTL پشتیبانی می کند. پشتیبانی RTL را در زیر ببینید.

تنظیمات برای رنگ ها، فونت ها، و غیره اضافه شده است پیکربندی بخش

تعاریف پیکربندی (config.def.yaml) اضافه شده است. ببینید پیکربندی -> تعاریف پیکربندی صفحه استفاده کنید ابزار پیکربندی اعتبار سنجی config.def.yaml.

فایل های YAML باید از 2 فاصله در هر تورفتگی استفاده کنند (نه برگه ها، نه 4 فاصله).

تلفن همراه پاسخگو

پست‌های ویژه ممکن است دارای یک رابط کاربری منحصر به فرد در صفحه فهرست باشند (مثلاً یک نماد پین شده/ستاره)

سبک های محتوا اضافه شده است. بخش سبک های محتوا را در زیر ببینید.

تمام دارایی ها (JS، فونت ها و غیره) باید در پوشه assets اضافه شوند. دارایی ها را از منابع خارجی مانند فونت های گوگل بارگیری نکنید.

باید از پیوندهای رسانه های اجتماعی وبلاگ پشتیبانی کند (یک نماد یا پیوند به نمایه رسانه اجتماعی را در صورت موجود بودن پیوند نشان می دهد)

ویترو بلاگ نام تجاری ("ساخته شده با ویترو بلاگ") در فوتر if نشان داده شده است _branding درست است.

پیکربندی

همانطور که در توضیح داده شده است تنظیمات در صفحه، تنظیمات زیر هنگام انتشار طرح زمینه مورد نیاز است.

THEME_NAME: my-theme
THEME_VERSION: 1.0.0

تنظیمات زیر برای همه مضامین منتشر شده توصیه می شود.

colors:
  light:
    # ... colors for the light theme
  dark:
    # ... colors for the dark theme

# if only one font
font:
  size: 16px
  line_height: 1
  family: 'Inter, sans-serif'

# if multiple fonts
fonts:
  body:
    size: 16px
    family: 'Inter, sans-serif'
  heading:
    size: 24px
    family: 'Nunito, sans-serif'

settings:
  loop: # features in the index page (list of posts)
    authors: true
    tags: true
    featured_image: true
  post: # features in the post page
    authors: true
    tags: true
    featured_image: true
    toc: true # table of contents
  feed: true # a link to RSS feed (if available)

پشتیبانی از راست‌چین

همه پوسته های منتشر شده باید از زبان های RTL (راست به چپ) پشتیبانی کنند. این نکات را دنبال کنید تا مطمئن شوید که پوسته شما از RTL پشتیبانی می کند.

dir="{{ _lang.direction }}" را به تگ <html> اضافه کنید
هنگام افزودن لایه‌های افقی، حاشیه و حاشیه‌های چپ/راست، از ویژگی‌های CSS آگاه از جهت استفاده کنید.

استفاده نکنید

از این استفاده کنید

padding-left

padding-inline-start

padding-right

padding-inline-end

margin-left

margin-inline-start

margin-right

margin-inline-end

border-left

border-inline-start

border-right

border-inline-end

مطمئن شوید که عناصر با موقعیت مطلق/ثابت در حالت RTL به درستی قرار گرفته اند
بلوک های <pre><code> باید دارای direction: ltr CSS باشند
حتماً یک زبان RTL را به وبلاگ DEV خود اضافه کنید و پشتیبانی RTL را آزمایش کنید

استایل‌های محتوا

همه مضامین منتشر شده باید به زیبایی تمام بلوک‌های موجود در پست «راهنمای سبک محتوا» در وبلاگ DEV شما را سبک‌سازی کنند. علاوه بر سبک دادن به آنها، این دستورالعمل ها را دنبال کنید تا از مشکلات رایج اما ظریف UX جلوگیری کنید.

1. لنگرهای سرفصل

ما به طور خودکار لنگرها را به عنوان هایی که دارای ویژگی id هستند اضافه می کنیم.

HTML بدون شناسه:

<h1>My Heading</h1>

HTML با شناسه:

<h1 id="heading-anchor">
	<a href="#heading-anchor" class="heading-anchor"> My Heading </a>
</h1>

این لنگر عنوان باید با سبک متفاوت از پیوندهای دیگر باشد. برای مثال، می‌توانید یک تصویر # یا یک تصویر SVG (از طریق background-image) قبل از متن لنگر اضافه کنید.

h1,
h2,
h3,
h4,
h5,
h6 {
	a[href^='#'] {
		/* Remove usual link styles */
		color: inherit;
		text-decoration: none;
		position: relative;

		/* Add different styles */
		&:hover:before {
			content: '#';
			position: absolute;
			right: 100%;
			margin-right: 5px;
			color: var(--color-text-content-secondary);
		}
	}
}

2. بلوک های کد

بلوک های کد باید tab-size: 4 داشته باشند
بلوک های کد باید direction: ltr داشته باشند
شماره خطوط باید کاملاً در موقعیت قرار گیرند
وقتی شماره خطوط فعال هستند، بالشتک سمت چپ اضافه کنید ( .has-line-numbers را بررسی کنید).

و شماره خطوط باید کاملاً در موقعیت قرار گیرند. همچنین، هنگامی که شماره خطوط فعال هستند، بالشتک سمت چپ را اضافه کنید ( .has-line-numbers را بررسی کنید).

pre {
	position: relative;
	tab-size: 4;
	direction: ltr;
	.line-number {
		margin-right: 1rem;
		position: absolute;
		left: 1rem;
	}
	&.has-line-numbers .line {
		padding-left: 2rem;
	}
}

3. جداول

.table-container باید overflow-x: auto داشته باشد تا مطمئن شود جدول در دستگاه های تلفن همراه قابل پیمایش است.

.table-container {
	overflow-x: auto;
}

4. پاراگراف ها

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

li {
	p {
		margin-top: 0;
		&:last-child {
			margin-bottom: 0;
		}
	}
}

نسخه‌بندی

اولین نسخه پوسته باید 1.0.0 باشد. پس از آن می توانید شماره نسخه را با توجه به تغییراتی که ایجاد می کنید افزایش دهید. برای یک پچ (مثلاً: رفع اشکال)، می‌توانید از 1.0.1 ، 1.0.2 ، و غیره استفاده کنید. برای یک تغییر جزئی، می‌توانید از 1.1.0 ، 1.2.0 و غیره استفاده کنید. برخلاف سایر نرم‌افزارها، پوسته‌ها تغییرات قابل توجهی ندارند. بنابراین، ما فکر نمی کنیم که شما هرگز نیاز به تغییر نسخه اصلی داشته باشید.

فهرست تغییرات

یک فایل CHANGELOG.md را به پوشه پوسته خود اضافه کنید و تغییرات را برای هر نسخه اضافه کنید. برای یادگیری نحوه نوشتن تغییرات ثبت شده به keepachangelog.com مراجعه کنید.

پس از تکمیل همه چیز، یک درخواست کشش به مخزن hyvor-blogs-themes برای ما ارسال کنید. هنگامی که PR ادغام شد، لیست پوسته ها به طور خودکار با پوسته جدید شما به روز می شود.