مقدمة إلى ثيمات WordPress Block

لم تتغير المكونات التي تشكل سمة WordPress النموذجية كثيرًا على مر السنين. لدرجة أن المؤسس المشارك للمشروع Matt Mullenweg ساخرًا من أن موضوع المدرسة القديمة Kubrick (الذي تم إصداره في 2005) لا يزال يعمل مع الإصدارات الحديثة من نظام إدارة المحتوى.

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

تم تعيين قوالب القوالب لتصبح مستقبل WordPress. سيغيرون طريقة إنشاء المواقع الإلكترونية وصيانتها. بالإضافة إلى ذلك ، يتم دمجهم بإحكام مع محرر كتلة Gutenberg أكثر من نظرائهم "الكلاسيكيين".

أتساءل عن سبب كل هذا العناء؟ اليوم ، سنقوم بتزويدك بأساسيات قوالب قوالب WordPress. على طول الطريق ، سوف نستكشف كيف يقارنون ويتناقضون مع السمات التقليدية. هيا بنا نبدأ!

لماذا منع المظاهر؟

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

عندما يتعلق الأمر بإجراء تغييرات تؤثر على المظهر بالكامل ، ظل مُخصص WordPress هو مورد الانتقال. توفر هذه الأداة الوصول إلى إعدادات التصميم والتخطيط التي أتاحها مؤلف القالب. إذا لم يكن موجودًا في أداة التخصيص ، فمن المحتمل أن تضطر إلى البحث في الكود.

ومع ذلك ، كان أحد المبادئ الأساسية لمحرر الكتلة هو إنشاء واجهة موحدة بشكل أكبر داخل لوحة معلومات WordPress. لقد رأينا هذا يحدث بالفعل مع انتقال شاشة Widgets إلى واجهة مستخدم قائمة على الحظر. المخصص ببساطة لا يناسب هذا القالب.

مقدمة تحرير الموقع الكامل (FSE) هي الخطوة التالية في هذه العملية. يتجاوز مجرد تصميم صفحاتنا ومنشوراتنا. الآن ، يمكن إدارة كل جانب من جوانب تصميم القالب (رأس الصفحة ، تذييل الصفحة ، قوالب الصفحة ، إلخ) مباشرة داخل WordPress.

تعمل سمات الكتلة كبوابة لهذه الوظيفة. على هذا النحو ، فقد تم بناؤها حصريًا مع وضع الكتل في الاعتبار.

الأعمال الداخلية لموضوع WordPress Block

لا يوجد الكثير من أوجه التشابه بين السمات الكلاسيكية والكتل. لكن كلاهما لديه مجموعة من القواعد الأساسية التي توجه مكياجهما. إذا كنت ستقوم بتنزيل سمة كتلة والتنقل في هيكل الملف الخاص به ، فقد تبرز بعض التناقضات الرئيسية.

ملفات القوالب هي HTML ، بدلاً من PHP

في النسق الكلاسيكي ، ستجد ملفات قوالب بأسماء مثل index.php و header.php . تتخلص سمات الحظر من PHP وبدلاً من ذلك تحمل امتداد ملف .html .

في الداخل ، يحتوي ملف القالب على مزيج من HTML وترميز الحظر. على سبيل المثال ، دعنا نلقي نظرة على هذا النموذج من وثائق WordPress الرسمية:

 <!-- wp:site-title /--> <!-- wp:image {"sizeSlug":"large"} --> <figure class="wp-block-image size-large"> <img src="https://cldup.com/0BNcqkoMdq.jpg" alt="" /> </figure> <!-- /wp:image --> <!-- wp:group --> <div class="wp-block-group"> <!-- wp:post-title /--> <!-- wp:post-content /--> </div> <!-- /wp:group --> <!-- wp:group --> <div class="wp-block-group"> <!-- wp:heading --> <h2>Footer</h2> <!-- /wp:heading --> </div> <!-- /wp:group -->

