كيف تكون مبدعًا مع جوتنبرج: مراجعة وبعض الممارسات

كان هناك استدعاء لـ Gutenberg في إصدار الصيانة في WordPress 4.9.8 ، لذلك تمكن جميع المستخدمين من رؤية الإشعار التالي في لوحات المعلومات الخاصة بهم.

يشير هذا إلى أنه سيتم تمكين محرر Gutenberg افتراضيًا في WordPress 5.0 - Major Release. لذا يمكنك الآن إما تثبيت Gutenberg كمكوِّن إضافي ومعرفة كل إمكانياته للاستعداد لاستخدامه في إنشاء مشاركاتك أو تثبيت محرر كلاسيكي بدلاً من ذلك واستخدام هذا المحرر فقط حتى تجعل السمة والمكونات الإضافية متوافقة مع Gutenberg لتكون قادرًا على ذلك. لاستخدامه في المستقبل.

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

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

أنا كاتب وفي هذا المنشور أود أن أجرب فرص التحرير غير المحدودة لجوتنبرج عمليًا بالإضافة إلى إجراء مراجعة موجزة. دعنا نبدأ!

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

أولاً ، دعنا نتحقق من كتل Gutenberg الافتراضية والوظائف العامة المتاحة للكتاب.

بعد تثبيت Gutenberg وتنشيطه ، انتقل إلى المنشورات -> إضافة جديد وابحث فوق منطقة النص. على الجانب الأيسر سترى:

• رمز زائد ؛
• أزرار التراجع والإعادة ؛
• زر عدد الكلمات.

إذا سبق لك استخدام Microsoft Word لنظام التشغيل Windows ، أو فتح Office لـ Ubuntu Linux ، أو قمت للتو بنشر منشوراتك في محرر مستندات Google ، فأنت تعرف مدى ملاءمة وظيفة عدد الكلمات. في Gutenberg يمكنك الآن عد الكلمات والفقرات والكتل والعناوين. جرب هذا!

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

تحتوي العناصر المضمنة في Gutenberg على كتلة Inline Image فقط.

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

تتضمن كتل التنسيق التعليمات البرمجية و Classic و Custom HTML و Preformatted والمزيد من الخيارات.

بعد ذلك ، يمكنك تصفح عناصر التخطيط التي تتضمن زر ، وفاصل "المزيد" ، وفاصل الصفحة ، وبعض الكتل الأخرى المتاحة.

قم بتوسيع قسم الأدوات للتعرف على أنه يتضمن الرمز القصير والمحفوظات والفئات وأحدث التعليقات والمزيد من الكتل.

وأخيرًا ، يحتوي قسم Embeds على إمكانيات تضمين مقاطع الفيديو من مصادر مثل Vimeo و Spotify و Dailymotion و SoundCloud و YouTube و Twitter وغيرها الكثير.

قسم المعاينة والنشر

يحتوي قسم المعاينة والنشر على شيء مشابه لما كان عليه في المحرر الكلاسيكي وشيء جديد لن تجده إلا في Gutenberg.

الخيارات المعتادة:

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

يمكنك تحويل تحديد الرؤية من المنشورات العامة والخاصة والمحمية بكلمة مرور.

ويمكنك اختيار تنسيق المنشور من القائمة المنسدلة وفقًا لموضوعك.

الآن يمكنك أيضًا تحديد تاريخ النشر في التقويم.

الخيارات الجديدة:

الآن تتوفر خيارات Stick to the Front Page و Pending Review في قسم المستند مباشرةً مع خيارات الحالة والرؤية وتاريخ النشر وتنسيق المنشور.

هنا يمكنك أيضًا تحديد الفئات التي تناسب رسالتك ،

إضافة علامات ، تعيين صورة مميزة ،

اكتب مقتطفًا ، وقم إما بالسماح بالتعليقات أو تعطيلها وكذلك السماح أو عدم السماح بـ pings و trackbacks.

برامج تحرير النصوص والمرئيات - مخفية الآن

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

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

خيارات الحظر

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

يمكنك أيضًا اختيار ألوان الخلفية والنص لمنشورتك

بالإضافة إلى إضافة فئة CSS إضافية إذا لزم الأمر.

لنقم بإنشاء مشاركة في المعرض!

لذلك أريد أن أحاول إنشاء منشور باستخدام Gutenberg وأضيف كتلة جديدة الآن.

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

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

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

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

يمكنني الآن إضافة تسمية توضيحية إلى كل صورة من الصور التي اخترتها ثم النقر فوق الزر "إدراج معرض".

الآن المعرض جاهز.

يمكنك تغيير نوع الكتلة على الفور

وتحويل المعرض إلى صورة

وكذلك - صورة إما لمعرض أو ملف.

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

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

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

الآن عندما تبدأ البث المباشر (انقر فوق الزر "عرض المنشور" -> سيؤدي هذا إلى فتح المنشور في نفس علامة التبويب) ،

ستتمكن من النقر فوق أي صورة في المعرض وسيفتح رابطًا قمت بإضافته.

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

إثراء الوظيفة

لم أر خيار تكبير كل صورة في المعرض عند النقر فوقها ؛ هذا غير متوفر هنا حتى الآن. لكني أريد أن يتم فتح صورتي كنافذة منبثقة في نفس علامة التبويب للسماح للمستخدم بالنقر فوق أي صورة في المعرض وفتحها بتنسيق المعاينة الكبير.

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

الآن عندما يتم تنشيط المكون الإضافي ، يمكنني النقر فوق أي صورة في معرض الصور الخاص بي

وهو مفتوح كنافذة منبثقة في نفس علامة التبويب.

والآن أريد أن يبدو معرضي كعرض دائري متدفق قليلاً ، لذلك سأستخدم المكون الإضافي Continuous Image Carousel مع Lightbox لتحقيق هدفي. بعد تنشيط المكون الإضافي ، انتقل إلى Continuous Slider plus Lightbox -> إدارة الصور في لوحة تحكم المشرف وأضف 5 صور إلى مكتبة الوسائط الخاصة بي في المستقبل.

لإضافتهم واحدًا تلو الآخر ، انقر فوق الزر "إضافة جديد" ->

-> انقر فوق الارتباط "انقر هنا لإضافة صورة" ->

-> اختر صورة من مكتبة الوسائط -> وانقر فوق الزر Set Image.

بعد ذلك أقوم بحفظ التغييرات ويتم حفظ الصورة.

عندما يتم تحميل جميع الصور ، أقوم بنسخ الكود المختصر للعرض الدائري

وأدخله تحت كتلة النص في المنشور الذي تم إنشاؤه باستخدام محرر Gutenberg.

أقوم بتحديث المنشور ومعاينته ، لذا يمكنني الآن رؤية صوري تتدفق في شريط التمرير الدائري.

يبدو رائعا حقا.

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

ميلاني هـ.

ملاحظة

أتمنى أن تكون لطيفًا جدًا لتترك أفكارك وآرائك فيما يتعلق بما ترغب في قراءته في المنشورات التالية على Gutenberg. من فضلك قل كل ما تحب في التعليقات أدناه. شكرا مقدما!