كيف تجعل مقاطع فيديو YouTube مستجيبة في Blogger

مقاطع فيديو مستجيبة تحسن من أداء مدونتك 

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

في الواقع ، قد تكون مقاطع الفيديو مهمة جدًا لجعل قراءنا يفهمون الموضوع ، وزيادة مشاركة المستخدم ، وجعل نشر مدونتنا غنية وقيمة ، إلخ. أيضًا ، إذا كان لديك قناة YouTube الخاصة بك وتقوم بإنشاء مقاطع فيديو تعليمية أيضًا ، فأنت سوف تحتاج إلى تضمين مقاطع الفيديو هذه في مشاركات المدونة ذات الصلة. بهذه الطريقة ، ستحصل على المزيد من المشاهدات والمتابعين والمشتركين لقناتك على YouTube. ولكن الأمر الأهم هو أنه إذا لم تتمكن من جعل مقاطع فيديو youtube هذه سريعة الاستجابة ، هناك احتمال كبير لفقدان زوار الجوال لمدونتك. كل الأشياء التي تم وضعها في الاعتبار ، أوصي بأن تجعل مقاطع فيديو youtube الخاصة بك سريعة الاستجابة وتحظى بشعبية أفضل بمعدل 100 مرة لكل منشور من مشاركات مدونتك. أيضا ، لجعل كل بلوق وظيفة أكثر سهولة للقارئ ، وجذابة وغنية. لذلك دعونا نرى هذه العملية:
العملية برمتها لجعل أشرطة فيديو يوتيوب تستجيب في مدون بلوق لها جزءان رئيسيان. يمكننا القيام بذلك من خلال: 
1- لصق مقتطف صغير من شفرة CSS في قالب المدون الخاص بنا مرة واحدة.
2- الحصول على شفرة iframe للفيديو من youtube ولصقها في منشور مدونة Blogger داخل 

"<div> ... .. </div>" مخصصة.

 الجزء الأول:

1. قم بتسجيل الدخول إلى حساب Blogger بالنقر هنا وانتقل إلى منطقة "القالب / السمة".

2. الآن انقر على زر "تحرير HTML". 

3. بعد ذلك ، سترى محرر HTML الخاص بقالب المدون. من هنا ، ابحث عن الكود ]]></b:skin>

4. امسك مقتطف CSS أدناه والصقه مباشرةً أعلى ]]></b:skin>

Responsive Video By https://bloggersorigin.com --------------------------------------------------------------------*/ .video-embed-area { margin: 0px auto; max-width: 560px;} .video-container { max-width: 100%; height: 0; position: relative; overflow: hidden; padding-bottom: 56%;} .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

5. أخيرًا ، انقر فوق الزر "حفظ القالب" ، وقد انتهيت من تنفيذ كود CSS لجعل مقاطع فيديو youtube تستجيب في مدونة المدون الخاصة بنا.

 الجزء التاني:

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

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

2. عد إلى حساب المدون الخاص بك وقم بإنشاء "منشور جديد". 

3. حدد وضع "HTML" لمحرر منشور مدونة Blogger. (عادةً ، يبقى في وضع "إنشاء".) 

4. ابحث عن المنطقة المحددة التي ترغب في إضافة الفيديو إليها داخل مدونتك. انسخ شفرة HTML التالية والصقها في تلك المنطقة.

<div class="video-embed-area"> <div class="video-container"> <iframe width="560" height="315" src="https://www.youtube.com/embed/P4zfxEVqYaw" frameborder="0" allowfullscreen></iframe> </div> </div>

5. أخيرًا ، استبدل كود iframe المميز باللون الأحمر بكود iframe لفيديو youtube الخاص بك. 
هذا هو. ستجد بعدها الفيديو مستجيبًا بعد نشر منشور المدونة الخاص بك.

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