Canvas للمطورين

قالب WordPress بنظام الكتل للمطورين، مبني على theme.json

‏Canvas قالب WordPress مع الإضافة المرافقة، وهو قالب كتل من البداية إلى النهاية. النماذج نماذج كتل، والأنماط تأتي من theme.json، وما يحفظه المحرر في قاعدة البيانات هو نفس ترميز الكتل الذي يقرؤه أي قالب كتل آخر. لا شيء هنا يعتمد على منشئ صفحات.

آخر تحديث

البنية المعمارية

قالب كتل يُحرَّر حيث يحتفظ به WordPress

يتولى القالب القوالب وأجزاء النموذج ومتغيرات الأنماط، بينما تتولى الإضافة مكتبة الكتل وأدوات البناء والنماذج وطبقات تحسين محركات البحث والأداء وأداة استيراد العروض التوضيحية. تبقى القوالب والأنماط العامة في محرر الموقع، فلا يُخفى أي جزء من الموقع داخل لوحة إعدادات من إنتاجنا.

  • 173 نموذج كتل و5 أجزاء نماذج، وكلها قابلة للتحرير في محرر الموقع.
  • 4 متغيرات أسلوب، تشمل الداكن ومنتصف الليل، ويمكن التبديل بينها في محرر الموقع
  • تنتقل الألوان والطباعة عبر theme.json، لذا يعرض المحرر الخط نفسه الذي يظهر في الواجهة الأمامية
  • 183 نمطًا كتل، بإدراج نسخة لمرة واحدة من الترميز
  • تفتح الصفحة قالبها كاملًا محيطًا بالمحتوى الذي تقوم بتحريره.

داخل المحرر ومحرر الموقع

محرر الموقع في WordPress يعرض نماذج Canvas ومتغيرات الأنماط
تبقى النماذج والأجزاء والأنماط العامة في محرر الموقع، حيث يحتفظ بها WordPress.
المحتوى

ما يُحفظ في قاعدة البيانات هو ترميز الكتل

ليس سبب تفضيل قالب الكتل قائمةً بالميزات. السبب هو ما ستبقى ممسكاً به بين يديك بعد خمس سنوات.

لا توجد صيغة خاصة

يحرّر Canvas كتل WordPress القياسية دون تنسيق خاص به، لذا تحتفظ المقالات والصفحات بمحتواها إذا تغيّر القالب يومًا. لا توجد أكواد قصيرة لتحفظها ولا عرض للكود لتفتحه.

إعدادات لا مقتطفات برمجية

كل ما يراه الزائر متاح من لوحة إعدادات الكتلة. وحين احتاج عرض توضيحي إلى ما لا تستطيع الكتلة التعبير عنه، أضافت الكتلة الإعداد المطلوب، ولم تحصل الصفحة على HTML خام أبدًا.

لوحة الإعدادات المتقدمة في كل كتلة

تُضاف الحركات وشروط العرض والفئات المخصصة والسمات المخصصة وCSS المخصص لكل كتلة في المحرر، بما في ذلك كتل النواة وكتل الجهات الخارجية.

تتبع الأصول الصفحة

لا تحمّل الصفحة إلا ملفات CSS وJavaScript الخاصة بالكتل الموجودة فيها، لذا لا تحمّل صفحة الأسعار نص الشريحة البرمجي أبدًا. 35 تحسينًا إضافيًا تُفعَّل بمفاتيح تشغيل بسيطة، دون الحاجة إلى تثبيت أي إضافة.

قادم من قالب آخر؟ يبني Elementor و Divi الصفحات في محررين خاصين بكل منهما، لذا يزول التخطيط مع زوال المنشئ: اطّلع على ما تحتفظ به مواقع Elementor عند نقلها ومقارنة Divi Builder بغيره. ويبني Kadence وGeneratePress أيضًا في محرر الكتل، مع كتلهما في إضافات مجانية (Canvas مقابل Kadence، Canvas مقابل GeneratePress)، ويحتفظ Blocksy بمنشئ الترويسة الخاص به في المخصّص.

قالب الكتل مقابل منشئ الصفحات: مقارنة

عناصر واجهة الموقع

يُعرض منشئ الترويسة ومنشئ التذييل كأجزاء من النموذج

