توافق فيديوهات يوتيوب في بلوغر مع جميع الأجهزة

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

توافق فيديوهات يوتيوب في بلوغر مع جميع الأجهزة

تحتوي العملية على جزءين رئيسيين. يمكننا تنفيذ ذلك من خلال إضافة مقتطف صغير من شفرة CSS في نموذج المدونة لدينا مرة واحدة. وأخيرًا الحصول على شفرة iframe للفيديو من YouTube ولصقها في مشاركة مدونة بلوجر داخل “<div> .. </ div>” مخصص. دعنا نذهب للجزء الأول:

قم بتسجيل الدخول إلى حساب Blogger والانتقال إلى منطقة “المظهر” والانتقال إلي الزر “تحرير HTML” كما هو موضح أدناه.

توافق فيديوهات يوتيوب في بلوغر مع جميع الأجهزة

بعد ذلك، سترى محرر HTML قالب المدونة الخاصة بك. من هنا ابحث عن رمز ]]></b:skin> عبر الضغط على CTRL+F من لوحظ المفاتيح الخاصة بك.

كود توافق توافق فيديوهات يوتيوب في بلوغر

قم بلصق مقتطف CSS التالي وألصقه فوق “]]> </ b: skin>” كما هو موضح أدناه.

/* Responsive Video By https://arabitec.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%;}

طريقة توافق فيديوهات يوتيوب في بلوغر

وأخيرا انقر على زر “حفظ المظهر”

إقرأ أيضاً: مدونة بلوغر | عشر معلومات يجب أن تعرفها قبل أن تبدأ التدوين هناك !

إضافة مقاطع فيديو متجاوبة على YouTube في Blogger المشاركة:

قم بجلب شفرة iframe لفيديو من youtube أثناء تضمينه في أي مشاركة مدونة. في الواقع ، ستكون هذه عملية مستمرة. يجب عليك اتباع هذه الخطوات في كل مرة لجعل أي فيديو يستجيب لأي مشاركة مدونة.

حدد الفيديو الذي تريده وانقر على رابط “مشاركة”> “تضمين” كما هو موضح أدناه ونسخ شفرة iframe للفيديو.

كيفية تجعل فيديوهات اليوتيوب متوافقة مع جميع الأجهزة

قم بإنشاء “مشاركة جديدة”، وحدد وضع “HTML” لمحرر المدونة. (عادة في وضع “تأليف”.)

إنشاء مشاركة في بلوغر

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

<div class=”video-embed-area”>

<div class=”video-container”>

<iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/9eBG47E9pik” frameborder=”0″ allowfullscreen></iframe>

</div>

</div>

قم باستبدل شفرة iframe المميزة باللون المظلل لفيديو اليوتيوب الخاص بك .

استبدل شفرة iframe

ملاحظة: يمكنك اتباع العملية المذكورة أعلاه لجعل مقاطع فيديو YouTube سريعة الاستجابة أيضا، إذا كنت ترغب في إضافة أكثر من فيديو واحد إلى مشاركة واحدة فيمكنك القيام بذلك.

إقرأ أيضاً: إنشاء مدونة بلوغر - تعرف على الطريقة الصحيحة لإنشاء مدونتك الخاصة مجانا

إقرأ أيضاً: إضافة آخر المشاركات لبلوجر – كيفية إضافة آخر المشاركات لمدونات بلوجر بشكل جذاب