مبني لمن يحررون

درج حقول أوسع، وعناصر تحكم لشريط الأدوات، وسياسات تحرير وفهرس إداري، مضبوطة في block.json وblockstudio.json.

مساحة لكل حقل

تضيق المساحة في الشريط الجانبي للمكررات وحقول الأكواد والمجموعات المتداخلة. يحمل رأس الكتلة زر Open Expanded Editor يفتح الحقول نفسها في درج أوسع من اليمين. يغلقه زر Done أو الخلفية أو Esc، وتظل الكتلة محددة.

يعرض عارض الحقول نفسه السمات نفسها، لذا تتحدث المعاينة أثناء الكتابة، ولا حاجة إلى إعداد block.json. ويمكن نقل الحقول التي ينبغي أن تظهر بجوار المحتوى إلى شريط أدوات الكتلة باستخدام "position": "toolbar".

المحرر الموسّع

block.json

{
  "name": "my-theme/hero",
  "title": "Hero",
  "blockstudio": {
    "attributes": [
      {
        "id": "alignment",
        "type": "select",
        "label": "Alignment",
        "position": "toolbar",
        "options": [
          { "value": "left", "label": "Left" },
          { "value": "center", "label": "Center" },
          { "value": "right", "label": "Right" }
        ]
      },
      {
        "id": "title",
        "type": "text",
        "label": "Title"
      }
    ]
  }
}

الإكمال التلقائي من CSS

اعرض عناوين URL لأوراق الأنماط في blockEditor.cssClasses وcssVariables، وتقترح حقول الفئات والأكواد ما تعرّفه تلك الملفات.

مؤشرات التمرير والتحديد

اضبط blockEditor.enhance لإضافة مؤشرات التمرير والتحديد الخاصة بـ Blockstudio إلى المحرر.

من يمكنه الوصول إلى المحرر

تحدّد users.ids وusers.roles في blockstudio.json معرّفات المستخدمين والأدوار التي لديها إمكانية الوصول إلى المحرر عبر Blockstudio.

بلغة عميلك

تتبع عناصر التحكم بالحقول وشاشة الإدارة ولوحة التحرير لغة الموقع أو لغة الملف الشخصي لكل مستخدم، باستخدام الترجمات المضمّنة.

أصول خاصة بالمحرر

يسرد editor.assets في blockstudio.json الأصول الإضافية التي ينبغي تحميلها في المحرر.

الوسائط في الحمولة الأولية

تقرأ حقول الملفات بيانات المرفقات من حمولة المحرر الأولية، بما في ذلك المجموعات المتداخلة وعلامات التبويب والمكررات، قبل طلبها من نقطة نهاية الوسائط.

طلب معاينة واحد في كل مرة

يلغي طلب معاينة أحدث لكتلة ما الطلب السابق في المتصفح، وتظل المعاينة الحالية معروضة في الأثناء.

تحتفظ كل كتلة بقيمها

تحتفظ الكتل المحددة معًا بقيمها الخاصة، وتشمل عمليتا التراجع والإعادة حقول RichText والشريط الجانبي.

عطّل الحقل واحتفظ بقيمته

يمكن للمحرر تعطيل حقل من المفتش: مرّر المؤشر فوق حافته اليسرى حتى يظهر الإطار الأزرق، ثم انقر. يصبح الحقل شبه شفاف، وتظل قيمته محفوظة، وتتوقف الكتلة عن عرضه إلى أن يعيد أحدهم تفعيله.

ينطبق الأمر نفسه على العناصر الفردية في حقل الملفات، فيمكن إخفاء صورة واحدة بينما تظهر الصور الأخرى. عيّن "switch": true لإظهار مفتاح تبديل للحقل، واقرأ $a['_disabled'] عندما يحتاج القالب إلى معرفة ذلك.

سمات التعطيل

block.json

{
  "name": "acme/card",
  "title": "Card",
  "blockstudio": {
    "attributes": [
      {
        "id": "title",
        "type": "text",
        "label": "Title",
        "switch": true
      }
    ]
  }
}

index.php

<?php if (!empty($a['_disabled']) && in_array('title', $a['_disabled'])) : ?>
  <p>No title on this one.</p>
<?php else : ?>
  <h1><?php echo esc_html($a['title']); ?></h1>
<?php endif; ?>

معاينة في أداة الإدراج

أضف مفتاح example إلى block.json، وستظهر معاينة للكتلة عندما يمرر المحرر المؤشر فوقها في أداة إدراج الكتل. يكفي كائن فارغ لكتلة تبدو مناسبة بإعداداتها الافتراضية.

أعطِ example.attributes قيمًا نموذجية لحقولك، أو example.innerBlocks شجرة ابتدائية لكتلة تحتوي كتلًا أخرى.

معاينة أداة الإدراج

block.json

{
  "name": "my-theme/hero",
  "title": "Hero",
  "category": "text",
  "example": {
    "attributes": {
      "title": "This title will be shown in the preview"
    }
  },
  "blockstudio": true
}

index.php

<h1><?php echo esc_html($a['title']); ?></h1>

