غالبًا ما تُعرف مربعات الخدمات باسم مربعات الميزات. تُستخدم لتسليط الضوء على الخدمات الرئيسية التي يقدمها منتجك وأعمالك. غالبًا ما تتضمن مربعات الخدمات صورًا وأيقونات وعناوين وأوصافًا موجزة لجعلها ذات معنى.
على الرغم من أن Tableberg عبارة عن مكون إضافي لبناء الجداول، إلا أنه يمكنك استخدامه في مشاريع تصميم الويب المختلفة، مثل صناديق الخدمة الجذابة. سيوضح لك هذا المنشور التعليمي كيفية إضافة صناديق الخدمة في WordPress من خلال دليل سهل.
إذا لم يكن لديك البرنامج المساعد Tabelberg على موقعك، يمكنك الحصول عليه بالنقر فوق الأزرار الموجودة على الشريط أدناه.
إنشاء جداول جميلة
مع محرر الكتل
الخطوة 01: إنشاء الصفوف والأعمدة
أضف كتلة Tableberg إلى المحرر بالضغط على أيقونة زائد (+).
التالي، تعيين عدد الصفوف والأعمدة تريد إنشاء صناديق الخدمة الخاصة بك. نظرًا لأننا سننشئ أربعة صناديق خدمة، فقد حددنا 2*2 صفوف وأعمدة.
الخطوة 02: إضافة محتوى إلى خلية
نحن بحاجة إلى ثلاثة أنواع من العناصر في صناديق الخدمة الخاصة بنا. وهي الأيقونات والفقرات والأزرار. فلنبدأ في إضافتها.
لون الخلفية للجدول
من الجيد أن أضف لون الخلفية للجدول من البداية، لأنه يتعين عليك تحديد لون العناصر الأخرى للخلية بناءً على لون الخلفية.
حدد الرمز Tableberg على شريط الأدوات. انتقل إلى علامة التبويب "الأنماط"ستشاهد خيارات لون الخلفية ضمن قسم اللون. اختر الألوان المناسبة.
أيقونة للخلية
يتيح لك برنامج Tableberg إضافة كتل مختلفة تمامًا مثل محرر Gutenberg. انقر فوق أيقونة زائد (+) وأضف كتلة الأيقونات الى الخلية.
تعال إلى علامة التبويب "الإعدادات"سوف تحصل على خيارات لتغيير حجم الرمز، الدوران، و رمز. الآن، حدد رمزًا الذي يتوافق مع نوع الخدمة الخاصة بك للخلية المحددة.
اذهب الى علامة التبويب "الأنماط"سوف ترى الخيارات لـ تغيير لون الرمز الخاص بكلقد جعلناها بيضاء.
اسم الخدمة
أنت بحاجة إلى كتلة الفقرة لكتابة اسم الخدمة.
بعد إضافة كتلة الفقرة، اكتب اسم الخدمة للخلية. من الشريط الجانبي الأيمن، تلوين اسم الخدمة و حدد حجمه.
وصف الخدمة
تمامًا كما في الطريقة السابقة، اكتب وصفًا للخدمة باستخدام كتلة الفقرة.
زر CTA
لن تكتمل الخدمة بدون زر CTA. لذا، أضف زر CTA إلى الخلية بواسطة الضغط على أيقونة الإضافة (+).
الآن، قم بتخصيص لون الخلفية، لون النص، و تأثير التحويم للزر كما تريد.
الخطوة 03: إضافة مسافة بين الكتل
يجب عليك إضافة مسافات بين العناصر في الخلية لإزالة الازدحام. للقيام بذلك، حدد الخلية بأكملها.
ثم اذهب إلى علامة التبويب "الأنماط". قم بالتمرير لأسفل علامة التبويب، وانتقل إلى حشو الخلية و تباعد الخلايا خيارات.
من خلال تعيين القيم في هذين الخيارين، يمكنك إضافة مسافة بين عناصر الخلية.
الخطوة 04: إضافة المحتوى إلى الخلايا الأخرى
يتمتع برنامج Tableberg بميزة مثيرة للاهتمام على شريط الأدوات تتيح لك تكرار صفوف وأعمدة الجدول على الفور.
انقر على [Pro] أيقونة تحرير الجدول على شريط الأدوات. بعد ذلك، حدد تكرار هذا الصف خيار.
سيؤدي هذا إلى إنشاء عمود فارغ. حذف العمود لأنه ليس ضروريا.
الآن، باستخدام [Pro] أيقونة تحرير الجدول, حدد تكرار هذا العمود خيار.
وبذلك تكون صناديق الخدمة جاهزة. وبالتالي، يمكنك تكرار الخلايا والصفوف والأعمدة في جدول باستخدام البرنامج الإضافي Tableberg.
الخطوة 05: إضافة مسافات بين مربعات الخدمة
حدد كتلة الجدول بأكملها عن طريق الضغط على أيقونة Tableberg على شريط الأدوات.
اذهب الى علامة التبويب "الأنماط"قم بالتمرير لأسفل علامة التبويب، ثم انتقل إلى تباعد الخلاياباستخدام هذا الخيار، يمكنك إنشاء فجوات بين صناديق الخدمة.
الخطوة 06: إخفاء حدود صناديق الخدمة
الآن، لإخفاء حدود المربع، انتقل إلى علامة التبويب "الأنماط"مرة أخرى، قم بالتمرير لأسفل علامة التبويب، وانتقل إلى قسم الحدود.
إيقاف تشغيل الخيارات [PRO] حدود الصف فقط و إخفاء الحدود الخارجية للخلية.
لذا، أصبحت صناديق الخدمة الخاصة بك جاهزة. يمكنك جعل صناديق الخدمة الخاصة بك أكثر جاذبية من خلال المزيد من التخصيص إذا أردت. لمعرفة المزيد حول كيفية تخصيص جداول Tableberg، استكشف وثائقنا.
خاتمة
Tableberg ليس مجرد مكون إضافي لبناء الجداول. بل إنه أداة متعددة الاستخدامات يمكنك استخدامها في مشاريع تصميم الويب وإنشاء المحتوى المختلفة. نأمل أن تكون قد استمتعت بالبرنامج التعليمي من البداية إلى النهاية.
إذا كان هناك أي لبس بخصوص منشور اليوم، فما عليك سوى ترك تعليقك أدناه. وسيقوم فريق الدعم لدينا بالرد عليك قريبًا جدًا.
اقرأ أيضاً: