بسم الله الرحمن الرحيم
والصلاة والسلام على أشرف المرسلين
سيدنا محمد وعلى آله وصحبه أجمعين
بالرغم من انه من الضرورى إستخدام قالب متجاوب لموقعك ليظهر بشكل جيد للمستخدمين الذين يتصفحون موقعك من خلال الهواتف المحمولة إلا أنه لابد من مراعاة أن يكون المحتوى أيضًا متجاوب بما يضمه من نصوص وصور وفيديوهات وجداول ،.......وغير ذلك . وقد تحدثت فى موضوع سابق عن كيفية جعل الفيديو متجاوب لجميع الشاشات والتى تعتمد على إضافة كود CSS قبل كود الفيديو ولكن اليوم سأتحدث عن إضافة بتقنية jQuery تسمى Fitvids plugin تضاف إلى القالب.
قد يهمك أيضًا: كيفية إخفاء وإظهار ادوات مدونة بلوجر على الهاتف
ولتركيب هذه الإضافة لقالب مدونة بلوجر:
- إذهب إلى لوحة تحكم بلوجر ثم تبويب قالب
- قم بتحرير HTML للقالب (ولا تنسى الإحتفاظ بنسخة إحتياطية من القالب)
- إبحث عن الكود التالى بإستخدام لوحة المفاتيح Ctrl+F
</head>
- أضف الكود التالى مباشرة فوق الكود السابق
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"/>
<script src='https://raw.github.com/davatron5000/FitVids.js/master/jquery.fitvids.js'/>
<script>$(document).ready(function(){
$(“#your-video”).fitVids();
});
</script>
- إحفظ القالب
- عند تضمين أى فيديو داخل مشاركة أو صفحة أضف الكود التالى قبل كود تضمين الفيديو بتبويب HTML المشاركة أو الصفحة.
<div id=”your-video”>مثــــــــــال
<div id=”your-video”>
<iframe width="1280" height="720" src="https://www.youtube.com/embed/wQOAfLZqB_0?rel=0" frameborder="0" allowfullscreen></iframe>
بذلك يكون أى فيديو على المدونة بتنسيق متجاوب على جميع الشاشات تابع المزيد من إضافات بلوجر
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا