هل تريد أن تمنح المستخدمين طريقة سريعة ونظيفة للتبديل بين خيارات المحتوى أو خيارات التسعير المختلفة على موقع ووردبريس الخاص بك؟ زر التبديل هو الحل الأمثل!
باستخدام زر التبديل، يمكن للزائرين التبديل على الفور بين خيارين أو أكثر - مثل التسعير الشهري مقابل التسعير السنوي، أو الوضع الفاتح مقابل الوضع الداكن، أو حتى أقسام المحتوى المختلفة تمامًا - دون تشويش صفحتك.
في هذا المنشور، سوف تكتشف طريقتين بسيطتين لإضافة أزرار تبديل إلى موقعك على ووردبريس:
- الطريقة 1: إضافة زر تبديل لأي نوع من المحتوى (نص، صور، نماذج، إلخ)
- الطريقة الثانية: إضافة زر تبديل لجداول التسعير أو أي نوع من البيانات الجدولية
هيا بنا نتعمق!
الطريقة 1: إضافة زر تبديل لأي نوع من المحتوى
إذا كنت ترغب في السماح للمستخدمين بالتبديل بين مجموعات مختلفة من المحتوى - مثل الأسئلة الشائعةأو تفاصيل المنتج، أو مجموعات الميزات المختلفة، فهذه الطريقة مناسبة لك.
سوف نستخدم الكتل النهائية الإضافة التي تقدم مكوِّن تبويب المحتوى متعدد الاستخدامات (محتوى مبوب) الذي يعمل مع جميع أنواع المحتوى.
الخطوة 1: تثبيت البرنامج الإضافي Ultimate Blocks
- انتقل إلى لوحة تحكم ووردبريس الخاصة بك.
- انتقل إلى الإضافات > إضافة جديد.
- ابحث عن "Ultimate Blocks" وقم بتثبيته/تفعيله.
الخطوة 2: إضافة كتلة المحتوى المبوبة
- افتح مقالة أو صفحة في محرِّر ووردبريس.
- يكتب
/المحتوى المبوبأو استخدم أيقونة + لإضافة مكوِّن المحتوى المبوَّب.
سيبدو مكوِّن "المحتوى المبوب" بهذا الشكل -
الخطوة 3: تخصيص المكوِّن لوظيفة التبديل
حدد الكتلة واختر الكتلة واختر أسلوب الحبوب في الإعدادات (هذا يجعل علامات التبويب تبدو مثل الأزرار).
قم بتوسيط المحاذاة للحصول على مظهر كلاسيكي للتبديل.
انقر على علامة + بجوار علامة التبويب الأولى لإضافة علامة تبويب أخرى. أضف علامتي تبويب على الأقل (على سبيل المثال، "شهري" و "سنوي" أو "تفاصيل" و "ملخص"). أعد تسمية علامات التبويب لتتناسب مع خيارات التبديل.
استخدم إعدادات الألوان لتعيين ألوان متباينة، بحيث تكون علامة التبويب النشطة واضحة.
الخطوة 4: إضافة المحتوى الخاص بك
انقر داخل كل علامة تبويب لإضافة المحتوى الذي تفضله (نص، أو صور، أو قوائم، أو نماذج، أو حتى كتل أخرى).
قم بتخصيص المزيد إذا لزم الأمر - قم بتغيير خلفيات علامات التبويب وألوان المحتوى والمزيد.
الخطوة 5: المعاينة والنشر
- استخدم خيار المعاينة لاختبار التبديل.
- بمجرد أن تكون راضيًا، انشر الصفحة أو حدّثها.
هذا كل شيء! لديك الآن زر تبديل مرن لأي نوع من المحتوى على موقع ووردبريس الخاص بك.
الطريقة 2: إضافة زر تبديل لجداول التسعير (والمزيد)
هل تريد السماح للمستخدمين بالتبديل بين جداول الأسعار الشهرية والسنوية - أو مقارنة مجموعات البيانات المختلفة جنبًا إلى جنب؟ يمكن استخدام التبديل إلى Tableberg صُممت الكتلة في المكون الإضافي Tableberg لهذا الغرض فقط!
مع Tableberg برويمكنك تنظيم أي عدد من الجداول في علامات تبويب أنيقة وقابلة للنقر، وهي مثالية لخطط التسعير، أو مقارنات المنتجات، أو الجداول متعددة اللغات، أو أي سيناريو يكون فيه تعدد الجداول منطقيًا.
الخطوة 1: إدراج مكوِّن "تبديل ل Tableberg
- افتح مقالتك أو صفحتك في محرِّر ووردبريس.
- انقر على أيقونة + (زائد) وابحث عن "تبديل لـ Tableberg".
- أضف المكوِّن إلى صفحتك.
الخطوة 2: إعداد علامات التبويب وتخصيصها
- بشكل افتراضي، سترى ثلاث علامات تبويب تحمل أسماء "علامة التبويب 1" و"علامة التبويب 2" و"علامة التبويب 3".
- قم بإضافة علامات تبويب أو إزالتها حسب الحاجة باستخدام الرمزين + أو -.
- أعد تسمية كل علامة تبويب (على سبيل المثال، "شهري" أو "سنوي" أو "الخطة الأساسية" أو "الخطة الاحترافية").
- استخدم لوحة الخيارات اليمنى لضبط عناوين علامات التبويب والمحاذاة والألوان والحدود للحصول على مظهر العلامة التجارية.
الخطوة 3: أضف جداولك
- انقر على كل علامة تبويب لإضافة جدول فريد بالداخل.
- أنشئ جدولاً جديداً من الصفر، أو أدرج نمط جدول Tableberg مُعد مسبقاً.
- يمكن أن تحتوي كل علامة تبويب على جدول مختلف تمامًا - وهو أمر رائع لمقارنات الميزات، ومستويات التسعير، ومجموعات البيانات، والمزيد.
حالات الاستخدام الشائعة
- جداول التسعير: اسمح للمستخدمين بالتبديل بين الأسعار الشهرية والسنوية، أو بين الباقات المختلفة.
- مقارنات البيانات: اعرض البيانات الإقليمية أو مواصفات المنتجات المختلفة أو مقاييس الأداء في علامات تبويب منفصلة.
- المحتوى التعليمي: قم بتنظيم الدروس أو مواد المقرر الدراسي لتسهيل التنقل فيها.
- الجداول متعددة اللغات: عرض البيانات نفسها بلغات مختلفة للزوار الدوليين.
الخطوة 4: المعاينة والنشر
- قم بمعاينة علامات تبديل التبديل للتأكد من أن كل شيء يبدو ويعمل كما هو متوقع.
- انشر أو حدّث منشورك/صفحتك عندما تكون جاهزة.
إليك مثال كيف يبدو التبديل لجدول التسعير.
خاتمة
تُعد إضافة زر تبديل إلى موقع WordPress الخاص بك طريقة رائعة لتحسين التنقل وتوفير المساحة ومنح الزائرين وصولاً فورياً إلى المحتوى الذي يهتمون به - سواء كان التبديل بين خطط التسعير أو عرض التفاصيل أو مقارنة البيانات.
- لأي نوع من المحتوى، استخدم الكتل النهائية لإنشاء مفاتيح تبديل مرنة في ثوانٍ.
- بالنسبة لجداول الأسعار وتخطيطات الجداول الأكثر تقدمًا، جرِّب كتلة تبديل Tableberg للمحترفين لتجربة تبويب سلسة.
جرّب هذه الطرق على موقعك الإلكتروني واجعل محتواك أكثر تفاعلية وسهولة في الاستخدام. هل لديك أسئلة أو تحتاج إلى مساعدة؟ أخبرنا في التعليقات!
