الدرس 50: دمج فيديوهات اليوتيوب فى بلوجر وجعلها متوافقة و متجاوبة مع الشاشات الذكية

شرح طريقة دمج و اضافة و جعل فيديوهات اليوتيوب متوافقة و متجاوبة على شاشات الهواتف و الاجهزة اللوحية الذكية فى مواضيع مدونة  بلوجر  Making Embedded Videos youtube responsive in Blogger

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

دمج فيديوهات اليوتيوب فى بلوجر وجعلها متوافقة و متجاوبة مع الشاشات الذكية

فى هذا الفيديو التعليمي سنشرح  :
- كيفية ادراج و اضافة فيديوهات اليوتيوب على مواضيع مدونة بلوجر
- طرق التعديل على مقاسات فيديوهات اليوتيوب فى مشاركات بلوجر
- طريقة جعل فيديوهات اليوتيوب متوافقة و متجاوبة مع شاشات الهواتف و الاجهزة اللوحية

كيف نجعل فيديو اليوتيوب متجاوب مع شاشات الاجهزة فى مواضيع بلوجر

- ندخل الى قالب المدونة
- نبحث عن الكود  ]]></b:skin> و نضع فوقه هذا الكود ونقوم بالحفظ

/*------start youtube responsive arabes1.com------*/ .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .entry-content img, .entry-content iframe, .entry-content object, .entry-content embed { max-width: 100%;} /*------end youtube responsive arabes1.com------*/

- الان يجب عليك فى كل مشاركة جديدة على مدونتك تريد اضافة او ادماج فيديو يوتيوب عليها ان تقوم بالتالي :
- فى مشاركة جديد اختر المكان الذي تريد ادماج الفيديو فيه , ثم اذهب الى صفحة HTML  للموضوع

 و قم باضافة هذا الكود : <div class="video-container"> رابط مشاركة الفيديو </div>

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