كيفية إظهار / إخفاء شريط تمرير الفيديو بناءً على حالة تسجيل الدخول باستخدام Divi
نشرت: 2022-03-05تعد أشرطة تمرير الفيديو رائعة لعرض مجموعة من مقاطع الفيديو لدورة تدريبية أو صفحة وصفات أو برامج تعليمية. كما أنها مرشح جيد لعرض المحتوى المتميز للأعضاء أو المشتركين في موقعك. على سبيل المثال ، يمكن للزائر الوصول إلى صفحة وصفة طعام والاطلاع فقط على التعليمات بتنسيق نصي فقط. ومع ذلك ، بمجرد أن يصبحوا مستخدمين مسجلين ، سيرون شريط تمرير فيديو على نفس الصفحة كمحتوى متميز. في هذا البرنامج التعليمي ، سوف نوضح لك مدى سهولة إخفاء / إظهار شريط تمرير الفيديو بناءً على حالة تسجيل الدخول باستخدام Divi. يتيح لك هذا منح محتوى فيديو للمستخدمين الذين قاموا بتسجيل الدخول كميزة متميزة.
دعنا نتعمق!
نظرة خاطفة
فيما يلي نظرة سريعة على التصميم الذي سنقوم ببنائه في هذا البرنامج التعليمي. لاحظ كيف يتم إخفاء شريط تمرير الفيديو عن المستخدمين حتى يقوموا بتسجيل الدخول باستخدام نموذج تسجيل الدخول.
قم بتنزيل Layout مجانًا
لتضع يديك على التصميمات من هذا البرنامج التعليمي ، ستحتاج أولاً إلى تنزيلها باستخدام الزر أدناه. للوصول إلى التنزيل ، ستحتاج إلى الاشتراك في قائمة البريد الإلكتروني Divi Daily الخاصة بنا باستخدام النموذج أدناه. بصفتك مشتركًا جديدًا ، ستتلقى المزيد من مزايا Divi وحزمة Divi Layout المجانية كل يوم اثنين! إذا كنت بالفعل في القائمة ، ببساطة أدخل عنوان بريدك الإلكتروني أدناه وانقر فوق تنزيل. لن يتم "إعادة اشتراكك" ولن تتلقى رسائل بريد إلكتروني إضافية.

تنزيل مجاني
انضم إلى نشرة Divi الإخبارية وسنرسل لك نسخة من حزمة Divi Landing Page Layout النهائية ، بالإضافة إلى الكثير من موارد Divi ونصائح وحيل أخرى مذهلة ومجانية. تابع معنا وستكون سيد Divi في أي وقت من الأوقات. إذا كنت مشتركًا بالفعل ، فاكتب ببساطة عنوان بريدك الإلكتروني أدناه وانقر فوق تنزيل للوصول إلى حزمة التخطيط.
لقد تم اشتراكك بنجاح. يرجى التحقق من عنوان بريدك الإلكتروني لتأكيد اشتراكك والحصول على حزم تخطيط Divi الأسبوعية المجانية!
لاستيراد تخطيط القسم إلى مكتبة Divi الخاصة بك ، انتقل إلى مكتبة Divi.
انقر فوق الزر "استيراد".
في نافذة قابلية النقل المنبثقة ، حدد علامة التبويب استيراد واختر ملف التنزيل من جهاز الكمبيوتر الخاص بك.
ثم انقر فوق زر الاستيراد.
بمجرد الانتهاء من ذلك ، سيكون تخطيط القسم متاحًا في Divi Builder.
دعنا نصل إلى البرنامج التعليمي ، أليس كذلك؟
إظهار / إخفاء شريط تمرير الفيديو بناءً على حالة تسجيل الدخول باستخدام Divi
قم بإنشاء صفحة جديدة باستخدام تخطيط مسبق الصنع
لنبدأ مع البرنامج التعليمي الخاص بنا عن طريق إنشاء صفحة جديدة وتشغيلها باستخدام أحد تخطيطاتنا المعدة مسبقًا.
هيريس كيفية القيام بذلك:
- أنشئ صفحة جديدة وأعطها عنوانًا
- انقر لاستخدام Divi Builder (في الواجهة الأمامية)
- حدد لاستخدام تخطيط مسبق الصنع
- ابحث عن تخطيط صفحة وصفات اختصاصي التغذية وحدده.
- لتحميل التخطيط إلى الصفحة ، ما عليك سوى النقر فوق الزر "استخدام هذا التخطيط".
بمجرد تحميل التخطيط على الصفحة ، تكون جاهزًا لإضافة شريط تمرير الفيديو الثابت إلى الصفحة.
إضافة شريط تمرير الفيديو إلى الصفحة
في صفحة الوصفة ، سترى مقطع فيديو بعرض كامل على التوالي أسفل الصف مباشرةً مع المكونات والتعليمات. سنقوم باستبدال الفيديو بوحدة شريط تمرير فيديو. للقيام بذلك ، احذف وحدة الفيديو.
ثم أضف وحدة شريط تمرير فيديو جديدة في مكانها.

