یکپارچه‌سازی فونت‌های Adobe (Adobe Fonts)

نحوه استفاده از Adobe Fonts با Bricks

تنها کاری که باید انجام دهید این است که «شناسه پروژه (Project ID)» Adobe Fonts را به Bricks بدهید.

ابتدا بخش «web projects» در حساب Adobe Fonts خود را باز کنید: https://fonts.adobe.com/my_fonts#web_projects-section

هر web project شما یک «Project ID» یکتا دارد.

شناسه پروژه web project‌ای را که می‌خواهید فونت‌هایش در سایت Bricks شما استفاده شود کپی کنید.

شناسه پروژه را در clipboard کپی کنید

سپس در پیشخوان وردپرس به Bricks > Settings > API keys بروید و شناسه پروژه را در فیلد «Adobe fonts (Project ID)» paste کنید. سپس تنظیمات را ذخیره کنید.

روی «Sync fonts» کلیک کنید تا همه فونت‌های این پروژه دریافت شوند

کنار فیلد Project ID، دکمه «Sync fonts» باید نمایان باشد. روی آن کلیک کنید تا فونت‌های Adobe این پروژه دریافت شوند. پیام موفقیت باید ظاهر شود و شمارنده «Published Adobe fonts» تعداد فونت‌های منتشرشده را نشان دهد.

فونت‌ها همگام شدند و در سازنده در دسترس هستند

این فونت‌ها اکنون در هر dropdown font-family داخل سازنده در دسترس هستند:

نکته

Bricks تشخیص می‌دهد وقتی از فونت Adobe استفاده می‌کنید که همان فونت در Google Fonts هم موجود است. Bricks فقط فونت Adobe را بارگذاری می‌کند تا از بارگذاری دوباره همان فونت از Google جلوگیری شود.

فونت‌های متغیر (Variable fonts)

Bricks همچنین کنترل جدید font-variation-settings را ارائه می‌دهد. این property CSS به شما اجازه می‌دهد نام محورهای چهارحرفی فونت متغیر Adobe را کنترل کنید؛ مثل wght، wdth، slnt و ital.

برای جزئیات بیشتر به https://developer.mozilla.org/en-US/docs/Web/CSS/font-variation-settings مراجعه کنید.

فونت متغیر Adobe با font-weight سفارشی (محور «wght») برابر 535

برای مشاهده فونت‌های متغیر Adobe موجود، در https://fonts.adobe.com/fonts گزینه «Variable Fonts» را زیر «Font technology» انتخاب کنید.

نکته

این font-variation-settings جدید برای فونت‌های سفارشی (Custom fonts) هم در دسترس است. Google Fonts در Bricks فعلاً فقط محور wght را پشتیبانی می‌کند. روی پشتیبانی کامل فونت متغیر با Google Fonts هم کار می‌کنیم.