الجديد في WordPress 6.2: وضع التصفح وكتاب الأنماط وقوائم التنقل المحسّنة وواجهات برمجة التطبيقات الجديدة وغير ذلك الكثير

تمت جدولة إصدار WordPress 6.2 في 28 مارس 2023 ، وقد حان الوقت لاستكشاف ما سيأتي مع الإصدار الأول لعام 2023.

مع WordPress 6.2 ، ندخل المرحلة النهائية من المرحلة 2 من خارطة طريق تطوير Gutenberg طويلة المدى ، ويترك محرر الكتلة المرحلة التجريبية رسميًا.

يركز هذا الإصدار بشكل أساسي على تحسين الواجهة وتبسيط تجربة التحرير.

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

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

تحسين تجربة التحرير

يوفر WordPress 6.2 تجربة تحرير محسّنة ، مع وضع بنية الموقع بالكامل في المركز. يمكنك الآن إدارة قوائم التنقل بسهولة أكبر ، ودفع تغييرات النمط من كتلة واحدة إلى أنماط عالمية ، والتنقل بسهولة بين القوالب وأجزاء القالب مع أجزاء القالب الملونة والكتل القابلة لإعادة الاستخدام.

لكن هناك الكثير. دعنا نستكشف بالتفصيل الإضافات والتغييرات الرئيسية لواجهة المحرر.

واجهة مُحسَّنة لمحرر الموقع ووضع التصفح

مع WordPress 6.2 ، تم إدخال العديد من التحسينات على واجهة المحرر في جوهرها. يؤثر التحديث الأول والأكثر إثارة للاهتمام على واجهة محرر الموقع. بفضل وضع التصفح الجديد ، أصبح الآن من السهل التنقل بين القوالب وأجزاء القوالب.

تتيح لك الواجهة الجديدة أيضًا إضافة قالب جديد أو جزء قالب مباشرةً من الشريط الجانبي للمحرر بالنقر ببساطة على رمز علامة الجمع (+) الموجود على يمين عنوان القائمة.

وفقًا لرايان ويلشر ، المساهم في Wp Core and Documentation ، "لا يزال العمل على هذه الميزة مستمرًا وسيستمر في التحسن مع إصدار إصدارات Gutenberg الجديدة."

أصبح سير العمل الآن أكثر سلاسة وسلاسة. لبدء تحرير جزء القالب / القالب الحالي ، ما عليك سوى النقر فوق الزر تحرير في القائمة اليسرى ، أو على معاينة القالب في منتصف الصفحة.

وضع حر الهاء

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

يمكنك تنشيط هذه الميزة في لوحة الخيارات التي تظهر بالنقر فوق رمز علامة القطع (ثلاث نقاط) في الزاوية اليمنى العليا.

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

المفتش المبوب بلوك

يقدم WordPress 6.2 أداة Block Inspector جديدة تهدف إلى تنظيم الشريط الجانبي عن طريق تقسيم عناصر التحكم في الإعدادات إلى لوحات منفصلة.

يتم الآن تقسيم إعدادات الحظر إلى علامات تبويب لفصل إعدادات النمط عن إعدادات الحظر الأخرى.

سيتم عرض علامات التبويب Block Inspector في حالة توفرها بالترتيب التالي:

• عرض القائمة: يتضمن عناصر تحكم لإدارة العناصر الفرعية للكتلة ، مثل القوائم الفرعية والارتباطات الموجودة في كتلة التنقل
• الإعدادات: يتضمن إعدادات التكوين غير المتعلقة بمظهر الكتلة
• المظهر: يتضمن الإعدادات المتعلقة تحديدًا بتصميم الكتلة الحالية ، مثل الطباعة والألوان

يعد هذا تحسنًا ملحوظًا في قابلية استخدام الواجهة ، خاصةً للكتل المتقدمة التي تحتوي على العديد من خيارات التكوين مثل Group Block أو Navigation Block.

لاحظ أن:

• لا يعرض المفتش الجديد إلا علامة تبويب عندما تحتوي على عناصر لعرضها.
• إذا كانت علامة التبويب Settings (الإعدادات) تحتوي فقط على اللوحة Advanced ، فسيتم نقلها إلى علامة التبويب Appearance.
• إذا كان لدى Block Inspector علامة تبويب واحدة فقط ، فسيتم عرضها كما كانت قبل WordPress 6.2.

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