يبدو ترميز الحظر كثيرًا مثل تعليقات HTML. ولكنه يتضمن بناء الجملة لاستدعاء كتل معينة في القالب. يحتوي موقع WordPress Full Site Editing على مرجع مفيد يتضمن ترميزًا لكل كتلة افتراضية.

وإذا بدا هذا النوع من التعليمات البرمجية مألوفًا ، فربما تكون قد رأيت شيئًا مشابهًا داخل عرض محرر كود Gutenberg.

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

السمات الكلاسيكية قادرة على تخزين القوالب داخل مجلدات ، لكنها ليست ضرورة. تتطلب سمات الكتل عدة مجلدات فرعية:

/parts
يحتوي على عناصر قابلة لإعادة الاستخدام مثل الرأس والتذييل والشريط الجانبي.

/templates
قوالب منازل لأنواع مختلفة من المحتوى. تعتبر العناصر مثل الصفحات وأرشيفات النشر والمنشورات الفردية أمثلة شائعة. لاحظ أن اصطلاح التسمية الخاص بهم يتبع التسلسل الهرمي لقالب WordPress - تشابه آخر مع السمات الكلاسيكية.

أحد الآثار الجانبية الإيجابية لهذا الترتيب هو أن الموضوعات ستكون منظمة بشكل أفضل. يعني وجود بنية مجلد موحدة قضاء وقت أقل في البحث عن ملف معين.

Theme.json التصميم

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

نظرًا لأن theme.json سيقوم تلقائيًا بإنشاء CSS المناسب بناءً على تكوينه ، فقد لا تحتاج إلى ملء ملف style.css كثيرًا. في هذا السيناريو ، يتم استخدام ورقة الأنماط لتحديد بعض الأساسيات ، بينما يعتمد كل شيء آخر على هذا الملف الجديد.

إنشاء وتحرير القوالب

يوفر WordPress منذ فترة طويلة القدرة على تحرير ملفات قالب القالب مباشرة داخل لوحة القيادة. غالبًا ما كان يتم تثبيط هذا الأمر ، حيث يمكن حتى لخطأ بسيط في الترميز أن يجعل الوصول إلى موقع الويب غير ممكن. ناهيك عن إمكانية الكتابة فوق التغييرات عند تحديث سمة (وبالتالي ، جزء من سبب استخدام سمة فرعية). يقوم بعض المطورين بإيقاف تشغيل الميزة تمامًا لتجنب حدوث كارثة بعيدة.

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

كما قد تتوقع ، الرمز اختياري تمامًا في هذا السيناريو. يمكن تحرير كل شيء عبر محرر الموقع الجديد ( المظهر > المحرر - مطلوب WordPress 5.9 أو أعلى ) والذي يحل محل أداة التخصيص القديمة عند تنشيط سمة الكتلة. ومثل الصفحات أو المنشورات ، يستخدم محرر الموقع واجهة مستخدم محرر الكتلة المألوفة.

وهذا ليس كل شيء. يمكن تصدير أي تغييرات تجريها داخل WordPress. سيمكنك هذا من استخدام سمة الحظر المخصصة الخاصة بك على مواقع ويب متعددة.

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

أشياء لتأخذها بالحسبان

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

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

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

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

كتلة الموارد الموضوع

إذا كنت ترغب في معرفة المزيد حول قوالب قوالب WordPress ، فهناك بعض الموارد الرائعة المتاحة. هناك القليل من المفضلين عندنا:

• كتلة التوثيق عن طريق WordPress
• Blockbase الموضوع من قبل Automattic
• تحرير الموقع بالكامل بواسطة Carolina Nymark
• الدليل الشامل لقوالب قوالب ووردبريس في جوتنبرج بواسطة ريتش تابور
• ثورة قوالب قوالب ووردبريس تكتسب زخمًا بهدوء بواسطة جاستن تادلوك
• تجارب موضوع WordPress بواسطة WordPress