أصبح وورد بريس 5.0 قاب قوسين أو أدنى ، ويشعر الكثير منا بالحماس والقلق في نفس الوقت. يُحدث Gutenberg تغييرًا كبيرًا في كيفية استخدامنا لـ وورد بريس ، وهناك بالتأكيد بعض القلق بشأن ما سيحدث لمواقعنا الإلكترونية إذا كان علينا تحديث منشآتنا دون اختبارها مسبقًا. لكن لا تقلق ، لدينا منشور حول كيفية تعطيل محرر Gutenberg وورد بريس (حتى لو كان مؤقتًا فقط) من أجل منع السمات والمكونات الإضافية غير المدعومة من كسر مواقعنا الإلكترونية.
جرب نسخة تجريبية مجانية
قد تفاجأ بمعرفة أننا نستخدم بالفعل وورد بريس 5.0. في الواقع ، نحن! كما ذكر مات في مدونة Make وورد بريس :
إذا احتفظنا بالإصدار 5.0 بدقة 4.9.8 + Gutenberg ، فسنحصل على إصدار رئيسي وغير حدث من حيث الكود الجديد. كل هذا تم اختباره في المعركة. من بعض النواحي ، يعد الإصدار 5.0 فعليًا بالفعل في البرية ، مع قيام بعض المضيفين التطلعيين بالفعل بتثبيت وتنشيط Gutenberg للتثبيتات الجديدة.
هذا يعني أن لدينا بالفعل وورد بريس 5.0 يعمل على خوادمنا: إنه وورد بريس 4.9.8 فقط ، مع Gutenberg في جوهره. في الواقع ، هذا ليس كل شيء ، لأن وورد بريس 5.0 يأتي مع إدخال إضافي ، وهو السمة الافتراضية الجديدة Twenty Nineteen .
قالب Twenty Nineteen وورد بريس Theme
قالب Twenty Nineteen وورد بريس Theme
لذلك دعونا نتعمق ونرى ما هو الجديد.
قد يكره البعض منكم جوتنبرج. علاوة على ذلك ، فإن الجدل حول المحرر الجديد لم ينته بعد ، لكن ضع في اعتبارك النطاق المعلن لـ Gutenberg :
تعمل هذه الكتل المخصصة على تغيير كيفية تفاعل المستخدمين والمطورين والمضيفين مع وورد بريس لبناء محتوى ويب غني بطريقة أسهل وأكثر سهولة ، وإضفاء الطابع الديمقراطي على النشر والعمل للجميع ، بغض النظر عن القدرة التقنية .
هذا ما يهدف إليه جوتنبرج ، وتقدم شركة Twenty Nineteen بالأشياء خطوة إلى الأمام ، حيث يتم بناؤها مع Gutenberg و Gutenberg. إنها سمة تدوين بسيطة تعتمد على الطباعة مع تخطيط من عمود واحد ، ويمكن استخدامها لإنشاء مجموعة واسعة من مواقع الويب ، بدءًا من المدونات الشخصية إلى مواقع الويب للشركات الصغيرة.
الكتابة عن Twenty Nineteen تعني في الغالب أننا نكتب عن Gutenberg. في Twenty Nineteen Gutenberg يسمح للمستخدمين ليس فقط بإنشاء محتوى ثري ولكن حتى لإنشاء مواقع الويب الخاصة بهم بالكامل في المحرر. وفقًا لألان كول في مدونة Make وورد بريس ،
يمنح Gutenberg المستخدمين مستوى غير مسبوق من الحرية لتخصيص تخطيط وتصميم مواقعهم. من أجل تحقيق رؤيتهم بالكامل ، سيحتاج المستخدمون إلى جيل جديد من السمات المرنة ، المصممة للاستفادة من الحرية الإبداعية التي يوفرها Gutenberg.
مع وضع ذلك في الاعتبار ، سيتم إطلاق وورد بريس 5.0 بسمة افتراضية جديدة تمامًا: Twenty Nineteen
في موضوع Twenty Nineteen ، يعد Gutenberg أكثر من مجرد مُنشئ محتوى ، إنه مُنشئ مواقع ، وسيسمح لمستخدمي وورد بريس ببناء مواقعهم الإلكترونية بالكامل بالاستفادة من الكتل. وإذا لم يكن Gutenberg هو الشيء المفضل لديك حتى الآن ، فإن معظم المكونات الإضافية الشهيرة لبناء الصفحات تضيف أيضًا دعمًا لـ Gutenberg.
(قراءة مقترحة: مقدمة للموضوع العشرين )
في موضوع Twenty Nineteen ، يعد Gutenberg أكثر من مجرد منشئ محتوى ، إنه منشئ مواقع. 🔨
انقر للتغريد
يجب أن يتبع Twenty Nineteen خطة إصدار الإصدار الرئيسي الجديد من وورد بريس. ومع ذلك ، يجب إصدار وورد بريس 5.0 في 19 نوفمبر ، ومن المحتمل ألا يكون إصدار العمل من Twenty Nineteen جاهزًا بحلول ذلك التاريخ. اطلع على جميع تواريخ الإصدار المحتملة لـ وورد بريس 5.0 . على أي حال ، السمة متاحة للتنزيل على Github ، وستبقى هناك حتى يتم دمجها في النواة.
ويستند عشرين تسعة عشر على كل من _s و غوتبورغ-بداية-موضوع ويأتي مع ساس في الداخل. بمجرد حصولك على حزمة .zip ، قم باستخراج السمة وتحميل / نقل مجلد السمة إلى /wp-content/themesدليل تثبيت التطوير الخاص بك. يمكنك أيضًا تحميله من لوحة تحكم وورد بريس الخاصة بك.
أضف موضوعًا جديدًا
تحميل قالب جديد من لوحة تحكم وورد بريس
يمكن لعملاء Kinsta تثبيته في بيئات التدريج الخاصة بهم . إذا لم تكن مع Kinsta ، فلا يزال بإمكانك تثبيته على جهازك المحلي .
تم تثبيت Twenty Nineteen بنجاح
تم تثبيت Twenty Nineteen بنجاح
يؤكد التخطيط أحادي العمود على المحتوى ويتناسب بشكل أفضل مع الكتل ذات العرض الكامل والواسع. يدعم المظهر الآن الشريط الجانبي للتذييل ويأتي مع ثلاث قوائم تنقل: القائمة الأساسية وقائمة الروابط الاجتماعية ، وكلاهما موجود في رأس الصفحة ، وقائمة التذييل ، الموجودة في التذييل.
عشرون وتسعة عشر رأسية
عنوان الموقع ووصف الموقع والقوائم في رأس Twenty Nineteen
تبدو صفحة المدونة كصفحة مدونة عادية مع تمكين الصور المميزة. تُظهر المنشورات والصفحات المنفردة أفضل إمكانات الإصدار الحالي من Gutenberg كمنشئ موقع.
نظرًا لأنه يعتمد تمامًا على Gutenberg ، فإن ميزات Twenty Nineteen تعتمد في الغالب على دورة تطوير Gutenberg وعلى مدى توفر الكتل. يمكننا إضافة كتل عناصر واجهة المستخدم ، وكتل الرموز القصيرة ، والمعارض ، ورمز HTML ، وما إلى ذلك. ومع ذلك ، فإن كل هذه الكتل بعيدة كل البعد عن تغطية جميع احتياجاتنا. لكن لحسن الحظ ، لدينا العديد من المكونات الإضافية التي تسمح لنا بإضافة كتل جديدة إلى Gutenberg ، مثل Atomic Blocks و Advanced Gutenberg و Stackable . حتى أن هناك مشاريع مثل Gutenberg Cloud التي ظهرت.
إذا كنت تعتقد أن الموضوع يبدو ضئيلًا للغاية ، ففكر في أن Twenty Nineteen لا يزال قيد التنفيذ. لسنا متأكدين مما إذا كان سيتم دمجه في النواة بحلول الوقت الذي سيتم فيه إصدار وورد بريس 5.0 ، ويمكننا توقع العديد من الإضافات وحلول الأخطاء في المستقبل المقبل. علاوة على ذلك ، هناك الكثير من المشكلات التي لم يتم حلها بعد ، والميزات التي يجب تنفيذها. يدعم الآن Twenty Nineteen القوائم الفرعية ولكن ليس الرؤوس المخصصة ورؤوس الفيديو . على أي حال ، قد نتوقع إضافة ميزات إضافية في فترة زمنية معقولة.
إذا كنت مهتمًا بحالة الموضوع ، فراجع القائمة الكاملة للمشكلات على Github .
من خارج الصندوق ، يوفر Gutenberg دعمًا أساسيًا لأنماط الكتلة في السمات ، ويمكن لمطوري السمات تجاوز أنماط Gutenberg الافتراضية بأنماطهم المخصصة. لكن يمكن للمطورين أيضًا حذف الأنماط المخصصة تمامًا وقرر الاعتماد حصريًا على Gutenberg لتصميم كتل في مقدمة الموقع.
إن وجود محرر يبدو وكأنه المحتوى الناتج يحسن تجربة الكتابة للمؤلف ، ويسمح للجميع بالشعور بالراحة مع واجهة المستخدم.
على أي حال، وأساليب بعض غوتنبرغ وملامح العرس تتطلب الموضوعات لإضافة صراحة الدعم لهم، وهذا يمكن أن يتم عن طريق الاتصال add_theme_supportفي functions.phpملف عندما after_setup_themeيتم تشغيل العمل. فيما يلي مثال على تنفيذ الميزة:
function mytheme_setup() {
// Add support for Block Styles
add_theme_support( 'wp-block-styles' );
}
add_action( 'after_setup_theme', 'mytheme_setup' );فيما يلي قائمة بمجموعة مختارة من ميزات Gutenberg هذه ، وبعضها مدعوم أيضًا بواسطة Twenty Nineteen. ستجد القائمة الكاملة للميزات في دليل جوتنبرج .
كان أحد أهداف الفريق وراء Gutenberg هو بناء نظام مرن للتصميم داخل السمات ، والاقتراب قدر الإمكان من “التكافؤ البصري بين الواجهة الأمامية والمحرر”. والغرض من ذلك هو إعطاء المستخدم معاينة دقيقة للمحتوى كما سيبدو في الموقع الأمامي.
لتحقيق هذا الهدف ، كان على الفريق أن يفصل بين أنماط العرض والأساليب الهيكلية. افتراضيًا ، لا يتم تحميل أنماط العرض على الواجهة الأمامية ، وذلك لتجنب التأثير على مظهر الموقع. على أي حال ، يمكن للقوالب الجديدة الاستفادة من أساليب عرض Gutenberg ببساطة عن طريق تمكينها من خلال التسجيل التالي (انظر الكتيب للحصول على مزيد من التفاصيل):
// Add support for Block Styles
add_theme_support( 'wp-block-styles' );كما قد تتوقع ، تدعم Twenty Nineteen أنماط كتلة Gutenberg . تبدو صفحة المنشور الفردية في الواجهة الأمامية تشبه إلى حد كبير صفحة منشور التحرير ، مع الاختلاف الوحيد للصورة المميزة ، التي تظهر على سطح المكتب كصورة خلفية تغطي منفذ العرض بالكامل. تُظهر الصورة أدناه Gutenberg أثناء العمل في النهاية الخلفية.
تريد أن تعرف كيف زدنا من حركة المرور لدينا أكثر من 1000 ٪؟
انضم إلى أكثر من 20000 آخرين ممن يتلقون رسائلنا الإخبارية الأسبوعية مع نصائح من الداخل حول وورد بريس!
إشترك الآن
محرر Gutenberg وورد بريس
محرر Gutenberg وورد بريس في وضع ملء الشاشة
وهنا نفس المنشور على الموقع الأمامي.
صفحة منشور واحدة في Twenty Nineteen
صفحة منشور واحدة في Twenty Nineteen
يوفر Gutenberg أيضًا خيارين إضافيين للمحاذاة: محاذاة عريضة وكاملة العرض ، ولكن يمكنك تحديد محاذاة عريضة أو كاملة العرض فقط إذا كان قالبك يدعمهما . إذا كان الأمر كذلك ، فإن Gutenberg يعرض رمزين إضافيين للمحاذاة.
أزرار خيارات المحاذاة
أزرار محاذاة عريضة وكاملة في Gutenberg
الصورة أدناه يبين مركز محاذاة ، عرض على نطاق واسع و كامل العرض الصور في عشرين تسعة عشر.
خيارات المحاذاة
محاذاة المركز والعرض العريض والعرض الكامل مقارنة
يمكن لمطوري السمات إضافة دعم للمحاذاة العريضة والعرض الكامل من خلال تمكينهم في ملف الوظائف بعبارة واحدة:
// Add support for full and wide align images
add_theme_support( 'align-wide' );بمجرد أن نضيف دعمًا للمحاذاة العريضة والعرض الكامل ، يجب أن نوفر إعلانات CSS لفئتي CSS إضافيتين : alignfullو alignwide. يوفر Twenty Nineteen الأنماط التالية:
.entry-content > *.alignwide,
.entry-summary > *.alignwide {
margin-left: auto;
margin-right: auto;
}
@media only screen and (min-width: 768px) {
.entry-content > *.alignwide,
.entry-summary > *.alignwide {
margin-left: calc(1 * (100vw / 12));
margin-right: calc(1 * (100vw / 12));
max-width: calc(10 * (100vw / 12));
}
}
.entry-content > *.alignfull,
.entry-summary > *.alignfull {
margin-top: calc(2 * 1rem);
margin-right: 0;
margin-bottom: calc(2 * 1rem);
margin-left: 0;
max-width: 100%;
}
.entry-content .wp-block-image.alignfull img {
width: 100vw;
margin-left: auto;
margin-right: auto;
}ملاحظة: كن حذرًا عند استخدام هذا الخيار ، لأنه قد يتسبب في حدوث مشكلات إذا قمت بتبديل المظهر (اقرأ المزيد عن هذا الموضوع على Github ).
على نمط محرر هي ميزة عرض مع وورد 3.0 مما يسمح للمطورين موضوع لإضافة أنماط مخصصة للمحرر محرر TinyMCE. يدعم Gutenberg أيضًا هذه الميزة ، ولكنه يعمل بشكل مختلف عن المحرر الكلاسيكي ، الذي يقوم بتحميل الأنماط مباشرة في إطار iframe للمحرر. يضيف Gutenberg محددات CSS محددة ، لأنه لا يستخدم iframe.
هل تعاني من مشاكل التوقف و وورد بريس؟ Kinsta هو حل الاستضافة المصمم لتوفير الوقت! تحقق من ميزاتنا
يمكننا إضافة دعم لأنماط المحرر على النحو التالي:
// Add support for editor styles
add_theme_support( 'editor-styles' );
// Enqueue editor styles
add_editor_style( 'style-editor.css' );هذه الميزة مدعومة أيضًا من قبل Twenty Nineteen. يمكنك التعمق في هذا الموضوع في Editor Style في Gutenberg .
يوفر Gutenberg محددًا عامًا للألوان في لوحة Color Settings الخاصة بالمحرر. يمكن لمطوري السمات تحسين هذه الأداة عن طريق إضافة لوحات ألوان مخصصة تسمح للمستخدمين بالتقاط اللون المناسب للخلفية والنصوص بسرعة. هذه عملية من خطوتين:
أولاً ، علينا توفير مجموعة من الألوان:
add_theme_support( 'editor-color-palette', array(
array(
'name' => __( 'hot pink', 'themeLangDomain' ),
'slug' => 'hot-pink',
'color' => '#f865b0',
),
array(
'name' => __( 'classic rose', 'themeLangDomain' ),
'slug' => 'classic-rose',
'color' => '#fbcaef',
),
) );ثم يتعين علينا الإعلان عن الأنماط المقابلة في ورقة أنماط السمة:
.has-hot-pink-background-color {
background-color: #f865b0;
}
.has-hot-pink-color {
color: #f865b0;
}تبدأ أسماء الفئات بـ has-، متبوعةً بالعلامة اللونية في حالة الكباب ، وتنتهي بالسياق الذي يمكن أن يكون colorأو background-color. حاليًا ، لا يدعم Twenty Nineteen لوحات ألوان الكتل ، ولكن يمكننا تغيير ذلك بسهولة باستخدام سمة فرعية .
لوح ألوان الكتلة
لوحة ألوان مخصصة في جوتنبرج
بدلاً من ذلك ، إذا كنت ترغب في تعطيل لوحة ألوان مخصصة ، فيجب عليك إضافة السطر التالي إلى ملف وظائف السمة أو السمة الفرعية الخاصة بك:
add_theme_support( 'disable-custom-colors' );يمكن للسمة أيضًا تجاوز مجموعة أحجام الخطوط الافتراضية الخاصة بـ Gutenberg. فيما يلي مثال على الكود الذي يجب إضافته إلى ملف الوظائف:
add_theme_support( 'editor-font-sizes', array(
array(
'name' => __( 'extra-small', 'themeLangDomain' ),
'shortName' => __( 'XS', 'themeLangDomain' ),
'size' => 10,
'slug' => 'extra-small'
),
array(
'name' => __( 'small', 'themeLangDomain' ),
'shortName' => __( 'S', 'themeLangDomain' ),
'size' => 12,
'slug' => 'small'
),
array(
'name' => __( 'regular', 'themeLangDomain' ),
'shortName' => __( 'M', 'themeLangDomain' ),
'size' => 16,
'slug' => 'regular'
),
array(
'name' => __( 'large', 'themeLangDomain' ),
'shortName' => __( 'L', 'themeLangDomain' ),
'size' => 26,
'slug' => 'large'
),
array(
'name' => __( 'larger', 'themeLangDomain' ),
'shortName' => __( 'XL', 'themeLangDomain' ),
'size' => 36,
'slug' => 'larger'
),
array(
'name' => __( 'huge', 'themeLangDomain' ),
'shortName' => __( 'XXL', 'themeLangDomain' ),
'size' => 56,
'slug' => 'huge'
)
) );ستتم إضافة أحجام الخطوط الجديدة إلى منتقي حجم الخط في إعدادات نص Gutenberg.
أحجام الخطوط المخصصة في Gutenberg
أحجام الخطوط المخصصة في Gutenberg
بعد ذلك ، يجب أن نعلن عن الأنماط المقابلة في ورقة أنماط السمة. يجب أن يبدأ اسم الصنف بـ has-، متبوعًا باسم حجم الخط في حالة الكباب ، وينتهي بـ -font-size.
.has-huge-font-size {
font-size: 56px;
}لا يوفر Twenty Nineteen أحجام خطوط محددة ويعتمد على إعدادات Gutenberg الافتراضية.
ملاحظة: تذكر أنه لكي تعمل كل هذه التعليمات البرمجية ، يجب عليك ربطها after_setup_themeبالإجراء.
يمكن أن يعمل Twenty Nineteen بشكل جيد مع المدونات الشخصية ، ويمكن أن تفكر في الأمر وكأنه لوحة قماشية بيضاء أكثر من قالب وورد بريس الذي يعمل بكامل طاقته. قد يكون النهج البسيط للغاية مقيدًا بعض الشيء عندما يتعلق الأمر ببناء مواقع الويب للأعمال والتجارة الإلكترونية ، ولكن لا تقلق: يجب تنفيذ الميزات الجديدة قريبًا ، ويمكن أن نرى إصدارًا أكثر قوة من Twenty Nineteen قريبًا.
في غضون ذلك ، يمكنك أيضًا إلقاء نظرة على بعض السمات التي تدعم Gutenberg بالفعل. كتل ذرية ، GeneratePress ، Gutentype ، و Divi على سبيل المثال لا الحصر ، ولكن العديد من الآخرين يجب أن يأتي قريبًا. مع اقتراب وورد بريس 5.0 بسرعة كبيرة ، فإن دعم Gutenberg ليس خيارًا ، ويجب على مطوري السمات تبني محرر وورد بريس الجديد في أقرب وقت ممكن لمواصلة المنافسة.
هل قمت بتثبيت Twenty Nineteen أو أي موضوع يدعم Gutenberg؟ نود أن نسمع أفكارك في التعليقات أدناه.
وفر الوقت والتكاليف وحقق أقصى قدر من أداء الموقع من خلال:
مساعدة فورية من خبراء استضافة وورد بريس ، 24/7.
تكامل Cloudflare Enterprise.
يصل الجمهور العالمي إلى 28 مركز بيانات حول العالم.
التحسين من خلال مراقبة أداء التطبيقات المضمنة لدينا.
كل ذلك وأكثر من ذلك بكثير ، في خطة واحدة بدون عقود طويلة الأجل ، وعمليات الترحيل المدعومة ، وضمان استرداد الأموال لمدة 30 يومًا. تحقق من خططنا أو تحدث إلى قسم المبيعات للعثور على الخطة المناسبة لك.