أجزاء القالب الملونة والكتل القابلة لإعادة الاستخدام

ولتمييزها بسهولة أكبر عن المجموعات والكتل ، يتم الآن تمييز أجزاء القالب والكتل القابلة لإعادة الاستخدام بلون مختلف في عرض القائمة و Block Inserter و Block Toolbar وفي لوحة المحرر.

يحدث هذا في كل من محرر الموقع ومحرر المنشورات ، كما هو موضح في الصورة أدناه.

مُدخل بلوك مُجدَّد

يتأثر Block Inserter بالعديد من التغييرات التي تعمل على تحسين تجربة التحرير الإجمالية بشكل كبير.

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

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

علامة تبويب الوسائط في Block Inserter ”العرض =” 1296 ″ height = ”1420 ″ class =” size-full wp-image-148375 ″> علامة تبويب الوسائط الجديدة في Block Inserter

داخل علامة التبويب ، ينقلك زر مكتبة الوسائط المفتوحة إلى WordPress Media Lybrary.

تكامل Openverse في Block Inserter

Openverse هي أداة تهدف إلى مشاركة أعمال المجال العام أو المرخصة بشكل مفتوح للاستخدام من قبل أي شخص. الآن ، مع WordPress 6.2 ، تم دمج Openverse في Block Inserter.

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

للحصول على التفاصيل الفنية ، راجع طلب سحب تكامل Openverse.

ترحيل الأدوات لحظر السمات

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

دعنا نكتشف كيف يعمل.

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

الآن قم بتغيير الموضوع إلى Twenty-Three. افتح محرر الموقع ، واختر قالبًا لتحريره ، وأضف جزء قالب.

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

وهذا كل شيء. يمكنك الآن إدارة منطقة عنصر واجهة المستخدم السابقة مثل أي جزء قالب آخر.

تفاصيل المستند وعرض القائمة مجتمعين

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

بدءًا من WordPress 6.2 ، تم نقل عرض القائمة والتفاصيل إلى لوحة نظرة عامة على المستند واحدة مقسمة إلى علامتي تبويب: عرض القائمة والمخطط التفصيلي .

يجب أن يوفر هذا التغيير طريقة أسهل لإدارة المستند.

قدرات الكتلة الموسعة

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

دعنا نلقي نظرة على التغييرات الرئيسية بالتفصيل.

التحرير القائم على القائمة لكتلة التنقل

مع إصدار WordPress 6.2 ، من الممكن تغيير ترتيب عناصر Navigation Block من عرض القائمة في الشريط الجانبي لإعدادات الحظر.

سيؤدي النقر فوق عنصر القائمة إلى نقلك إلى الشريط الجانبي للإعدادات لرابط الصفحة المحدد ، حيث ستتمكن من تحرير تفاصيل الارتباط ، بما في ذلك التسمية وعنوان URL والوصف وعنوان الارتباط والارتباط.

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

قفل التنقل

هناك تحسين آخر في مجموعة التنقل وهو القدرة على قفل تحرير القائمة بطريقة أكثر دقة. يمكنك الآن تقييد التحرير وتعطيل الحركة ومنع الإزالة ، بينما مع WordPress 6.1 ، كانت خيارات التحرير المقيد وتعطيل الحركة متاحة فقط.

بالإضافة إلى ذلك ، يمكن أيضًا تطبيق الخيارات المحددة على الكتل الداخلية (الروابط والقوائم الفرعية).

إضافة / إزالة التسميات التوضيحية من شريط أدوات الحظر

يتيح زر إضافة / إزالة تسمية توضيحية جديدًا للمستخدمين التحكم في التسميات التوضيحية من شريط أدوات الحظر لعدة كتل (الصوت والفيديو والصورة).

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

تحسينات على قائمة الصفحات

اثنين من التحسينات التي تنطوي على كتلة قائمة الصفحة.

أولاً ، يمكن الآن توسيع كتلة قائمة الصفحة لإظهار قائمة الصفحات في لوحة عرض القائمة.

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

عنصر نائب جديد لكتلة المجموعة

يعرض الآن العنصر النائب Group Block منتقي التباينات عند إضافة الكتلة إلى محتوى الصفحة.

دعم كتلة المواقع اللزجة

يقدم WordPress 6.2 ميزة دعم كتلة الموضع الجديدة ، بدءًا من الموضع الثابت.

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

