يعد عرض جداول الأسعار أمرًا مهمًا للتأثير على العملاء. إحدى الطرق القوية لتحسين جداول الأسعار هي دمج شريط. إنه عبارة عن لافتة لافتة للنظر من الملصقات المعروضة قطريًا عبر الجدول لتسليط الضوء على العروض والخصومات والميزات المحددة.
سواء كنت تقوم بالترويج لخصم لفترة محدودة، أو ميزة خاصة، أو حزم مبيعات ساخنة، فإن الشريط الموضوع في مكانه المناسب يمكن أن يؤثر على الفور على العملاء المحتملين لاتخاذ القرارات. Tableberg هو مكون إضافي بديهي وقوي للقيام بذلك.
في هذا المنشور، سنوضح لك كيفية إضافة جدول الأسعار باستخدام الشريط في WordPress باستخدام Tableberg.
إنشاء جداول جميلة
مع محرر الكتل
بمجرد تثبيت البرنامج الإضافي على موقعك، انتقل إلى البرنامج التعليمي التالي.
Step 1: Add the Tableberg Block to the Editor
يضيف البرنامج المساعد كتلة تسمى Tableberg إلى مكتبة كتلة جوتنبرج. أضف الكتلة إلى المحرر ببساطة بالضغط على أيقونة الإضافة (+).
قم بتعيين عدد الأعمدة والصفوف التي تحتاجها لجدولك. في هذا البرنامج التعليمي، سنقوم بتعيين 3*1 للأعمدة والصفوف.
يمكنك أن ترى أن التصميم الأساسي لجدول التسعير تم إنشاؤه باستخدام الأعمدة والصفوف.
Step 2: Add Content to the Table
عادةً ما يتضمن جدول التسعير أسماء المنتجات والصور والأسعار والأسعار المخفضة وأزرار الدعوة إلى اتخاذ إجراء. دعنا نرى كيفية إضافتها إلى الجدول.
أضف اسم المنتج
يتيح لك Tableberg إضافة أنواع مختلفة من الكتل إلى خلاياه مثل محرر كتل Gutenberg. أضف كتلة الفقرة لكتابة اسم المنتج. (بشكل افتراضي، تتم إضافة كتلة الفقرة إلى خلايا الجدول).
اكتب اسم المنتج في الخلية. قم بمحاذاة النص في المنتصف، واجعله غامقًا، وقم بتغيير لونه وحجمه باستخدام الخيارات الموضحة في الصورة أدناه.
أضف صورة المنتج
أضف كتلة الصورة إلى جدول التسعير.
ستتيح لك كتلة الصورة تحميل صورة المنتج. قم بتغيير حجم الصورة حسب الحاجة ومحاذاتها بشكل مناسب.
أضف السعر السابق
إن إظهار الفرق بين السعر السابق والسعر الحالي يعد طريقة رائعة لتسليط الضوء على الخصم. لذا، فلنقم الآن بإضافة السعر السابق أسفل صورة المنتج.
إن إضافة تأثير الشطب إلى السعر السابق قد يجذب انتباه الأشخاص. للقيام بذلك، حدد السعر باستخدام المؤشر الخاص بك. انقر ال مزيد من الخيارات على شريط الأدوات.
اذهب الى ال تسليط الضوء و خيارات الشطبستتمكن من تغيير لون السعر وإضافة خط مشطوب.
أضف السعر الحالي للمنتج
الآن، أضف السعر الحالي للمنتج بخط أكبر نسبيًا حتى يتمكن من جذب انتباه الناس.
إضافة زر CTA
في نهاية كل المحتوى، أضف كتلة الأزرار.
قم بتغيير لون خلفية الزر ولون النص وحجم الطباعة والحشو. قم بإجراء هذه التغييرات بالطريقة التي تريدها.
Step 3: Add Spaces Between the Blocks
حسنًا، أصبح محتوى العمود جاهزًا. ولكن كما ترى، كل الكتل مزدحمة للغاية. نحتاج إلى إضافة مسافات بينها لإضفاء مظهر أكثر حداثة.
للقيام بذلك، حدد العمود المحدد. ثم انتقل إلى علامة التبويب "الأنماط". تعال إلى تباعد الكتل يمكنك زيادة المساحة عن طريق التمرير عبر علامة التبويب. يمكنك زيادة المساحة عن طريق إضافة قيمة إلى المربع.
وبالمثل، أضف محتوى إلى الأعمدة الأخرى. ولكن لتوفير الوقت، يمكنك تكرار العمود ثم تحديث المحتوى. إليك دليل حول كيفية تكرار عمود وصف Tableberg.
Step 4: Add Radius to the Table Columns
يمكنك تعزيز الجماليات عن طريق إضافة نصف قطر حدود لأعمدة الجدول. يختار ال أيقونة تابيلبيرج على شريط الأدوات. اذهب الى ال علامة التبويب "الأنماط".
التمرير و تعال الى تباعد الخلايا. عن طريق سحب الخيار المعني، يمكنك إضافة مسافات بين أعمدة الجدول.
سوف ترى حدود الجدول الخيار الموجود بالأسفل. تعيين المطلوب منك قيمة نصف القطر فوr كل من الحدود الداخلية والخارجية.
وبذلك، يمكنك إعداد جدول التسعير الخاص بك.
Step 5: Add a Ribbon to the Pricing Table
حدد العمود الذي تريد إضافة شريط إليه. اضغط على أيقونة علامة الجمع (+) وابحث عن كتلة الشريط. ثم انقر فوق المربع الموجود في العمود.
سيتم إضافة الشريط إلى الجدول. بعد ذلك، من علامة التبويب "الإعدادات"حدد نوع الشريط، ونص الشريط، والجانب، والمسافة.
بعد ذلك، قم بتخصيص النص ولون الخلفية من علامة التبويب "الأنماط".
وبذلك أصبح جدول التسعير الخاص بك جاهزًا مع شريط عليه.
إغلاق!
نأمل أن تكون قد استمتعت بهذا البرنامج التعليمي. ولكن هناك عدة نقاط يجب أن تتذكرها. تأكد من أن طاولتك نظيفة وخالية من الفوضى. دائمًا ما يكون لتصميمات طاولات التسعير البسيطة تأثير على العملاء المحتملين.
ثانيًا، استخدم نسخة واضحة وموجزة تربط زوار الويب على الفور. إذا أمكن، أضف بعض الفوائد/الميزات للمنتجات في الجدول. إذا كنت تريد تغطية خطط متعددة في جداول الأسعار الخاصة بك، فمن الأفضل عرضها باستخدام مفتاح تبديل.
وهنا دليل على كيفية إنشاء جدول أسعار باستخدام مفتاح التبديل في WordPress.
