كيفية إنشاء صناديق المحتوى في ووردبريس

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

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

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

الطريقة 1: استخدام كتلة الأعمدة

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

الخطوة 01: إضافة كتلة الأعمدة إلى المحرر

ابحث عن كتلة العمود من مكتبة كتلة جوتنبرج بالضغط على زر الجمع (+) وأضفه إلى المحرر الخاص بك.

أضف كتلة الأعمدة إلى محرر النصوص الخاص بك

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

حدد تخطيط عمود الخلية الفردية

الخطوة 02: إضافة كتل المحتوى إلى العمود

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

إضافة كتل المحتوى إلى العمود

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

أضف كتلة الفقرة إلى كتلة الأعمدة

يمكننا أن نرى أننا أضفنا بالفعل محتوى نصيًا إلى كتلة العمود. بعد ذلك، يمكنك إضافة المزيد من الكتل إلى الأعمدة حسب رغبتك. لنفترض أننا سنضيف كتلة الصورة.

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

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

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

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

الخطوة 03: تخصيص كتلة الأعمدة بأكملها

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

تخصيص كتلة الأعمدة بأكملها

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

تصميم كتلة العمود

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

إضافة مسافة بين الكتل وحدود لكتلة الأعمدة

الطريقة 2: استخدام البرنامج الإضافي TableBerg

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

الخطوة 01: تثبيت وتفعيل البرنامج الإضافي TableBerg

مثل الطريقة المذكورة أعلاه، انتقل إلى المكونات الإضافية > إضافة مكون إضافي جديد. ابحث عن ملحق TableBerg عن طريق كتابة اسمه في مربع البحث. ثَبَّتَ و فعل هو - هي.

تثبيت وتفعيل البرنامج الإضافي TableBerg

الخطوة 02: إضافة كتلة TableBerg إلى المحرر

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

ابحث عن كتلة TableBerg وأضفها إلى محرر Gutenberg الخاص بك

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

تحديد عمود الجدول والصف

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

إضافة محتوى إلى TableBerg Box

الخطوة 03: إضافة المحتوى إلى TableBerg Box

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

بمجرد وضع المؤشر على المربع، ستلاحظ ظهور خيار الحظر في الزاوية اليمنى السفلية.

إضافة محتوى إلى TableBerg Box

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

أضف كتلة الصورة

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

إضافة فقرة إلى الكتلة

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

إضافة زر CTA إلى مربع TableBerg

الخطوة 04: تخصيص TableBerg Box

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

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

قم بتحديد المربع بأكمله عن طريق النقر فوق أيقونة TableBerg على شريط الأدوات.

تخصيص إعدادات TableBerg Box

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

تخصيص عرض الجدول

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

تخصيص مربع المحتوى

وبذلك، يمكنك إنشاء مربع سياق باستخدام البرنامج المساعد TableBerg.

الطريقة 3: استخدام البرنامج الإضافي Ultimate Blocks

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

الخطوة 01: تثبيت وتفعيل البرنامج الإضافي Ultimate Blocks

اذهب الى المكونات الإضافية > إضافة مكون إضافي جديد. ابحث عن إضافة Ultimate Blocks عن طريق كتابة اسمه في مربع البحث. ثَبَّتَ و فعل بمجرد ظهور البرنامج المساعد أدناه.

تثبيت وتفعيل البرنامج الإضافي Ultimate Blocks

الخطوة 02: أضف كتلة الصندوق المصممة للمكون الإضافي إلى محرر Gutenberg الخاص بك

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

أضف الكتلة المصممة للمكون الإضافي إلى محرر Gutenberg الخاص بك

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

بالنسبة للبرنامج التعليمي، سوف نختار صندوق المميزات.

صناديق مصممة

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

الأشياء التي يمكنك إضافتها إلى مربع الميزات

الخطوة 03: إضافة المحتوى إلى الكتلة

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

حدد نوع العمود

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

إضافة محتوى إلى كتلة المربع المصممة

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

تمت إضافة المحتوى إلى كتلة المربع المصممة

الخطوة 04: تخصيص وتصميم كتلة الصندوق المصممة

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

بعد ذلك، من خيار التحكم المستجيبيمكنك إخفاء الكتلة من أي نوع جهاز معين.

تخصيص كتلة المربع المصمم

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

قم بتصميم مربع التصميم

وبذلك، يمكنك إنشاء مربع محتوى باستخدام البرنامج الإضافي Ultimate Blocks.

ملاحظات التشطيب!

Ultimate Blocks و TableBerg هما مكونان إضافيان متعددان الوظائف يهدفان إلى إحداث ثورة في نظام Gutenberg، مما يتيح للمستخدمين إنشاء محتوى متطور بسهولة.

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

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



فريق Tableberg