يمكن لمطوري السمات تمكين وضع ثابت على سماتهم باستخدام ميزة appearanceTools في theme.json . إذا كنت تريد مزيدًا من التحكم الدقيق في أدوات المظهر ، فيمكنك أيضًا ضبط الخاصية settings.position.sticky على true .

يمكنك تمكين الوضع الثابت في لوحة الموضع بالشريط الجانبي للتحكم في المفتش.

مع تشغيل الموضع الثابت ، تحصل علامة HTML على فئة is-position-sticky ، وتنطبق بعض قواعد CSS على العنصر المقابل:

 .wp-container-6 { top: calc(0px + var(--wp-admin--admin-bar--position-offset, 0px)); position: sticky; z-index: 10; }

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

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

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

تحسينات إضافية لمنع تجربة التحرير

تتضمن بعض الترقيات البارزة الأخرى لمنع التحرير ما يلي:

• يمكنك الآن سحب وإسقاط الصور في فقرة فارغة لاستبدالها بكتلة صورة.
• تم تجميع عناصر التحكم في الطباعة في لوحات. هذا يجعل واجهة Styles أكثر اتساقًا مع واجهة الإعدادات ويحسن قابليتها للاستخدام ، حيث يمكنك الآن إظهار وإخفاء عناصر التحكم كما هو الحال في واجهة إعدادات الحظر.

  

