كتل جوتنبرج: دليل المستخدم النهائي مع الاعتبارات الأساسية لعام 2022

نشرت: 2020-12-04

مع الإصدار الجديد في 6 ديسمبر 2018 ، قدم WordPress 5.0 Kirk محرر كتلة افتراضي يُعرف أيضًا باسم Gutenberg. يساعدك محرر المحتوى الجديد هذا في إنشاء محتوى بطريقة مختلفة تمامًا. لقد حل محل محرر WordPress TinyMCE ويوفر طريقة مرئية أكثر لإنشاء المحتوى في شكل كتل.

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

سواء قمت بتحديث موقعك إلى WordPress 5.0 أم لا ، يجب أن تتعلم كيفية استخدام Gutenberg Block لتقدمك في المستقبل. هنا سوف تحصل على فكرة شاملة وقائمة بجميع كتل Gutenberg Blocks WordPress جنبًا إلى جنب مع الكتل الثلاثين الشهيرة.

كتل WordPress Gutenberg: أفضل رفيق لك في المستقبل

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

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

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

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

كتل جوتنبرج الافتراضية في WordPress

Gutenberg blocks

لكي تكون مستعدًا للمستقبل ، يجب أن تعرف أسماء Gutenberg Blocks الافتراضية واستخداماتها. بصفتك مستخدم WordPress ، ربما تحتاج إلى التعرف على هذه الكتل عاجلاً أم آجلاً.

لذلك يتم تنظيم كتل جوتنبرج بشكل أساسي حسب الفئات التالية:

  • الأكثر استخداما
  • الكتل المشتركة
  • تنسيق
  • تخطيط
  • الحاجيات
  • يتضمّن
  • قابلة لإعادة الاستخدام

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

Gutenberg blocks
كيفية البحث عن الكتل في WordPress

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

Gutenberg blocks
فئات الكتل

علاوة على ذلك ، من لوحة التحرير اليمنى ، يمكنك تعيين حجم الخط ، والحد الأقصى ، وتغيير النص وألوان الخلفية لكتلة معينة.

Gutenberg blocks

دعونا نرى كيف يعملون بالفعل!

الكتل المشتركة- تستخدم بانتظام في أي منشور

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

common blocks
  1. فقرة: كتلة نصية بسيطة فقط لإضافة فقرة واحدة من المحتوى.
  2. صورة : أدخل صورة واحدة في أي مكان في منشورك
  3. العنوان : إضافة علامة العنوان
  4. المعرض : اعرض مجموعة من الصور بنمط المعرض
  5. القائمة : أضف قوائم ذات تعداد نقطي أو رقمي
  6. اقتباس : قم بتضمين اقتباس في نمطين مختلفين
  7. الصوت : تحميل ملف صوتي على موقعك
  8. الغلاف : أدخل ملف فيديو أو صوت مع تراكب نص
  9. ملف : أضف ارتباطًا إلى ملف قابل للتنزيل
  10. الفيديو : قم بتحميل ملف فيديو وقم بتشغيله مباشرة على موقعك

التنسيق - خيارات التخصيص الإضافية

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

formatting blocks
  1. الكود: اكتب أي نوع من الكود الفني بكل سهولة
  2. Classic: يوفر أدوات التحرير لمحرر WordPress الكلاسيكي
  3. HTML مخصص: أدخل كود HTML مخصصًا وقم بمعاينته مباشرةً في محرر WordPress
  4. منسق مسبقًا: أضف نصًا يحترم المسافات وعلامات الجدولة
  5. اقتباس مستخرج: أضف تركيزًا مرئيًا خاصًا إلى اقتباس من النص الخاص بك
  6. الجدول: استخدم الجدول لعرض البيانات الجدولية
  7. الآية: اكتب الشعر والتعبيرات الأدبية الأخرى بما في ذلك جميع المسافات وفواصل الأسطر

عناصر التخطيط- تحسين أسلوب التصميم

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

layout elements
  1. الزر: زر إنشاء وإدراج ارتباط بخلفية ولون نص مختلفين
  2. الأعمدة: قم بإنشاء تخطيطات متعددة الأعمدة ويمكنك تضمين أنواع كتل أخرى في كل عمود
  3. الوسائط والنص: أدخل ملفًا نصيًا وملف وسائط جنبًا إلى جنب في كتلة واحدة ؛ أعمدة مختلفة
  4. المزيد: قسّم المحتوى الخاص بك إلى جزأين بما في ذلك كتلة "قراءة المزيد"
  5. فاصل الصفحة: يقسم محتوى موقعك إلى صفحات متعددة
  6. الفاصل : أضف خطًا أفقيًا قصيرًا في منشورك
  7. مباعد: قم بتضمين مساحة فارغة كبيرة مستطيلة بين كتلتين في منشورك
  8. أعمدة النص: أضف نصًا واعرضه في عمودين إلى أربعة أعمدة ، مثل الجريدة.

