كيفية إضافة صناديق الخدمة في ووردبريس

كيفية إضافة صناديق الخدمة في ووردبريس

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

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

إذا لم يكن لديك البرنامج المساعد Tabelberg على موقعك، يمكنك الحصول عليه بالنقر فوق الأزرار الموجودة على الشريط أدناه.

إنشاء جداول جميلة
مع محرر الكتل

الخطوة 01: إنشاء الصفوف والأعمدة

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

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

التالي، تعيين عدد الصفوف والأعمدة تريد إنشاء صناديق الخدمة الخاصة بك. نظرًا لأننا سننشئ أربعة صناديق خدمة، فقد حددنا 2*2 صفوف وأعمدة.

حدد عدد الصفوف والأعمدة

الخطوة 02: إضافة محتوى إلى خلية

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

لون الخلفية للجدول

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

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

إضافة خلفية للجدول

أيقونة للخلية

يتيح لك برنامج Tableberg إضافة كتل مختلفة تمامًا مثل محرر Gutenberg. انقر فوق أيقونة زائد (+) وأضف كتلة الأيقونات الى الخلية.

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

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

حدد رمزًا لصندوق الخدمة

اذهب الى علامة التبويب "الأنماط"سوف ترى الخيارات لـ تغيير لون الرمز الخاص بكلقد جعلناها بيضاء.

تغيير لون الرمز

اسم الخدمة

أنت بحاجة إلى كتلة الفقرة لكتابة اسم الخدمة.

أضف كتلة الفقرة لإضافة اسم الخدمة

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

اكتب اسم الخدمة

وصف الخدمة

تمامًا كما في الطريقة السابقة، اكتب وصفًا للخدمة باستخدام كتلة الفقرة.

اكتب وصفا للخدمة

زر CTA

لن تكتمل الخدمة بدون زر CTA. لذا، أضف زر CTA إلى الخلية بواسطة الضغط على أيقونة الإضافة (+).

إضافة زر CTA

الآن، قم بتخصيص لون الخلفية، لون النص، و تأثير التحويم للزر كما تريد.

تخصيص زر CTA

الخطوة 03: إضافة مسافة بين الكتل

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

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

من خلال تعيين القيم في هذين الخيارين، يمكنك إضافة مسافة بين عناصر الخلية.

إضافة مسافة بين الكتل

الخطوة 04: إضافة المحتوى إلى الخلايا الأخرى

يتمتع برنامج Tableberg بميزة مثيرة للاهتمام على شريط الأدوات تتيح لك تكرار صفوف وأعمدة الجدول على الفور.

انقر على [Pro] أيقونة تحرير الجدول على شريط الأدوات. بعد ذلك، حدد تكرار هذا الصف خيار.

صف مكرر

سيؤدي هذا إلى إنشاء عمود فارغ. حذف العمود لأنه ليس ضروريا.

حذف العمود غير الضروري

الآن، باستخدام [Pro] أيقونة تحرير الجدول, حدد تكرار هذا العمود خيار.

تكرار العمود

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

صناديق الخدمة جاهزة

الخطوة 05: إضافة مسافات بين مربعات الخدمة

حدد كتلة الجدول بأكملها عن طريق الضغط على أيقونة Tableberg على شريط الأدوات.

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

إضافة مسافات بين مربعات الخدمة

الخطوة 06: إخفاء حدود صناديق الخدمة

الآن، لإخفاء حدود المربع، انتقل إلى علامة التبويب "الأنماط"مرة أخرى، قم بالتمرير لأسفل علامة التبويب، وانتقل إلى قسم الحدود.

إيقاف تشغيل الخيارات [PRO] حدود الصف فقط و إخفاء الحدود الخارجية للخلية.

إخفاء حدود صناديق الخدمة

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

خاتمة

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

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

اقرأ أيضاً:



فريق Tableberg