الترويسات والتذييلات والأشرطة العلوية والقوائم الضخمة واللوحات الجانبية وعناوين الصفحات هي سجلات مبنية من كتل، وتصل إلى الواجهة الأمامية عبر أجزاء النموذج الخاصة بالقالب. يعرض جزء الترويسة الترويسةَ المعيّنة للصفحة، ويعرض جزء التذييل السجلَّ المعيّن للتذييل. وهذا يُبقي محرر الموقع قادرًا على رؤيتها، ويُبقي إعدادات الكتل متطابقة مع أي مكان آخر.

  • 22 كتلة للترويسة و94 خيارًا للترويسة خلف منشئ الترويسة
  • عيّن ترويسة على مستوى الموقع كله، أو تجاوزها في صفحة واحدة، وافعل الشيء نفسه مع التذييلات والأشرطة العلوية والقوائم الضخمة واللوحات الجانبية وعناوين الصفحات
  • أقسام Hero والشرائح سجلات أيضًا، وتُوضع بواسطة كتلة الفتحة الموجودة في النموذج
  • تُعرض كتلتا الفتحات في مساحة التحرير، فتفتح الصفحة على القسم الذي يراه الزائر

كيف يعمل منشئ الترويسة

سجل ترويسة يُبنى من كتل الترويسة في محرر كتل WordPress
الترويسة عنصر يُبنى من الكتل ويُعرض من خلال جزء القالب «Header».
WooCommerce

24 كتلةً للمتجر و18 نموذجًا للمتجر

WooCommerce اختياري، وعندما يكون مثبتًا، تتولى الكتل والنماذج عرضه، دون أي تجاوزات للنماذج يلزم إبقاؤها متزامنة.

24

كتل المتجر

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

18

نماذج المتجر

نماذج لشاشات المتجر والمنتج وسلة التسوق والدفع والحساب، تُحرَّر في محرر الموقع مثل أي نموذج آخر.

21

متاجر العروض التوضيحية

يُستورد 21 عرضًا من أصل 88 عرضًا توضيحيًا كمتجر كامل، مع المنتجات والفئات والسمات وخطوة الدفع جاهزة.

الصفحة الرئيسية لعرض متجر الملابس التوضيحي كما يراها المتسوق، مع الشريحة بملء الشاشة وسلة التسوق في الترويسة.
الصفحة الرئيسية للعرض التوضيحي للأثاث، وهو متجر WooCommerce لبيع الأثاث وتأجيره

اثنان من متاجر العروض التوضيحية البالغ عددها 21، تعملان بكتل المتجر وقوالبه.

كتل WooCommerce

التوسيع

يُنشئ معالج الإعداد قالبًا فرعيًا، إذا أردت ذلك

أنشئ القالب الفرعي فقط إذا كنت تنوي تعديل ملفات النماذج الخاصة بـ Canvas مباشرةً، لأن ذلك ما يحفظ هذه التعديلات من الضياع عند التحديث. يعرضه معالج الإعداد في خطوة مستقلة قبل استيراد العرض التوضيحي، ويكتبه في مجلد القوالب لديك ويفعّله، ويبقى موقعك بالمظهر نفسه بعد ذلك. معظم المواقع لا تحتاجه أبدًا، لأن الأسباب المعتادة أصبحت تُضبط من الإعدادات.

  • CSS مخصص على مستوى الموقع، بالإضافة إلى JavaScript مخصص لقسم head وآخر لقسم التذييل، ضمن قسم متفرقات في خيارات القالب
  • CSS مخصّص لكل كتلة، مكتوب كأزواج خاصية وقيمة بدون محدد حولها
  • السمات المخصصة لكل كتلة، سطر واحد لكل سمة بصيغة مفتاح وقيمة، وتقبل سمات data وaria
  • قواعد طباعة مخصصة لأي محدد تحدده، في قسم الطباعة
  • سجّل حزمة أيقونات خاصة بك عبر الواجهة نفسها التي تستخدمها 4 حزم مدمجة
  • صدّر إعداد خيارات القالب كاملًا كملف، واستورده في الموقع التالي.

كل قسم من خيارات القالب

لوحة إعدادات كتلة Canvas في محرر WordPress، مع فتح الخيارات المتقدمة
تظهر اللوحة المتقدمة في كل كتلة، بما في ذلك الكتل الأساسية والكتل القادمة من الإضافات الأخرى.
البيئة

ما يحتاجه Canvas، وما يفعله عند التثبيت

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

