پرش به محتویات

Command Palette

Bricks 2.0 Command Palette را معرفی می‌کند — قابلیتی قدرتمند که دسترسی فوری مبتنی بر صفحه‌کلید به عملکردهای اصلی داخل سازنده می‌دهد.

نحوه باز کردن

روی آیکون command در نوار ابزار سازنده کلیک کنید یا از میانبر CMD/CTRL + K استفاده کنید تا Command Palette به‌صورت overlay باز شود؛ می‌توانید تایپ کنید و دستورها را در سه scope مجزا فیلتر کنید.

Scope: Builder

از لیست رو به رشدی اهداف مثل classes، variables، templates، theme styles، settings و غیره به بخش‌های کلیدی سازنده بروید.

Command Palette — scope Builder

Scope: Post Types

این scope همه post typeهای ثبت‌شده را مرور می‌کند؛ نوشته جدید بسازید یا هر نوشته موجود را duplicate کنید.

scope به‌طور خودکار post typeای را که در حال ویرایش آن هستید انتخاب می‌کند. مثلاً اگر قالب Bricks ویرایش می‌کنید، post type «Template (Bricks)» انتخاب می‌شود. اگر «Page» ویرایش می‌کنید، «Page» انتخاب می‌شود و همین‌طور ادامه دارد.

Command Palette — scope Post Types

Scope: Elements

scope «Elements» با امکان درج چند المان با ساختار مشخص در یک اقدام، گردش کار شما را بسیار سریع‌تر می‌کند.

با تسلط بر syntax شبیه Emmet، در چند ثانیه چیدمان‌های پیچیده می‌سازید — نه چند دقیقه — و فرایند طراحی به‌مراتب کارآمدتر می‌شود.

با تمرین، این قابلیت بخش ضروری جعبه‌ابزار Bricks Builder شما می‌شود، به‌ویژه برای ساخت سریع ساختارهای رایج صفحه و ترکیب المان‌هایی که زیاد استفاده می‌کنید و می‌توانید برای دسترسی فوری ذخیره کنید.

Command Palette — scope Elements

درج المان تکی

برای درج یک المان، نام آن را تایپ کنید (مثلاً «Section»)، با ARROW در لیست المان‌ها حرکت کنید و با ENTER درج کنید — یا روی نام المان کلیک کنید.

درج ساختار المان

هر المان با نماد @ شروع می‌شود.

نام المانی که command bar نیاز دارد در براکت مربعی در لیست نتایج نمایش داده می‌شود:

نام المان در Command Palette

دستور المان Text link: `@text-link`

عملگرهای پشتیبانی‌شده

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

نماد معنی
@ نام المان Bricks (مثلاً @heading)
> nest داخل
+ درج المان به‌عنوان sibling
* تعداد دفعات درج المان

مثال ساختار المان

@section * 2 > @heading + @text + @button

این ساختار زیر را می‌سازد (دو بار به‌خاطر ضریب * 2):

  • SectionContainerHeadingTextButton

درج سریع المان

Note

پس از انتخاب المان از نتایج جستجو، نام آن با پیشوند @ به query اضافه می‌شود تا queryهای پیچیده را سریع بسازید:

  1. @ را تایپ کنید تا حالت درج فعال شود
  2. المانی انتخاب کنید (مثلاً «section»)
  3. برای المان فرزند > تایپ کنید
  4. ساختار را ادامه دهید
  5. روی ساختار المان خود کلیک کنید
  6. روی دکمه «Insert» کنار query کلیک کنید
  7. CMD/CTRL + ENTER را بزنید

ذخیره ساختار المان

به‌جای تایپ دستی ساختارهای محبوب هر بار، با کلیک روی دکمه «Save» کنار command bar آن‌ها را ذخیره کنید. ساختارها در localStorage نگه‌داری می‌شوند؛ هر کاربر سایت مجموعه ساختارهای محبوب خود را دارد.

لیست ساختارهای المان ذخیره‌شده

لیست ساختارهای المان ذخیره‌شده

برای حذف ساختار، روی آیتم در لیست hover کنید و روی آیکون «Delete» کلیک کنید.

میانبرهای صفحه‌کلید

میانبر اقدام
CMD/CTRL + K باز/بستن Command Palette
ESC ناوبری به post type مشخص
TAB > ENTER (ورود به scope انتخاب‌شده) جابه‌جایی بین جستجو و scopeها
# (اولین کاراکتر در input جستجو) ورود به scope «Builder»
/ (اولین کاراکتر در input جستجو) ورود به scope «Post Types»
+ یا @ (اولین کاراکتر در input جستجو) ورود به scope «Elements»
/0-9 (اسلش و سپس عدد) رفتن به post type مشخص
ARROW UP/DOWN + ENTER رفتن به نتیجه جستجو و باز کردن آن

یادداشت‌ها

Bricks آخرین scope انتخاب‌شده را حتی پس از بارگذاری مجدد سازنده به‌خاطر می‌سپارد (در localStorage).

پنل «Pages» منسوخ شده؛ همه عملکرد آن اکنون در Command Palette است.

آیکون «Docs» هم از نوار ابزار حذف شده، اما همچنان از scope «Builder» در دسترس است.