إضافة مقاطع فيديو إلى شريط التمرير
لإضافة مقاطع فيديو إلى شريط التمرير ، افتح إعدادات شريط تمرير الفيديو. تحت علامة تبويب المحتوى ، سترى فيديو وهمي موجود بالفعل. افتح إعدادات الفيديو الموجود.
بعد ذلك ، احذف الفيديو الافتراضي وانقر على أيقونة إضافة فيديو لإضافة فيديو جديد إلى شريط التمرير.
في هذا المثال ، أقوم بإضافة مقطع فيديو مستضاف ذاتيًا. من الجيد دائمًا تحميل نسخة MP4 و Webm من ملف الفيديو.
بعد ذلك ، يمكننا إضافة تراكب صورة إلى الفيديو.
بمجرد الانتهاء ، احفظ التغييرات.
لإنشاء مقاطع فيديو إضافية ، ارجع إلى إعدادات شريط تمرير الفيديو وقم بتكرار الفيديو الحالي 3 مرات للحصول على إجمالي 4 مقاطع فيديو. بعد ذلك ، ضمن خيار التراكب ، قم بتبديل YES لإظهار تراكبات الصور على الفيديو الرئيسي.
إضافة خيار العرض الشرطي
بالنسبة لهذا البرنامج التعليمي ، سنعرض شريط تمرير الفيديو هذا فقط للمستخدمين الذين قاموا بتسجيل الدخول. للقيام بذلك ، انتقل إلى علامة التبويب خيارات متقدمة وانقر لإضافة شرط جديد ضمن مجموعة خيارات الشروط.
في القائمة المنسدلة لظروف العرض ، حدد حالة تسجيل الدخول من القائمة. تأكد من تحديد العرض فقط إذا قام المستخدم بتسجيل الدخول . ثم احفظ التغييرات.
نصيحة إضافية: قم بإنشاء CTA أو نموذج تسجيل الدخول للمستخدمين الذين لم يتم تسجيل دخولهم
بالنسبة للزوار الجدد ، قد ترغب في إنشاء نوع من CTA للتسجيل أو نموذج تسجيل الدخول لتسهيل تسجيل الدخول ومشاهدة مقاطع الفيديو. للقيام بذلك ، يمكنك إنشاء صف جديد من عمودين مع صورة تبدو كفيديو في العمود الأيسر ونموذج تسجيل الدخول في العمود الأيمن كما في لقطة الشاشة أدناه.
ثم افتح إعدادات الصف وأضف شرط العرض بناءً على حالة تسجيل الدخول. هذه المرة فقط ، حدد للعرض فقط في حالة تسجيل خروج المستخدم . سيعرض هذا المحتوى للمستخدمين فقط إذا تم تسجيل خروجهم.
عند إضافة نموذج تسجيل الدخول ، تأكد من تحديث خيار إعادة التوجيه لإعادة التوجيه إلى الصفحة الحالية . سيؤدي ذلك إلى تحسين تجربة المستخدم للمستخدمين الذين يرغبون في تسجيل الدخول وعرض مقاطع الفيديو على نفس الصفحة.
لمعرفة كيفية إنشاء قسم CTA للمستخدمين الذين تم تسجيل خروجهم من البداية ، تحقق من منشورنا حول كيفية إنشاء منشورات مدونة حصرية للأعضاء مع خيارات شروط Divi.
النتائج النهائية
هنا نظرة على أشرطة تمرير الفيديو النهائية. لاحظ كيف يتم إخفاؤها عن المستخدمين حتى يقوموا بتسجيل الدخول باستخدام نموذج تسجيل الدخول.
المشكلة مع مقاطع فيديو YouTube / التضمينات باستخدام تراكبات الصور في الفيديو الرئيسي
إذا كنت تستخدم عنوان URL على YouTube لتضمين مقاطع فيديو متعددة في شريط تمرير الفيديو ، فمن الأفضل عدم استخدام خيار Divi المدمج لـ "إظهار تراكبات الصور على الفيديو الرئيسي". سيؤدي ذلك إلى تشغيل صوت الفيديو تلقائيًا من البداية في الحالة اللاصقة مما يؤدي إلى تكرار تشغيل الصوت على فترات زمنية مختلفة.
ليس هذا هو الحال بالنسبة لمقاطع الفيديو ذاتية الاستضافة بتنسيق ملف mp4 أو webm. يمكنك إظهار تراكبات الصور على الفيديو الرئيسي لمقاطع الفيديو ذاتية الاستضافة. لذلك إذا كنت ترغب في استخدام صورة تراكب Divi وأيقونة التشغيل مع Divi Video Module ، فيجب عليك إضافة ملفات / عناوين URL لملفات الفيديو MP4 و Webm بدلاً من ذلك.
ومع ذلك ، لا يزال بإمكانك إضافة تراكبات صور مخصصة إلى مقاطع فيديو Youtube في شريط تمرير الفيديو. سيستمر ظهورهم في عناصر التحكم في الصورة المصغرة أسفل الفيديو الرئيسي.
افكار اخيرة
إن امتلاك القدرة على إظهار / إخفاء أشرطة تمرير الفيديو بناءً على حالة تسجيل الدخول يمكن أن يكون مفيدًا عندما تريد تقديم محتوى متميز للأعضاء أو المشتركين.
لمزيد من المعلومات ، تحقق من منشور مشابه حول كيفية إنشاء منشورات مدونة حصرية للأعضاء مع خيارات شرط Divi.
أتطلع إلى الاستماع منك في التعليقات.
هتافات!