WordPress 7.1 أو أحدث PHP 7.4 أو أحدث مُختبَر حتى WordPress 7.1 محرر الكتل ومحرر الموقع اللذان يأتي بهما WordPress WooCommerce اختياري
  • لا يُنزَّل Canvas Core كملف منفصل أبدًا: يُثبَّت من داخل WordPress بعد تفعيل الترخيص، فلا يوجد ما يلزم إدارته من حيث مطابقة الإصدارات
  • تصل التحديثات إلى شاشة التحديثات في WordPress، مع وضع الصيانة ونسخة احتياطية مؤقتة، والتراجع من داخل WordPress نفسه
  • تقتصر التحديثات التلقائية على الإصدارات التصحيحية فقط، وهي مفعّلة افتراضياً مع مفتاح لإيقافها، ويُشار صراحةً إلى أي إصدار يغيّر قالباً خصّصته.
  • تُجري شاشة فحص الصحة فحصًا لمتطلبات الخادم مقابل المضيف الفعلي، وتعرض ما يحتاج إلى انتباه، وتظهر الفحوص نفسها ضمن صحة الموقع في WordPress
  • كل النصوص قابلة للترجمة، مع قوالب ترجمة للقالب والإضافة تُعاد إنشاؤها مع كل إصدار، وملف إعدادات WPML داخل الإضافة
  • يُشتق من محتواك وقت العرض كلٌّ من تحسين محركات البحث التقني، وخريطة موقع XML، و16 نوعًا من أنواع Schema

388 مقالةً توثيقية، المُنشأة من الشيفرة المرفقة مع المنتج

الأسئلة

الأسئلة التقنية، مع الإجابات

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

هل Canvas قالب كتل أم قالب منشئ صفحات؟

Canvas قالب WordPress مبني بالكامل من الكتل، وهذا ما تسميه WordPress قالب كتل. النماذج هي نماذج كتل WordPress، و"template parts" هي أجزاء النماذج كما في WordPress، وتُمرَّر الألوان والخطوط عبر theme.json، ويُحرَّر كل شيء في محرر الكتل ومحرر الموقع المرفقين مع WordPress. لا توجد أداة بناء منفصلة لتثبيتها، ولا محرر ثانٍ لتعلمه، ولا اشتراك في أداة بناء لتجديده.

ماذا يحدث للترميز إذا غيّر الموقع القالب لاحقاً؟

تبقى البنية متوافقة مع كتل WordPress القياسية، لأن هذا ما يحفظه Canvas. تتوقف كتلة Canvas التي لا يتعرف عليها قالب آخر عن عرض تصميمها، لكن العناوين والفقرات والصور والقوائم كتل أساسية تُقرأ بشكل طبيعي في أي مكان. لا يُحفظ أي شيء كرمز مختصر (shortcode) أو بتنسيق تخطيط خاص.

أين تُعرض الترويسة والتذييل فعليًا؟

عبر أجزاء النماذج التي يسجّلها Canvas، وعددها 5 أجزاء: Header، Footer، Page Title، Sidebar، وSidebar Alt. يعرض جزء Header سجلّ الترويسة المعيّن للصفحة، ويعرض جزء Footer سجلّ التذييل المعيّن، ويعرض جزء Page Title ناتج إعدادات عنوان الصفحة الخاصة بها. الأجزاء هي البنية التحتية، أما التصميم فهو السجل الذي تبنيه من 22 كتلة ترويسة.

هل أحتاج إلى قالب فرعي؟

لا تحتاج إليه إلا إذا كنت تنوي تعديل ملفات قوالب Canvas مباشرة، وهي الملفات التي يحميها القالب الفرعي من التحديثات. يُنشئ معالج الإعداد قالبًا فرعيًا لك في خطوته الاختيارية «القالب الفرعي» ويفعّل الموقع عليه، أو يمكنك نسخ مجلد القالب الفرعي المرفق داخل Canvas إلى مجلد القوالب لديك بنفسك. لا تحتاجه معظم المواقع أبدًا: فخيارات القالب تتولى الإعدادات على مستوى الموقع، وCSS مخصص وسمات مخصصة لكل كتلة تغطي مستوى الكتلة، وحقول CSS وJavaScript المخصصة على مستوى الموقع موجودة في قسم «متفرقات» ضمن خيارات القالب.

هل Canvas قالب يدعم الكتابة من اليمين إلى اليسار؟

نعم، لكل ملف أنماط من Canvas نسخة معكوسة من اليمين إلى اليسار، ويحمّلها WordPress وحده عندما يعمل الموقع بالعربية أو العبرية أو الفارسية أو أي لغة أخرى تُكتب من اليمين إلى اليسار. 88 من 88 عرضًا توضيحيًا تُفحص بالاتجاه من اليمين إلى اليسار قبل إصدارها، فتظهر القوائم والشبكات والنماذج في الجهة الصحيحة. أما الترجمة فأمر منفصل وهي مكتملة أيضًا: يأتي كلا جزأي المنتج مع قوالب ترجمة، ويأتي ملف إعداد WPML مع الإضافة.

قالب كتل يمكنك تسليمه لأي شخص

يعتمد Canvas على المحرر الذي يأتي مع WordPress، ويحفظ ترميز الكتل القياسي، ويحتفظ بالنماذج في محرر الموقع. هل تبني لعملائك؟ اطّلع على صفحتي الوكالات والمستقلين.