كيفية ضغط أو تصغير CSS و JavaScript في قالب بلوجر

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

يمكن لأي شخص تصغير CSS و JavaScript بسهولة عن طريق إجراء بعض التغييرات على قالب المدونة ويمكنه زيادة سرعة تحميل الصفحة. وبالنسبة لمنصة الووردبريس، فإنها توفر العديد من المكونات والإضافات المجانية التي يمكنك استخدامها لتقليل CSS و JavaScript بسهولة. ولكن في بلوجر، ستقوم يدوياً بتقليل CSS و JavaScript. لهذا سأساعدك على تصغير ال CSS و ال JavaScript في قالب بلوجر، وأيضاً أعلمك كيفية ضغط كود HTML عبر الإنترنت لزيادة سرعة التحميل.

كيف يتم تصغير CSS و JavaScript

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

توصي جميع محركات البحث بتقليل عدد الطلبات من صفحات الويب، ودمج JavaScript خارجي في ملف واحد، وتقليل حجم CSS.

إقرأ أيضاً: كيفية زيادة سرعة الموقع بدون اضافة أكواد

لماذا يجب عليك تصغير CSS و JavaScript

توصي Google وجميع محركات البحث الأخرى بشدة بتقليل CSS و JavaScript لمدونتك. السبب الرئيسي هو تسريع سرعة تحميل صفحات الويب للحصول على تصنيفات عالية. ويعد تقليل CSS و JavaScript أيضاً جزءاً مهماً من تحسين محركات البحث، وستحصل على تجربة مستخدم أفضل. ويمكنك القيام بذلك عن طريق تقليل حجم ملفات الترميز CSS و JavaScript لمدونتك.

تصغير (Minify ) VS الضغط ( Compress )

التصغير أو Minify هو مصطلح برمجة نموذجي يعني إزالة الأحرف غير المرغوب فيها وغير المفيدة وغير الضرورية. ويؤدي تصغير CSS و JavaScript إلى تسريع تحميل صفحاتك، عن طريق إزالة (المسافات والأحرف وكتل عناوين URL والمحددات) وجعلها متوافقة مع محركات البحث.

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

كيفية ضغط كود HTML في قالب بلوجر

سنقوم هنا بضغط HTML في قالب بلوجر، ولكن قبل البدء يوصى بحفظ نسخة من قالب بلوجر الخاص بك في حال احتجت إلى تغيير القالب الخاص بك أو في حالة حدوث أخطاء. يوجد أداة على الإنترنت تسمى HTML Compressor والتي تسمح لك بتقليل حجم كود HTML الخاص بقالب بلوجر الخاص بك بأمان. يمكنه أيضاً ضغط الجافا سكريبت ويمكنه تقليل تشفير CSS. باستخدام هذه الأداة عبر الإنترنت يمكنك تحديد مستوى ضغط HTML ،وتمكين تحسين JavaScript أو تعطيله، وتصغير ال CSS.

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

  • افتح حساب blogger الخاص بك وافتح القالب ثم انقر فوق تحرير HTML.
  • اضغط على CTRL+A في نفس الوقت على لوحة المفاتيح لتحديد الكل.
  • افتح الآن موقع HTML Compressor في علامة تبويب أخرى.
  • تخطي كامل التعليمات البرمجية في مربع الضغط.
  • حدد “Blogger” من القائمة المنسدلة على اليمين.
  • اضغط على زر “ضغط” من أسفل الصفحة.
  • انتظر حتى تكتمل العملية ، اعتمادًا على حجم HTML الخاص بك.
  • بمجرد الانتهاء من ذلك ، انسخ الكود المضغوط بالكامل والصقه في HTML قالب المدونة.
  • انقر فوق حفظ واستمتع بسرعة تحميل الصفحة بسرعة.

تصغير Css و JavaScript

إقرأ أيضاً: ضغط الصور إلى WebP في بلوجر وزيادة سرعة الموقع

كيفية تصغير CSS على بلوجر

هناك العديد من الأدوات المتاحة عبر الإنترنت لتقليل CSS و JavaScript. ولكن هناك نوعان من أفضل الأدوات على الانترنت CSSCompressor و CSSMinifier. وهناك أداة أخرى عبر الإنترنت يمكنها تصغير CSS وجافا سكريبت في وقت واحد تسمى Minifier.org ، ومن الأسهل بكثير استخدام أحد الضواغط العديدة المتاحة عبر الإنترنت.

  • أدخل لوحة تحكم بلوجر الخاصة بك
  • انقر فوق المظهر من الشريط الجانبي وانقر فوق تحرير HTML.
  • لتصغير CSS، اضغط CTRL+Fعلى لوحة المفاتيح للبحث.
  • اكتب <b:skin> واضغط Enter.
  • انسخ كود CSS بالكامل بين <b:skin>و </b:skin>.
  • اذهب إلى “minifier.org” ، قم بلصق الكود وقم بتحديد CSS واضغط على زر “MINIFY”.
  • بعد بضع ثوان ستحصل على نسخة مصغرة من كود CSS.
  • ارجع إلى أكواد القالب واستبدال الأكواد بين الوسمين <b:skin>و <b:skin>، ثم انقر فوق حفظ قالب.
  • تحقق من سرعة المدونة الخاصة بك وسترى نتائج أفضل

تصغير Css و JavaScript

كيفية ضغط JavaScript في بلوجر

JavaScript Minifier هو محلل JavaScript  ومُصغر، ومجموعة أدوات ضاغط عبر الإنترنت تسمح لك بضغط وتقليص ملفات JavaScript حتى 70٪ من حجمها الأصلي. ما عليك سوى نسخ رمز JavaScript ولصقه، أو يمكنك تحميل ودمج ملفات js متعددة ثم تصغيرها. تزيل أداة Minify JavaScript هذه المسافة البيضاء والمسافة البادئة والأسطر الجديدة وتجعل قراءة Javascript أصعب عند عرض المصدر وأكثر صعوبة في عكسها أو نسخها. يمكنه دمج جميع ملفات Javascript في ملف واحد ، وتقليل عدد طلبات HTTP وجعل ضغط أكواد JavaScript أكثر فعالية.

  • انتقل إلى لوحة بلوجر الخاصة بك، وانقر فوق المظهر وانقر فوق تحرير HTML.
  • لتصغير JavaScript ، اضغط على CTRL + F ، واكتب <script> واضغط على Enter.
  • انسخ كود JavaScript بالكامل.
  • انتقل إلى “minifier.org” ، إلصق الأكواد في مربع مصغر JavaScript واضغط على الزر “MINIFY”.
  • ستحصل على نسخة مصغرة من كود JavaScript.
  • ارجع إلى HTML وقم باستبدال الرمز.
  • الآن سوف تحصل على نتائج أفضل للسرعة.
يرجى البحث عن كل <script>وتغييرها إلى <script type='text/javascript'> ، أيضاً قم بالبحث عن <style> وتغييرها إلى<style type='text/css'>