الحاجيات - أضف بعض الأدوات إلى أي صفحة أو منشور

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

widgets blocks
  1. الرمز القصير: أدخل محتوى مخصصًا مثل النماذج من خلال رمز قصير في WordPress
  2. المحفوظات: تعرض أرشيفًا شهريًا لمشاركاتك
  3. التقويم: عرض تقويم شهري لمشاركاتك
  4. الفئات: قائمة بجميع فئات المنشورات
  5. أحدث التعليقات: لمحة عن آخر 5 تعليقات (ليس التعليق الكامل)
  6. أحدث المشاركات: قائمة مشاركاتك الأخيرة
  7. RSS: قم بإضافة موجز RSS إلى أي صفحة أو منشور
  8. البحث: أضف بحث WordPress إلى أي صفحة أو منشور
  9. سحابة العلامات: قائمة سحابية بعلامات النشر الخاصة بك

التضمينات- إدراج المحتويات من مصادر أخرى

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

embeds gutenberg blocks
  • موقع يوتيوب
  • تويتر
  • فيسبوك
  • انستغرام
  • فيميو
  • Soundcloud
  • سبوتيفي
  • فليكر
  • انيموتو
  • سحابة
  • CollegeHumor
  • ديلي موشن
  • مضحك أو يموت
  • هولو
  • Imgur
  • الإصدار
  • كيك ستارتر
  • Meetup.com
  • ميكس كلاود
  • فوتوبوكيت
  • بولدادي
  • رديت
  • صدى
  • سكرينكاست
  • سكريبد
  • الشرائح
  • SmugMug
  • مكبر الصوت
  • تيد
  • نعرفكم
  • فيديو
  • ووردبريس
  • WordPress.tv

كتل قابلة لإعادة الاستخدام:

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

HappyAddons Pro

ملحقات الطرف الثالث لتوسيع كل من قوائم الحظر والوظائف

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

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

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

  1. Ultimate Addons for Gutenberg - مكون إضافي مجاني مع 15+ من كتل Gutenberg
  2. CoBlocks - كتل جوتنبرج منشئ الصفحة
  3. تكويم - كتل جوتنبرج
  4. الكتل النهائية - كتل جوتنبرج المخصصة
  5. Advanced Gutenberg - أكثر من 20 قالبًا جديدًا لـ Gutenberg
  6. Kadence Block - مجموعة أدوات Gutenberg Page Builder Toolkit
  7. معرض إنفيرا - قالب WordPress لمعارض الصور
  8. الكتل الذرية - مجموعة جوتنبرج بلوك

Ultimate Addons for Gutenberg - مكون إضافي مجاني مع 15+ من كتل Gutenberg

Ultimate Addons for Gutenberg

إنها واحدة من الوظائف الإضافية الشائعة بين العديد من مستخدمي Gutenberg. The Ultimate Addons for Gutenberg عبارة عن حزمة كاملة من الكتل الفريدة والإبداعية. لذلك ، يمكنك زيادة سرعة المحرر الخاص بك لإنشاء صفحات ومنشورات جميلة باستخدام هذا المكون الإضافي.

تضم أكثر من 15 كتلة جوتنبرج ، بما في ذلك ما يلي:

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

الأكثر إثارة للدهشة أن هذا البرنامج المساعد يأتي مع دعم مدمج لموضوع Astra. و Astra متوافق تمامًا مع Gutenberg.

CoBlocks - كتل جوتنبرج منشئ الصفحة

coblocks-gutenberg-blocks

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

يدعم أكثر من 20 كتلة تفاعلية الآن:

  • بلوك الأكورديون
  • كتلة التنبيه
  • كتلة ملف تعريف المؤلف
  • كتلة الأزرار
  • قالب معرض الرف الدائري
  • انقر للتغريد بلوك
  • كتلة معرض الكولاج
  • كتلة فاصل ديناميكي
  • كتلة الأحداث (جديد!)
  • كتلة الميزات
  • كتلة المأكولات والمشروبات
  • كتلة النموذج
  • كتلة GIF
  • GitHub Gist Block

و اخرين.

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

تكويم - كتل جوتنبرج

stakable-gutenberg-blocks

تم تصميم Stackable خصيصًا لمحرر قوالب WordPress الجديد. وهو يدعم 23 قالبًا أساسيًا للصفحة عالية الجودة لـ Gutenberg و 50+ تخطيطات بلوك وتصميمات الأقسام / المجموعات المحددة مسبقًا. يوفر خيارات تصميم ويب متقدمة ومرنة لجعل رحلة تطوير الويب الخاصة بك سلسة.

