تسليط الضوء على البرنامج المساعد Divi: وحدة تقويم أحداث Divi

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

تثبيت وحدة تقويم أحداث Divi

أولاً ، قم بتثبيت البرنامج الإضافي "تقويم الأحداث". إذا لم يتم تثبيت هذا المكون الإضافي ، فستتلقى رسالة خطأ تخبرك بضرورة تثبيته وتوفر رابطًا إلى صفحة WordPress الخاصة بالمكون الإضافي (خمن ​​كيف أعرف). لمزيد من المعلومات حول تقويم الأحداث ، راجع مقالة تقويم الأحداث: نظرة عامة مفصلة على الإصدار المجاني هنا في مدونة ET.

بعد ذلك ، قم بتحميل وتنشيط المكون الإضافي Divi Events Calendar Module وقم بتنشيطه.

بالنسبة إلى الأمثلة الخاصة بي ، قمت بإنشاء مجموعة من الأحداث لـ Divi و WordPress مع فئات ومنظمين وأماكن وتواريخ مختلفة.

وحدة تقويم أحداث Divi

تمت إضافة وحدتين جديدتين إلى Divi Builder. الأول ، المسمى Divi Events Calendar ، يعرض الأحداث كبطاقات في قائمة تشبه إلى حد كبير منشورات المدونة. الثانية ، تسمى Divi Event Calendar View ، تعرض الأحداث في التقويم. لا تزال وحدة عرض التقويم في مرحلة تجريبية. لديها حاليا ميزات محدودة. سننظر في كلا الوحدتين.

بالنسبة لأول واحد ، أستخدم حزمة تخطيط صفحة جدول الاجتماع Meetup. لقد استبدلت الأحداث في تلك الصفحة بوحدة تقويم أحداث Divi.

علامة تبويب المحتوى

تعرض الوحدة الأحداث تلقائيًا. يتضمن علامات تبويب Divi القياسية. تضيف علامة التبويب "المحتوى" المحتوى والعناصر. يضيف خلفية زرقاء بشكل افتراضي.

المحتوى

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

عناصر

تسمح لك العناصر باختيار العناصر التي يتم عرضها. يتضمن ذلك الصورة المميزة ، ومنظم العرض ، وعنوان URL لموقع الويب ، والتاريخ ، والوقت ، والمكان ، والموقع ، والمقتطف ، والفئة ، وزر مزيد من المعلومات ، والأحداث السابقة (التي تقصر الوحدة على إظهار الأحداث الماضية فقط). لقد قمت بتعيينه لإخفاء الصورة المميزة ومنظم العرض.

علامة تبويب التصميم

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

تخطيط

يتيح لك Layout اختيار عدد الأعمدة (1-4) ، ومحاذاة الصورة (يسار أو أعلى) ، ولون الخلفية ، والهامش ، والحشو. لقد قمت بتعيين الصورة في الأعلى وغيرت الخلفية إلى اللون الأبيض. لا يزال يظهر اللون الأزرق بين بطاقات الحدث.

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

هذا المثال المكون من 3 أعمدة. يمكنني ضبط نص عنوان URL ليناسب. في 3 أعمدة ، لا يعد وضع الصورة خيارًا.

يحتوي هذا العمود على عمودين مع الصور على اليسار.

ظفري

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

في هذا المثال ، قمت بتعيين الزوايا على 36 بكسل وأعطيتها عرض حدود 9 بكسل. لقد صممت ألوان الحدود وأعطيتها نمطًا داخليًا.

نص

لقد قمت بتعديل نص العنوان ليتناسب مع التنسيق ، مع Roboto خفيف الوزن وحروف كبيرة. لقد تركت نص المقتطف والتفاصيل افتراضيًا.

عرض المزيد زر

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

في هذا المثال ، استخدمت معظم الإعدادات من الأمثلة السابقة ، ولكن مع بعض التعديلات. لقد أزلت الخلفية الزرقاء وغيرت نصف قطر الحد وأزلت الحد. لقد قمت أيضًا بتحديد الفئات لعرض أحداث Divi فقط (إحدى فئتي المثال اللتين أنشأتهما). تم تعيين الحد على حدثين.

في هذا المثال ، قمت بتعيين التخطيط لإظهار 3 أعمدة. لقد قمت بإزالة حد الزر وقمت بتوسيط محاذاة الزر. لقد أزلت أيضًا عنوان URL ، وغيرت لون نص التفاصيل ، وغيرت نص الزر ، وأعطيت البطاقات ظلًا حتى تبرز من الخلفية.

وحدة عرض تقويم حدث Divi

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

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

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

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

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

السعر والتوثيق

يمكنك الحصول على وحدة تقويم الأحداث من موقع المطور على الويب مقابل 35 دولارًا. يتضمن استخدامًا غير محدود لموقع الويب ودعمًا وتحديثات مدى الحياة وضمان استرداد الأموال لمدة 30 يومًا.

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

خواطر ختامية

هذه هي نظرتنا إلى البرنامج المساعد Divi Events Calendar Module لـ Divi. تعمل الوحدات تمامًا مثل أي وحدة Divi ، لذلك من السهل تصميم الأحداث الخاصة بك للعمل مع تخطيطات Divi الخاصة بك. تتضمن وحدة التقويم الرئيسية حتى الحشو والهامش وتعديلات الحدود للعناصر الفردية داخل الوحدة. يمنحك هذا التحكم في تصميمها كبطاقات فردية.

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

يعد تقويم الأحداث نفسه أداة ممتازة لأي موقع ويب. إنه مفيد لجلسات التصوير والحفلات الموسيقية وعروض المنتجات والأحداث التجارية واللقاءات وغير ذلك الكثير. إذا كنت ترغب في استخدام المكون الإضافي Events Calendar مع موقع Divi الخاص بك ، فإن المكون الإضافي Divi Events Calendar Module يستحق نظرة.

نريد أن نسمع منك. هل جربت وحدة تقويم أحداث Divi؟ أخبرنا برأيك في التعليقات أدناه.

صورة مميزة عبر VectorKnight / shutterstock.com