جعل فيديوهات المدونة متجاوبة مع شاشات العرض بإستخدام جافا سكريبت

طريقة جعل فيديوهات  YouTube , Dailymotion, Vimeo, kickstarter متجاوبة مع شاشات العرض الذكية أثناء عرضها على مدونتك.
الجميل في المكون الإضافي أنه فور تركيبه ستلاحظ أن جميع فيديوهات التي قمت بتضمينها سواء الأقدم أو الأحدث أخذت الإطار الصحيح على صفحة التدوين.

طريقة التركيب

لاتنسى أخذ نسخة إحتياطية من القالب

الخطوة الأولى: لوحة التحكم

• قم بتسجيل حسابك ثم إذهب إلى منصة البلوجر dashboard
• إنتقل للمدونة >> ثم إلى قالب >> ثم إضغط على تحرير  Edit HTML  
• إضغط في وسط محرر الأكواد  ثم   F + Ctrl لإضهار مربع البحث
• بإستعمال  الزر  C +Ctrl  للنسخ و  V +Ctrl  للصق قم بوضع الأكواد في المكان المناسب

لاتنسى أخذ نسخة إحتياطية من القالب

الخطوة الثانية: تركيب الأكواد

• قم بالبحث عن هذا الوسم </body> فوقه أي قبله قم بوضع كود.js
  

  
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fitvids/1.1.0/jquery.fitvids.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
      $(".post-body").fitVids();
    });
  </script>
  

  التعديل على الكود

  الرابط 1.1.0/jquery.fitvids.min.js المحدد بهذا اللون خاص بالسكريبت المسؤول عن تجاوب الفيديوهات ..يمكنك مراجعة جميع إصداراته -من هنا-.

  إسم الكلاس .post-body المحدد بهذا اللون هو معرف حقل المواضيع غالبا ما يكون بهذا الإسم لاتغيره إلا إذا كان الإسم مختلف في قالبك وهذا مسبعد جدا.

check

يمكنك زيارة موقع responsinator.com لمعاينة الفيديو على شاشات العرض الذكية...فقط أدخل رابط الموضوع في الخانة Enter your site ثم إضغط GO