بعض الكتل القابلة للتكديس الشائعة هي كما يلي:

  • بلوك الحاوية
  • ميزة كتلة الشبكة
  • كتلة البطاقة
  • كتلة الرأس
  • العد حتى بلوك
  • كتلة أعضاء الفريق
  • كتلة الإعلام

عزز قدرة التصميم الخاصة بك باستخدام تخطيطات التصميم المتنوعة والقابلة للتخصيص.

الكتل النهائية - كتل جوتنبرج المخصصة

Ultimate-gutenberg-blocks

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

في هذا الوقت ، تدعم Ultimate Blocks حوالي 20 كتلة لجعل رحلة التطوير الخاصة بك أكثر إثارة. فيما يلي بعض الميزات البارزة:

  • تصفية المحتوى
  • العد التنازلي
  • منزلق الصورة
  • المحتوى المبوب
  • صندوق أنيق
  • تبديل المحتوى

يمكنك الانضمام إلى مجموعة Facebook التفاعلية الخاصة بهم للحصول على أي مساعدة إضافية.

Advanced Gutenberg - أكثر من 20 قالبًا جديدًا لـ Gutenberg

Advanced Gutenberg

يجعل Advanced Gutenberg محرر Gutenberg الافتراضي أكثر قوة لإنشاء مواقع ويب احترافية بسهولة بالغة. يوفر أكثر من 20 قالبًا وخيارًا جديدًا لتخصيص موقع WordPress الخاص بك بسلاسة.

هنا ، ستحصل على كتل فريدة مثل:

  • مدير العمود
  • آخر شريط تمرير
  • كتلة علامات التبويب
  • كتلة أيقونة
  • كتلة الصور المتقدمة
  • حظر الاشتراك في البريد الإلكتروني
  • و أكثر من ذلك بكثير

ومع ذلك ، لديهم وثائق تفصيلية ومنتدى شخصي لتقديم الدعم لمستخدميهم.

Kadence Block- مجموعة أدوات Gutenberg Page Builder

kadence-gutenberg-blocks

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

يدعم Kadence بالفعل الكتل التالية:

  • تخطيط الصف
  • معرض متقدم
  • استمارة
  • العنوان المتقدم
  • زر متقدم
  • نوافذ التبويب
  • الأكورديون
  • الشهادات - التوصيات
  • أيقونة
  • فاصل / مقسم
  • معلومات مربع
  • قائمة الرموز

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

معرض إنفيرا - أفضل قالب WordPress لمعارض الصور

envira-gutenberg-blocks

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

بعد تنشيط هذا المكون الإضافي ، ستجد خيارًا جديدًا ضمن Common Blocks. من هناك يمكنك البحث عن أنواع مختلفة من أنماط المعرض حسب احتياجاتك. هذا المكون الإضافي متوافق تمامًا مع المكون الإضافي WooCommecre بحيث يمكنك استخدامه بسهولة لأي موقع تصوير لبيع الصور.

الكتل الذرية - مجموعة جوتنبرج بلوك

Atomic Blocks – Gutenberg Block Collection

تقدم الكتل الذرية مجموعة من كتل جوتنبرج الجديدة والأنيقة. يعمل نفس الفريق الموهوب من Array Themes أيضًا وراء هذه المجموعة العصرية من الكتل.

حاليًا ، تحتوي Atomic Blocks على 15 كتلة Gutenberg ، مع المزيد في الطريق:

  • قسم وكتلة التخطيط
  • كتلة الأعمدة المتقدمة
  • كتلة النشرة الإخبارية
  • كتلة التسعير
  • كتلة ما بعد الشبكة
  • بلوك الحاوية
  • كتلة التزكية
  • كتلة إشعار مضمنة
  • بلوك الأكورديون
  • كتلة الرموز المشاركة
  • كتلة الحث على اتخاذ إجراء
  • كتلة زر قابلة للتخصيص
  • بلوك الفاصل والمقسّم
  • كتلة ملف تعريف المؤلف
  • إسقاط كاب بلوك

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

أفضل 7 إضافات لـ Gutenberg Block لإثراء المحتوى الخاص بك في Outlook

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

تبدأ كتل جوتنبرج حقبة جديدة من تصميم المواقع

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

في هذه المدونة ، حاولنا مشاركة جميع المعلومات المتعلقة بـ Gutenberg Blocks. لذلك ، يمكنك بسهولة تحديث نفسك بالتخطيط التصميمي الثوري لمحرر WordPress الجديد.

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

HappyAddons Pro