القائمة الرئيسية

الصفحات

طريقة جعل فيديوهات اليوتيوب متجاوبة تلقائيا على مدونات بلوجر



محتويات المقال
كيفية جعل فيديو يوتيوب متجاوب تلقائيا على مدونة بلوجر:

هل يمكنني جعل فيديوهات اليوتيوب متجاوبة و متناسقة تلقائيا على مدونات بلوجر ؟
هل هناك طريقة لجعل جميع الفيديوهات متناسبة في تدوينة بلوجر ؟
كيف أجعل فيديوهاتي متجاوبة ومتوافقة مع جميع شاشات الهواتف الذكية على بلوجر ؟

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

  • أولا قم بالتوجه إلى لوحة تحكم بلوجر
  •  ثانيا إختر المظهر ثم تحرير  html
  • ثالثا أبحث عن الرمز ]]></b:skin> ثم أضيف الكود التالي فوق ]]></b:skin>


-------------------------------------------
/* Responsive Youtube */
.post-body iframe{width:100%!important;}
@media screen and (max-width:960px){
.post-body iframe{max-height:90%}}
@media screen and (max-width:768px){
.post-body iframe{max-height:75%}}
@media screen and (max-width:600px){
.post-body iframe{max-height:60%}}
@media screen and (max-width:480px){
.post-body iframe{height:auto!important;max-height:auto!important}}
---------------------------------------------

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

تعليقات