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

مدیر متغیرهای سراسری (Global Variables Manager)

مدیر متغیرهای سراسری (Global Variables Manager) قابلیت جدیدی است برای ساخت، مدیریت و دسته‌بندی همه CSS variableها مستقیماً داخل سازنده.

مدیریت CSS variableها را ساده می‌کند و اعمال طراحی یکنواخت در پروژه‌ها را آسان می‌کند.

دسترسی به Variable Manager

برای دسترسی به Variable Manager روی آیکون «Gear» در بالای سمت چپ نوار ابزار کلیک کنید تا «Style Manager» باز شود. سپس با کلیک روی آیکون «Curly Brackets» در sidebar، Variable Manager باز می‌شود.

Variable Manager در Style Manager

Variable Manager را می‌توان در Bricks > Settings > General > Disable global variable manager غیرفعال کرد.

قابلیت‌های اصلی

ساخت و مدیریت متغیر

در Global Variables Manager، CSS variableها را در رابط یکپارچه مدیریت کنید:

  • Manage variables: CSS variable جدید با نام و مقدار سفارشی بسازید یا به‌روز کنید. متغیرهای غیرضروری را حذف کنید.
  • Bulk actions: با انتخاب دو یا بیشتر متغیر، rename و duplicate گروهی — شامل find and replace یا prefix/suffix. توجه: rename CSS variable به‌طور خودکار instanceها در سراسر سایت را به‌روز نمی‌کند.
  • Variable categorization: متغیرها را دسته‌بندی کنید و با drag-and-drop مرتب کنید.

مدیریت CSS variableها

جستجو و مرتب‌سازی

در header Global Variables Manager:

  • Including or excluding specific strings.
  • Sorting options: مرتب‌سازی الفبایی.
  • Filtering based on usage: «Used on this page» یا «Unused on this page».

فیلتر Variable Manager

Variable Picker در سازنده

«Variable Picker» جدید هنگام ویرایش تنظیمات المان در دسترس است.

همه متغیرهای ساخته‌شده از Global Variables Manager را بر اساس category فهرست می‌کند.

کلیک روی متغیر آن را مستقیماً در تنظیم انتخاب‌شده insert می‌کند — استفاده از استایل یکنواخت در المان‌ها و کلاس‌ها را ساده می‌کند.

Variable Picker

Export و import متغیر

Global Variables Manager export و import CSS variable را برای framework استایل یکنواخت در پروژه‌های مختلف ساده می‌کند.

Export متغیرها

  1. Export all: با «Export» در بالای manager، همه متغیرها به JSON export می‌شوند.

Export همه متغیرها

  1. Export selected: متغیرهای انتخاب‌شده با «Export selected».

Export متغیرهای انتخاب‌شده

Import متغیرها

Import via JSON file: در popup «Import» فایل JSON را drag and drop کنید.

Import متغیرها

انتخاب فایل import متغیر

Manual text entry: متغیرها را دستی در textarea وارد کنید — مفید برای import سریع از child theme، افزونه سفارشی یا snippet. فرمت: لیست تعریف CSS variable با semicolon، مثل:

--bricks-color-primary: #ffd64f;
--bricks-color-secondary: #fc5778;
--bricks-text-dark: #212121;

Import متغیر از textarea

Importing from remote templates: هنگام insert قالب remote می‌توانید CSS variableهای سایت remote را هم import کنید تا طراحی قالب حفظ شود یا با guideline محلی تطبیق یابد.