• أصبح من الممكن الآن تعديل تباعد الأحرف في كتل العناوين مباشرة في واجهة الأنماط العامة.
• يمكنك الآن تعيين الخلفية والرابط ولون النص لكتلة التقويم.
• تم تقديم فئتين جديدتين من فئات نماذج قوالب اللافتات والتذييلات لتعكس بشكل أفضل بنية صفحات الويب.
• من الممكن الآن إكمال الروابط تلقائيًا في أي كتلة باستخدام [[ اختصار. قبل هذا التغيير ، كان على الكتل الإعلان صراحة عن دعم الإكمال التلقائي للرابط باستخدام __experimentalSlashInserter .
• يتيح لك control + option الجديد + 1 - 6 اختصار لوحة المفاتيح تحويل فقرة إلى عنوان.
• تدعم مجموعة قائمة الصفحات الآن جميع خيارات الطباعة ، بما في ذلك عائلة الخط وحجم الخط والمظهر وارتفاع الخط وتباعد الأحرف والزخرفة وحالة الأحرف.

  

  

أدوات التصميم المحسنة

تعمل العديد من الميزات والتحسينات الجديدة المقدمة مع WordPress 6.2 على تحسين إمكانيات التصميم والتصميم لنظام إدارة المحتوى. فيما يلي قائمة بالميزات الأكثر إثارة للاهتمام المتعلقة بالتصميم والتي تأتي مع 6.2 ؛ سنقوم بالتفصيل كل مزيد من الأسفل.

كتاب النمط

يقدم WordPress 6.2 ميزة كتاب الأنماط الجديدة التي تتيح للمستخدمين معاينة أي كتلة يمكن استخدامها على مواقع الويب الخاصة بهم دون الحاجة إلى إضافة هذه الكتل إلى جزء قالب / قالب. يمكنك تشغيل Style Book بالنقر فوق الزر Open Style Book (رمز العين) الذي يظهر الآن في رأس Styles ضمن الأنماط العامة.

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

تعمل واجهة Style Book الجديدة على تبسيط عملية التصميم من خلال إجراء معاينات لكل نمط كتلة متاح في موقع مركزي واحد.

من وجهة نظر فنية ، يتم إنشاء الواجهة الجديدة بواسطة مكون StyleBook جديد تمت إضافته إلى @wordpress/edit-site لعرض معاينة لكل كتلة مسجلة في iframe (انظر أيضًا PR # 45960).

توفر نفس الواجهة أيضًا معاينات للكتل الفردية. كمثال ، تُظهر الصورة التالية معاينة أداة تقويم مخصصة.

يمكن للمطورين إخفاء كتلة من إدراجها ومعاينتها بطريقتين. أولاً ، يمكنك تعيين supports.inserter إلى false في block.json :

 { "supports": { "inserter": false } }

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

الظلال في الأنماط العامة

باستخدام WordPress 6.2 ، أصبح من الممكن الآن إضافة الظلال وتخصيصها لبعض الكتل باستخدام Global Styles أو theme.json (حتى كتابة هذه السطور ، تتوفر ميزة الظل فقط لكتلة Button).

أولاً ، في السمات التي تدعم هذه الميزة ، يمكنك إضافة الظلال من واجهة الأنماط العالمية.

لرؤيتها أثناء العمل ، قم بتنشيط موضوع Twenty-Three ، وانتقل إلى Styles > Blocks > Button ، وانقر على زر Shadow .

تسمح لك نافذة الظل المنبثقة بتحديد ظل من الإعدادات المسبقة للسمات.

يمكن لمطوري السمات والمستخدمين المتقدمين أيضًا إضافة ظل للكتل باستخدام theme.json . يضيف التعريف التالي ظلًا أسود بحجم 4 بكسل إلى كتل الأزرار:

 "styles": { "blocks": { "core/button": { "shadow": "4px 4px #000000" } } },

يمكنك أيضًا تحديد الإعدادات المسبقة لمنح مستخدمي السمات القدرة على تحديد واحد من واجهة الأنماط:

 "settings": { "shadow": { "presets": [ { "shadow": "4px 4px #FF0000", "name": "Red", "slug": "red" }, { "shadow": "4px 4px #00FF00", "name": "Green", "slug": "green" }, { "shadow": "4px 4px #0000FF", "name": "Blue", "slug": "blue" } ] }, }

بمجرد التحديد ، تظهر إعداداتك المسبقة في لوحة Shadow في أنماط الكتلة.

يمكنك أيضًا اختيار قيمة إعداد مسبق واستخدامه كإعدادات افتراضية للكتلة:

 "styles": { "blocks": { "core/button": { "shadow": "var(--wp--preset--shadow--blue)" } } }

التحكم في أبعاد الارتفاع الأدنى الجديدة

بدءًا من الإصدار 6.2 من WordPress ، توفر الآن لوحة الأبعاد للشريط الجانبي لإعدادات الكتل لمجموعتي تجميع ونشر المحتوى عنصر تحكم حد أدنى جديد للارتفاع يتم تمكينه افتراضيًا في السمات باستخدام ميزة appearanceTools .

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

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

يمكن للمطورين إضافة دعم للحد الأدنى من الارتفاع إلى السمات عن طريق إضافة إعداد minHeight إلى theme.json :

 { "settings": { dimensions: "minHeight": true } }

يمكنك أيضًا استخدام خاصية appearanceTools الأدوات:

 { "settings": { "appearanceTools": true } }

يمكن أيضًا استخدام الخاصية minHeight الجديدة لتعيين قيمة محددة مباشرةً في theme.json :

 { "styles": { "blocks": { "core/post-content": { "dimensions": { "minHeight": "80vh" } } } } }

يمكن لمطوري الكتل إضافة الخاصية supports.dimensions.minHeight إلى ملف block.json الخاص بهم وضبط قيمتها على true . بالنسبة للكتل الثابتة ، سيتم تخزين قاعدة CSS min-height كنمط مضمّن ، بينما بالنسبة للكتل الديناميكية ، سيتم تضمينها في سمة النمط التي يتم إرجاعها بواسطة get_block_wrapper_attributes .

CSS مخصص في لوحة الأنماط

كانت إحدى الميزات المفقودة في محرر الموقع مقارنةً بمخصص القوالب هي القدرة على إضافة أنماط CSS مخصصة. يملأ WordPress 6.2 الفجوة والآن تتضمن واجهة الأنماط العالمية حقل نص لإضافة قواعد CSS مخصصة لن يتم استبدالها عند تحديث قالبك.

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

لدعم CSS المخصص ، تمت إضافة خاصية styles.css جديدة إلى theme.json .

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

يمكنك أيضًا إضافة CSS مخصص لكل كتلة في theme.json باستخدام خاصية styles.blocks.block.css :

 "styles": { "blocks": { "core/button": { "css": "background: #FF0000" } } }

يمكنك أيضًا استخدام & للعناصر المتداخلة والمحددات الزائفة.

للحصول على عرض أقرب لميزة CSS المخصصة الجديدة ، راجع أيضًا Custom CSS للأنماط العامة ولكل كتلة.

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

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

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

ثم حدد كتلة أخرى واختر لصق النمط . سيتم تطبيق الأنماط المنسوخة تلقائيًا على الكتلة الثانية.

لاحظ أن هذه الميزة متاحة فقط على المواقع الآمنة (https) في المتصفحات الداعمة. للحصول على تفاصيل إضافية ، راجع طلب السحب.

تطبيق كتلة التغييرات على الصعيد العالمي

يقدم WordPress 6.2 أيضًا زر تطبيق عالميًا ضمن لوحة Advanced للكتل الفردية التي تسمح لك بدفع تغييرات نمط الكتلة إلى الأنماط العالمية وتطبيق هذه التغييرات عبر موقع الويب بأكمله.

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

تجربة تصميم محسنة مع متخيلات التباعد

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

أولاً ، تظهر مصورات التباعد الآن بمجرد أن تحوم فوق التحكم في الهامش أو الحشو.

ثانيًا ، يخفي Spacing Visualizer الآن تلقائيًا شريط أدوات الحظر بمجرد أن تحوم فوق إعداد التباعد بحيث يمكنك معاينة إعدادات الهامش والحشو الجديدة الخالية من فوضى شريط أدوات الحظر.

هذه تغييرات صغيرة ولكنها مهمة تؤثر على عدد كبير من الكتل الأساسية.

التغييرات للمطورين

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

واجهة برمجة تطبيقات HTML جديدة

يقدم WordPress 6.2 معالج علامات HTML ، وهو محلل متوافق مع HTML5 يوفر طريقة آمنة للعثور على علامات HTML معينة وإضافة السمات أو إزالتها أو تحديثها عبر PHP. يعد معالج علامات HTML المكون الأول في واجهة برمجة تطبيقات معالجة HTML الجديدة.

تسهل واجهة برمجة التطبيقات الجديدة أداء المهام المعقدة سابقًا والتي غالبًا ما تتطلب استخدام التعبيرات العادية.

في المثال التالي ، نضيف ببساطة سمة alt إلى علامة img :

 $html = '<img src="/my-image.jpg" />'; $p = new WP_HTML_Tag_Processor( $html ); if ( $p->next_tag() ) { $p->set_attribute( 'alt', 'Hello WordPress 6.2' ); } echo $p->get_updated_html();

ينتج عن هذا الرمز علامة img التالية:

 <img alt="Hello WordPress 6.2" src="/my-image.jpg">

تنتقل طريقة $p->next_tag() إلى العلامة التالية المتوفرة في HTML. كما أنه يقبل أيضًا اسم علامة أو فئة CSS أو كليهما للعثور على علامات محددة ، كما هو موضح في المثال أعلاه.

لتحرير علامات HTML ، عليك أولاً تحديد علامة الهدف:

 $p->next_tag();

بمجرد تحديد العلامة الهدف ، يمكنك استخدام طرق API لإجراء عدة عمليات:

• $p->get_tag()
• $p->set_attribute()
• $p->get_attribute()
• $p->remove_attribute()
• $p->add_class()
• $p->remove_class()

يمكنك تعيين سمة النمط:

 $html = '<a href="https://example.com">example.com</a>'; $p = new WP_HTML_Tag_Processor( $html ); if ( $p->next_tag( 'a' ) ) { $p->set_attribute( 'style', 'text-decoration: wavy underline purple;' ); } echo $p->get_updated_html();

يمكنك أيضًا إضافة أو إزالة فئة أو سمة. في الكود التالي ، نضيف فئة مخصصة إلى علامة h1 :

 $html = '<div><h1>Page Title</h1></div>'; $p = new WP_HTML_Tag_Processor( $html ); if( $p->next_tag( 'h1' ) ) { $p->add_class( 'title' ); } echo $p->get_updated_html();

يمكنك بعد ذلك إعادة صدى العلامة المحدثة أو إرجاعها باستخدام طريقة $p->get_updated_html() .

للحصول على عرض أقرب لواجهة HTML API الجديدة ، تحقق من هذا البرنامج التعليمي التفاعلي لـ PHP من Adam Zielinski ، ملتزم WordPress Core.

واجهة برمجة تطبيقات الأنماط وخاصية template_types جديدة

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

باستخدام WordPress 6.2 ، تشتمل واجهة برمجة تطبيقات Patterns الآن على خاصية template_types جديدة للسماح لك بتحديد القوالب التي يمكن استخدام نمط كتلة معين فيها.

يسلط Jorge Costa الضوء على أن هذا تحديث للواجهة الخلفية فقط ولا توجد حاليًا وظائف UX مقابلة. ومع ذلك ، يمكننا أن نتوقع رؤية تطبيقات متطورة لهذه الميزة مع WordPress 6.3:

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

من الناحية الفنية ، تم تعديل الوظيفة register_block_pattern() لتشمل معلمة template_types جديدة ، وهي عبارة عن مصفوفة من السلاسل تحتوي على أسماء القوالب التي يقصد بها نمط الكتلة.

تم تعديل واجهة برمجة تطبيقات REST أيضًا لإرجاع أنواع القوالب الخاصة بنمط الكتلة إذا تم تحديد واحد على الأقل.

React v18.0 ووضع التزامن

يشحن WordPress 6.2 أيضًا إصدارًا جديدًا من مكتبة React ، تم تحديثه الآن إلى الإصدار 18.0. يأتي الإصدار الجديد مع واجهات برمجة تطبيقات جديدة وميزات وتحسينات وإصلاحات للأخطاء. تتمثل إحدى الميزات الرئيسية التي تأتي مع React v18.0 في تقديم وضع التزامن ، "آلية جديدة خلف الكواليس تمكن React من إعداد إصدارات متعددة من واجهة المستخدم الخاصة بك في نفس الوقت".

تتمثل إحدى الخصائص الرئيسية للوضع المتزامن في React في أنه قابل للمقاطعة:

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

الميزة الرئيسية هي أن واجهة المستخدم تستجيب لإدخال المستخدم على الفور ، بالتزامن مع الوظيفة التي لا تزال تعمل في الخلفية.

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

تغييرات إضافية للمطورين

تشمل التغييرات الملحوظة الأخرى التي يجب على المطورين الانتباه إليها ما يلي:

• يقدم WordPress 6.2 مرشح JavaScript جديدًا يمكن استخدامه لتصفية إعدادات الحظر قبل عرض المحرر على الشاشة. يسمح عامل التصفية blockEditor.useSetting.before الجديد للمطورين أيضًا بتعديل الإعدادات بناءً على موقع الحظر ودور المستخدم الحالي والكتل المجاورة والمزيد. للحصول على معلومات إضافية وأمثلة للاستخدام ، راجع تخصيص الإعدادات لأي كتلة في WordPress 6.2.
• تم تقديم خاصية skipBlockSupportAttributes جديدة لاستبعاد السمات والأنماط المتعلقة بدعم الكتلة في مكون ServerSideRender .
• تتيح واجهة برمجة تطبيقات theme.json الجديدة الآن تصميم أشكال مختلفة من الكتلة الأساسية الحالية من theme.json .
• يتم الآن تضمين خطوط Google محليًا ولا يتم جلبها من عناوين Google في السمات المجمعة من Twenty Twelve إلى Twenty Seventeen.

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

ملخص

يقربنا WordPress 6.2 من نهاية المرحلة الثانية من مشروع Gutenberg المسمى Customization. ولكن ، كما يشير Matias Ventura ، هذا لا يعني أن العمل على التخصيص قد اكتمل وفي الإصدارات المستقبلية. كما هو الحال دائمًا ، يمكننا توقع تحسينات إضافية للمحرر بناءً على التعليقات الواردة من المجتمع.

في هذا المنشور ، استكشفنا بعض الميزات الرئيسية والتحسينات وإصلاحات الأخطاء التي تأتي مع WordPress 6.2. ولكن هناك الكثير في 6.2. مع وجود عشرة إصدارات من مكون Gutenberg الإضافي في النواة - من 14.2 إلى 15.1 - سنرى وضع تصفح جديد ، ومفتش كتلة مبوب ، وعناصر واجهة مستخدم لمنع ترحيل السمات ، وواجهات برمجة تطبيقات جديدة ، وأطنان من التحسينات وإصلاحات الأخطاء. وستكون هناك أيضًا تحسينات على إمكانية الوصول والتدويل.

وإذا كنت تحب WordPress وترغب في اكتساب مهارات تطوير WordPress جديدة أو اختبارها وتقديم مساهمات إلى CMS ، فتأكد من استخدام DevKinsta ، مجموعة تطوير WordPress المحلية المجانية تمامًا من Kinsta ، لاختبار القيادة.

الآن ، إليكم: هل سبق لكم اختبار الإصدار الجديد في بيئة التطوير الخاصة بكم؟ ما هي الميزات التي تعجبك أكثر في WordPress 6.2؟ شارك افكارك في قسم التعليقات في الاسفل.