كيفية إضافة جدول الأسعار باستخدام الشريط في WordPress

كيفية إضافة جدول الأسعار باستخدام الشريط في WordPress

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

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

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

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

بمجرد تثبيت البرنامج الإضافي على موقعك، انتقل إلى البرنامج التعليمي التالي.

Step 1: Add the Tableberg Block to the Editor

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

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

قم بتعيين عدد الأعمدة والصفوف التي تحتاجها لجدولك. في هذا البرنامج التعليمي، سنقوم بتعيين 3*1 للأعمدة والصفوف.

تعيين عدد الصفوف والأعمدة

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

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

Step 2: Add Content to the Table

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

أضف اسم المنتج

يتيح لك Tableberg إضافة أنواع مختلفة من الكتل إلى خلاياه مثل محرر كتل Gutenberg. أضف كتلة الفقرة لكتابة اسم المنتج. (بشكل افتراضي، تتم إضافة كتلة الفقرة إلى خلايا الجدول).

أضف كتلة الفقرة إلى جدول التسعير

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

اكتب اسم المنتج وقم بتخصيصه

أضف صورة المنتج

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

أضف كتلة الصورة إلى جدول التسعير

ستتيح لك كتلة الصورة تحميل صورة المنتج. قم بتغيير حجم الصورة حسب الحاجة ومحاذاتها بشكل مناسب.

قم بتحميل صورة المنتج

أضف السعر السابق

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

اكتب السعر السابق

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

اذهب الى ال تسليط الضوء و خيارات الشطبستتمكن من تغيير لون السعر وإضافة خط مشطوب.

أضف تأثير الشطب إلى السعر

أضف السعر الحالي للمنتج

الآن، أضف السعر الحالي للمنتج بخط أكبر نسبيًا حتى يتمكن من جذب انتباه الناس.

أضف السعر الحالي للمنتج

إضافة زر CTA

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

أضف كتلة الزر إلى جدول التسعير

قم بتغيير لون خلفية الزر ولون النص وحجم الطباعة والحشو. قم بإجراء هذه التغييرات بالطريقة التي تريدها.

تخصيص زر CTA في جدول التسعير

Step 3: Add Spaces Between the Blocks

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

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

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

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

املأ الأعمدة الأخرى في جدول التسعير

Step 4: Add Radius to the Table Columns

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

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

إضافة نصف القطر إلى أعمدة الجدول

سوف ترى حدود الجدول الخيار الموجود بالأسفل. تعيين المطلوب منك قيمة نصف القطر فوr كل من الحدود الداخلية والخارجية.

إضافة redius إلى أعمدة الجدول

وبذلك، يمكنك إعداد جدول التسعير الخاص بك.

Step 5: Add a Ribbon to the Pricing Table

حدد العمود الذي تريد إضافة شريط إليه. اضغط على أيقونة علامة الجمع (+) وابحث عن كتلة الشريط. ثم انقر فوق المربع الموجود في العمود.

حدد عمودًا لإضافة شريط إليه

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

بعد ذلك، قم بتخصيص النص ولون الخلفية من علامة التبويب "الأنماط".

تخصيص الشريط الموجود على جدول التسعير

وبذلك أصبح جدول التسعير الخاص بك جاهزًا مع شريط عليه.

إغلاق!

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

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

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



فريق Tableberg