كيفية إنشاء جدول زمني لجدول الزفاف الخاص بك مع البرنامج المساعد Divi & the Divi Timeline Module

هذا المنشور هو جزء 5 من 5 في مسلسلاتنا القصيرة كيفية إنشاء موقع زفاف أنيق مع Divi. في هذه السلسلة ، سنوجهك عبر أهم أجزاء إنشاء موقع زفاف لنفسك أو لعميل مع Divi.

في الأجزاء الأربعة الأولى من المسلسل ، أوضحنا لك كيفية إنشاء:

• صفحة إعلان زفاف أنيقة
• صفحة معرض
• صفحة قائمة الهدايا
• وكيفية استخدام البرنامج المساعد Automatic Divi Testimonials على موقع الزفاف الخاص بك.

كانت المخططات التي أنشأناها متسقة في الأسلوب وسهلة الإنشاء.

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

مثال الجدول الزمني العمودي

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

شراء البرنامج المساعد

إذا كنت لا تملك المكون الإضافي Divi Timeline Module حتى الآن ، فستحتاج إلى شرائه على موقع ويب Elegant Marketplace. تكلفة البرنامج المساعد 11 دولارًا. بعد شراء المكون الإضافي على موقع الويب الخاص بهم ، ستتلقى ملف ZIP الذي يحتوي على الوحدة الجديدة التي ستضيفها إلى موقع الويب الخاص بك.

تثبيت البرنامج المساعد

قم بتسجيل الدخول إلى موقع WordPress الخاص بك وانتقل إلى "إضافة جديد" في قسم البرنامج المساعد.

قم بتحميل ملف ZIP الذي تلقيته من عملية الشراء.

قم بتنشيط المكون الإضافي وأنت على ما يرام. سيقوم المكون الإضافي الآن تلقائيًا بإضافة Timeline Modules إلى Divi builder الخاص بك.

طريقتان مختلفتان لاستخدام وحدة Divi Timeline Module على موقع الويب الخاص بك

عرض جدول الزفاف

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

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

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

إظهار الجدول الزمني لعلاقة العروسين

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

الأنواع المختلفة لوحدات الشهادة

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

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

البدء

نعرض لك خطوة بخطوة كيفية إنشاء المخطط الزمني التالي:

الوحدة سريعة الاستجابة وستظهر بشكل جيد على سطح المكتب وكذلك على هاتفك أو جهازك اللوحي. هيا بنا نبدأ!

أضف عناصر المخطط الزمني والخط الزمني

نظرًا لأن Timeline Module عبارة عن مكون إضافي تابع لجهة خارجية ، فلن نتمكن من إجراء أي تعديلات مرئية باستخدام Visual Builder. لهذا السبب سنبقى فقط في الجزء الخلفي من الموقع لإجراء التغييرات المطلوبة.

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

الآن ، ضمن إعدادات Timeline - Vertical Module ، ستتمكن من إضافة عناصر مخطط زمني مختلفة إلى المخطط الزمني الذي تقوم بإنشائه.

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

• مكياج وشعر العروس
• تبادل لاطلاق النار الزفاف
• حفل ما قبل
• مراسم
• ساعة كوكتيل
• بداية العشاء
• الخبز المحمص
• أول رقصة
• وقت الرقص
• صحراء
• كلمة شكر أخيرة

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

تعديلات وحدة الجدول الزمني

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

بعد ذلك ، انتقل إلى علامة التبويب "التصميم". بادئ ذي بدء ، افتح فئة النص الفرعية وقم بإجراء التغييرات التالية:

• خط النص: Raleway Light
• نمط خط النص: غامق
• حجم خط النص: 14 بكسل
• لون النص: # 9b857b
• ارتفاع خط النص: 1em

قم بالتمرير لأسفل في علامة التبويب نفسها وقم بإجراء التغييرات التالية على الفئة الفرعية لنص تسمية العنصر:

• خط تسمية العنصر: Raleway Light
• نمط خط تسمية العنصر: غامق
• حجم خط تسمية العنصر: 39 بكسل
• لون نص تسمية العنصر: # 9b857b
• ارتفاع خط تسمية العنصر: 1.5em

علاوة على ذلك ، قم بإجراء التغييرات التالية على الفئة الفرعية لنص العناوين:

• خط العناوين: اليوسفي
• حجم خط العناوين: 70 بكسل (سطح المكتب والكمبيوتر اللوحي) ، 60 بكسل (جهاز لوحي)
• لون نص العناوين: # 9b857b
• ارتفاع خط العناوين: 1.5em

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

تعديلات عنصر المخطط الزمني

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

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

محتوى عنصر المخطط الزمني

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

قم بالتمرير لأسفل نفس علامة التبويب وابحث عن رمز القلب في قائمة أيقونات العناصر ، وقم بتغيير لون الرمز إلى "# 9b857b" ولون خلفية الرمز إلى "# fae4de".

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

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

تغليف

كان هذا هو الجزء الأخير من المسلسل القصير كيفية إنشاء موقع زفاف أنيق مع Divi . نأمل أن تكون هذه سلسلة قيمة من المنشورات التي ستساعدك في إنشاء موقع زفاف أنيق ومذهل لك أو لعملائك. إذا كان لديك أي أسئلة بخصوص هذا البرنامج التعليمي ، أو إذا كان لديك أي طلبات لبرامج تعليمية / مسلسلات صغيرة في المستقبل ؛ تأكد من ترك تعليق في قسم التعليقات في منشور المدونة هذا حتى نتمكن من الرد عليك بالإجابات!

تأكد من الاشتراك في النشرة الإخبارية عبر البريد الإلكتروني وقناة YouTube حتى لا يفوتك إعلان كبير أو نصيحة مفيدة أو Divi freebie!