آشنایی با رابط (Interface tour)

قبل از ساخت، بیایید محیط را بشناسیم. این تور کوتاه نشان می‌دهد هر بخش رابط سازنده Bricks کجاست.

باز کردن سازنده

یک صفحه Home بسازید تا همراه با درس پیش بروید:

سازنده باز می‌شود. اینجا سایت خود را می‌سازید.

بوم خالی سازنده Bricks

سازنده چهار ناحیه اصلی دارد: Toolbar (بالا)، Settings Panel (چپ)، Canvas (وسط) و Structure Panel (راست).

نقشه ذهنی ساده:

نوار ابزار بالا همیشه در دسترس است. کارکرد آیکون‌های اصلی:

لوگوی Bricks — لینکی که در تنظیمات Bricks پیکربندی شده (پیش‌فرض: پیشخوان وردپرس)
Styles — باز کردن Style Manager برای کلاس‌ها، متغیرها، رنگ‌ها، مقیاس تایپوگرافی و فاصله‌گذاری (Cmd/Ctrl + .)
Pages — جابه‌جایی بین صفحات بدون خروج از سازنده
Templates — کتابخانه قالب و قالب‌های ذخیره‌شده
Manage — تنظیمات و ابزارهای مرتبط با سازنده
Command palette — جستجوی المان‌ها و اقدامات (Cmd/Ctrl + K)
Elements / Components — نمایش/مخفی پنل المان‌ها و کامپوننت‌ها
Reload canvas — بارگذاری مجدد پیش‌نمایش
Breakpoints and preview size — دسکتاپ، تبلت و موبایل و عرض پیش‌نمایش
Undo / Redo — عقب و جلو در تاریخچه تغییرات
Structure — نمایش/مخفی پنل ساختار
Edit in WordPress — بازگشت به ویرایشگر وردپرس
View on front end — مشاهده صفحه در فرانت‌اند
Preview mode — پیش‌نمایش تمیزتر بدون overlay سازنده
Save — ذخیره کار

این پنل بر اساس کاری که انجام می‌دهید تغییر می‌کند.

پیش‌فرض: همه المان‌های قابل افزودن (Layout، Basic، Media، WordPress و غیره)

وقتی المانی انتخاب شده: کنترل‌های آن المان (تایپوگرافی، رنگ، فاصله و غیره)

وقتی Theme Styles فعال است: تنظیمات طراحی سراسری

وقتی Page settings فعال است: تنظیمات مخصوص صفحه

فضای کاری بصری. صفحه یا قالب را اینجا می‌سازید.

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

بوم طراحی را دقیق نشان می‌دهد، اما همیشه در فرانت‌اند پیش‌نمایش بگیرید تا نتیجه نهایی را ببینید.

سلسله‌مراتب همه‌چیز روی صفحه فعلی را به‌صورت درخت نشان می‌دهد.

Section
  └─ Container
      ├─ Heading
      ├─ Text
      └─ Button

چرا مفید است:

با آیکون درخت در نوار ابزار روشن/خاموش می‌شود؛ بیشتر کاربران آن را باز نگه می‌دارند.

اکنون می‌دانید:

مسیر بعدی: ساخت اولین صفحه (Start your first page)

بهبود این درس

آکادمی Bricks تازه راه افتاده. اگر بخشی نامفهوم یا ناقص بود، از جعبه بازخورد در سایدبار راست یادداشت بگذارید.