مربع المحتوى عبارة عن حاوية مميزة بصريًا يمكنك من خلالها تأطير محتوى معين يجعله مميزًا عن غيره. يساعدك في إبراز معلومات الميزات الرئيسية أو الإعلانات الخاصة، مما يلفت انتباه المستخدمين إلى التفاصيل المهمة.
تعتبر صناديق المحتوى مناسبة لعرض أقسام الحث على اتخاذ إجراء، والشهادات، والمراجعات، والميزات الرئيسية للمنتجات أو الخدمات. هناك عدة طرق لإنشاء صناديق المحتوى في مواقع الويب التي تعمل بنظام WordPress.
في التدوينة التالية لهذه المقالة، سنعرض لك ثلاث طرق مفيدة لكيفية إنشاء صناديق المحتوى في WordPress. كن معنا حتى النهاية.
طريقة |
المكون الإضافي |
معاينة |
---|---|---|
ليس مطلوبا |
![]() |
|
![]() |
||
![]() |
الطريقة 1: استخدام كتلة الأعمدة
يمكنك إنشاء وتصميم مربع محتوى على مستوى أساسي باستخدام كتلة أعمدة WordPress الافتراضية. اتبع الخطوات الموضحة أدناه.
الخطوة 01: إضافة كتلة الأعمدة إلى المحرر
ابحث عن كتلة العمود من مكتبة كتلة جوتنبرج بالضغط على زر الجمع (+) وأضفه إلى المحرر الخاص بك.

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

الخطوة 02: إضافة كتل المحتوى إلى العمود
ستتيح لك كتلة الأعمدة إضافة كتل أخرى بداخلها أيضًا. يمكنك إضافة أي كتلة تريدها لتنظيم المحتوى الخاص بك.

انقر على أيقونة زائد (+) على كتلة العمود. سيؤدي ذلك إلى فتح مكتبة كتلة Gutenberg، والتي يمكنك من خلالها اختيار وإضافة كتلة الفقرة.

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

يمكنك أن ترى أننا أضفنا صورة إلى كتلة الأعمدة.

الخطوة 03: تخصيص كتلة الأعمدة بأكملها
حدد قسم العمود بأكمله من خلال النقر على أيقونة العمود على شريط الأدوات، انتقل إلى علامة التبويب "الإعدادات". يمكنك تعديل عرض من العمود من الخيار المعني.

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

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

الطريقة 2: استخدام البرنامج الإضافي TableBerg
TableBerg هو مكون إضافي قوي لبناء الجداول يمكنه تعزيز حل بناء الجداول الافتراضي في WordPress. يمكنك أيضًا إنشاء صناديق محتوى جذابة باستخدام المكون الإضافي. دعنا نرى كيف نفعل ذلك.
الخطوة 01: تثبيت وتفعيل البرنامج الإضافي TableBerg
مثل الطريقة المذكورة أعلاه، انتقل إلى المكونات الإضافية > إضافة مكون إضافي جديد. ابحث عن ملحق TableBerg عن طريق كتابة اسمه في مربع البحث. ثَبَّتَ و فعل هو - هي.

الخطوة 02: إضافة كتلة TableBerg إلى المحرر
يأتي البرنامج الإضافي مع كتلة تسمى TableBerg. أضفها إلى المحرر.

إذا كنت تفكر في بناء جدول، فيمكنك تحديد عدد الصفوف والأعمدة هنا مثل كتلة الجدول الافتراضية.

ولكن حدد الصف 1 والعمود 0 أثناء إنشاء مربع المحتوى. يمكنك رؤية أن التخطيط تم إنشاؤه على الفور.

الخطوة 03: إضافة المحتوى إلى TableBerg Box
يتيح لك TableBerg إضافة أنواع مختلفة من المحتوى إلى صفوفه وأعمدته عن طريق إضافة كتل المحتوى.
بمجرد وضع المؤشر على المربع، ستلاحظ ظهور خيار الحظر في الزاوية اليمنى السفلية.

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

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

وأخيرًا، أضفنا زر CTA.

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

من علامة التبويب "الإعدادات"، يمكنك تعيين العرض المطلوب للمربع.

من علامة التبويب "الأنماط"يمكنك تخصيص لون خلفية المربع والحشو والهامش والمساحة.

وبذلك، يمكنك إنشاء مربع سياق باستخدام البرنامج المساعد TableBerg.
الطريقة 3: استخدام البرنامج الإضافي Ultimate Blocks
Ultimate Blocks هو مكون إضافي واعد لتسويق المحتوى يحتوي على أكثر من 25 كتلة مخصصة لتعزيز محرر Gutenberg الخاص بك. يحتوي على عدة كتل مذهلة يمكنك من خلالها إنشاء المزيد من صناديق المحتوى الجذابة على موقعك.
الخطوة 01: تثبيت وتفعيل البرنامج الإضافي Ultimate Blocks
اذهب الى المكونات الإضافية > إضافة مكون إضافي جديد. ابحث عن إضافة Ultimate Blocks عن طريق كتابة اسمه في مربع البحث. ثَبَّتَ و فعل بمجرد ظهور البرنامج المساعد أدناه.

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

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

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

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

الآن، أضف المحتوى إلى الخيارات التي تراها داخل كتلة صندوق مصممة.

يمكنك أن ترى أننا أضفنا محتوى إلى الكتلة.

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

بعد ذلك، تعال إلى علامة التبويب "الأنماط". يمكنك تعديل حشوة و هامِش من الكتلة من هذه علامة التبويب.

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