سياسة التحرير في ملف واحد

حدد ما تعرضه أداة الإدراج دون الحاجة إلى شيفرة ربط القالب. يقبل blockEditor.blocks قائمتي سماح ومنع مع أحرف بدل مثل core/*، ويعيد تسمية الفئات وترتيبها، ويزيل أنماط الكتل المسجلة في PHP، ويخفي الأدوات القديمة، ويمكنه تعطيل دليل الكتل.

يتيح blockEditor.patterns مصادر الأنماط الأساسية والبعيدة والخاصة بالقالب وBlockstudio أو يعطلها، كما يرشح فئاتها. يعطّل blockEditor.media Openverse ويحد من أحجام الصور التي يمكن للمحررين اختيارها.

إعدادات محرر الكتل

blockstudio.json

{
  "blockEditor": {
    "blocks": {
      "allow": ["core/*", "my-theme/*"],
      "deny": ["core/embed", "core/freeform"],
      "directory": false,
      "categories": {
        "rename": { "text": "Writing" },
        "order": ["my-theme", "text", "media"]
      },
      "styles": {
        "deny": { "my-theme/card": ["outline"] }
      },
      "legacyWidgets": { "hide": ["archives", "calendar"] }
    },
    "patterns": {
      "core": false,
      "remote": false,
      "categories": { "deny": ["gallery"] }
    },
    "media": {
      "openverse": false,
      "imageSizes": { "allow": ["thumbnail", "large"] }
    }
  }
}

عرض أولي سريع

تُعرض كتل Blockstudio على الخادم. يحمّل المحرر مسبقًا الناتج المعروض للكتل الموجودة في التدوينة، بما فيها الكتل المتداخلة في الأنماط المتزامنة، ويعيد استخدامه للعرض الأول بدلًا من إرسال طلب عرض لكل كتلة محفوظة.

تُحمّل الشيفرة والفئات والسمات وعناصر تحكم WYSIWYG عند ظهورها أول مرة، لذا لا تُحمّل الكتل غير المحددة أبدًا. ويمكن لكتلة لا تحتاج إلى معاينة مباشرة تعيين disableLoading وعرض عنصر نائب، مع بقاء كل حقل قابلًا للتحرير.

تحميل المحرر

block.json

{
  "name": "my-theme/map",
  "title": "Map",
  "blockstudio": {
    "blockEditor": {
      "disableLoading": true
    }
  }
}

blockstudio.json

{
  "blockEditor": {
    "disableLoading": true
  }
}

معاينات تتصرف مثل الصفحة

يُحمّل Interactivity API داخل إطار المحرر، لذا تعمل data-wp-context والارتباطات ومعالجات الأحداث وإجراءات متجرك في لوحة التحرير. وتُبنى مكونات bsui/* المضمّنة عليه، فيُفتح مربع حوار وتنسدل قائمة اختيار أثناء التحرير.

لا تنتقل الروابط في المعاينة إلى صفحات أخرى عند النقر عليها أو فتحها باستخدام مفتاح تعديل أو تفعيلها من لوحة المفاتيح، ويظل النقر يحدد الكتلة. مع assets.reset.enabled، تُنسخ فئات body الخاصة بالقالب إلى لوحة التحرير، لذا تطابقها هناك أيضًا محددات مثل .brand-a .site-card.

التفاعلية

block.json

{
  "name": "my-theme/disclosure",
  "title": "Disclosure",
  "blockstudio": {
    "interactivity": true
  }
}

functions.php

<?php
add_filter('blockstudio/editor/canvas/body_class', function (array $classes) {
  return array_values(array_diff($classes, ['logged-in']));
});

جرد في Tools > Blockstudio

تعرض شاشة الإدارة ما سجّله Blockstudio من نظام الملفات: الكتل والإضافات والحقول والصفحات مع حالة المزامنة، ومخططات db.php، ضمن جداول DataViews الأصلية في WordPress. ويتيح عرض قواعد البيانات استعراض سجلات كل مخطط، مع جلبها وتقسيمها إلى صفحات عبر REST API.

عندما يسمّي القالب سجلات blocks.json، يعرض عرض Registry كتلها ويستوردها إلى دليل الكتل لديك من wp-admin. الشاشة متاحة للمستخدمين الذين لديهم manage_options، ويعطّلها مرشح blockstudio/admin/enabled.

شاشة الإدارة

blocks.json

{
  "$schema": "https://blockstudio.dev/schema/blocks.json",
  "directory": "blockstudio",
  "registries": {
    "ui": "https://blocks.example.com/registry.json"
  }
}

functions.php

<?php
add_filter('blockstudio/admin/enabled', '__return_false');

Plus

حزمة الإضافات الرسمية

قوالب مواقع مميزة، وتعليمات نظام للذكاء الاصطناعي، ومجتمع Discord خاص. شراء لمرة واحدة وتحديثات مدى الحياة.

أكثر من 500+ قالب موقع
تعليمات نظام الذكاء الاصطناعي
تحديثات مدى الحياة
مجتمع Discord خاص

احصل على Plus