كيفية إزالة CSS و JS غير المستخدمة في WordPress (سهل جدًا)

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

لحسن الحظ، هناك طريقة سهلة للغاية للقيام بذلك. لست بحاجة إلى أي معرفة تقنية خاصة لتتمكن من إزالة CSS وJS غير المستخدمة من موقع WordPress الخاص بك.

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

الخروج: أفضل 7 خدمات استضافة WordPress المُدارة من Google Cloud

ما هو CSS غير المستخدم؟

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

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

إذا كان هناك عدد كبير جدًا من CSS غير الضرورية ولكنها تقوم بالتحميل وتبطئ وقت قراءة المتصفح وعرض الصفحة، فقد يصبح هذا مشكلة.

بصرف النظر عن المكونات الإضافية، يكتب مطورو السمات الكثير من الأشياء في style.css والتي لا تكون ضرورية في الغالب. ولكن سواء كانت هناك حاجة إليها أم لا، يتم تحميلها كلما تم تحميل موقعك!

قد لا يشكل CSS واحد غير مستخدم مشكلة، ولكن الكثير من CSS غير المستخدم يمكن أن يؤثر على وقت تحميل موقع الويب الخاص بك.

الخروج: أفضل 10 قوالب ووردبريس سريعة و ممتازة 

كيفية التعرف على CSS غير المستخدمة

إن العثور على ملفات CSS وJS غير المستخدمة أمر سهل للغاية. هناك طريقتان أوصي بهما.

الطريقة الأولى هي تحليل موقعك الإلكتروني من خلال Google PageSpeed ​​Insight. تحقق مما إذا كان موقعك الإلكتروني يعاني من مشكلة إزالة CSS غير المستخدمة. انقر عليها وستتمكن من تحديد المكون المسؤول عن ذلك في موقعك.

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

الخيار الثاني هو الحصول على تحليل أكثر تفصيلاً. يمكنك تحقيق ذلك باستخدام أدوات Chrome Dev.

في متصفح Chrome، افتح أدوات تطوير Chrome ثم انتقل إلى التغطية. ثم انقر فوق زر إعادة التحميل داخل منطقة التغطية. يمكنك العثور على دليل شامل حول كيفية القيام بذلك في أداة Google Developers.

الخيار الآخر هو استخدام jitbit للبحث عن محددات CSS غير المستخدمة. تستطيع ايضا استخذام تنقيةCSS للعثور على CSS غير المستخدمة

كيفية إزالة CSS غير المستخدمة

اتبع الخطوات التالية لإزالة CSS غير المستخدمة من WordPress:

1. قم بتثبيت Asset CleanUp

انتقل إلى البرنامج المساعد ثم أضف برنامجًا جديدًا. ثم اكتب "Asset CleanUp" في مربع البحث في صفحة إضافة برنامج مساعد جديد. قم بتثبيت البرنامج المساعد وتنشيطه.

2. انتقل إلى إعدادات البرنامج الإضافي

للوصول إلى إعدادات البرنامج الإضافي، من لوحة تحكم WordPress انقر فوق الإعدادات ثم انقر فوق Asset CleanUp.

3. قم بإلغاء تحميل CSS وJS غير المرغوب فيهما

في إعدادات البرنامج المساعد، قد تحتاج إلى قبول معرفتك بكيفية عمل البرنامج المساعد تحت صنبور تجريد الدهون قبل البدء.

لتفريغ CSS وJS، انقر فوق مدير CSS وJSS. من هناك، يمكنك إزالة أي CSS وJS لا تحتاج إليها. يمكنك إزالتها فقط للصفحة الرئيسية، أو للموقع بأكمله أو لعنوان URL محدد. يمكنك أيضًا الإزالة للمشاركات أو الصفحات أو الفئات.

على سبيل المثال، إلغاء تحميل أي نموذج اتصال للموقع بأكمله باستثناء صفحة اتصل بنا

خذ وقتك وقم بتحميل كل ملفات CSS وJS التي تعلم أنها غير ضرورية. تأكد من اختبار موقعك بعد الانتهاء للتأكد من أن كل شيء على ما يرام.

إزالة إضافات CSS WordPress غير المستخدمة

فيما يلي بعض المكونات الإضافية التي يمكنك استخدامها لإزالة CSS غير المستخدمة في WordpPress:

1. Asset CleanUp: Page Speed ​​Booster

تنظيف الأصول: تعزيز سرعة الصفحة يجعل من السهل إزالة CSS وJS غير المستخدمة في WordPress حتى للمبتدئين. كل ما عليك فعله هو إلغاء تنشيط CSS معين غير مطلوب لصفحة معينة.

يمكنك أيضًا إلغاء تنشيط المنشورات الفردية فقط. باستخدام الإصدار المتميز، يمكنك إلغاء تنشيط CSS/JS غير المستخدم بواسطة المكونات الإضافية.

هذا المكون الإضافي عبارة عن مكون إضافي لتحسين الأداء بالكامل مع العديد من الخيارات الأخرى لتسريع WordPress. إزالة CSS/JS غير المستخدمة هي مجرد جزء منها.

في هذه التدوينة، استخدمت هذا البرنامج المساعد الذي يحتوي على دليل.

2. WP الصواريخ

WP Rocket يعد WP Rocket هو المكون الإضافي رقم واحد لتحسين الأداء في WordPress. إذا كنت مبتدئًا، أعني إذا لم تكن خبيرًا أو مرتاحًا في WordPress، فإن WP Rocket هو أسهل طريقة لإزالة CSS غير المستخدم.

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

قم بتثبيت البرنامج الإضافي عبر لوحة التحكم>المكونات الإضافية>إضافة جديد>تحميل.

ما عليك سوى الانتقال إلى إعدادات WP Rocket ثم النقر فوق علامة التبويب "تحسين الملفات". ثم قم بالتمرير لأسفل وستجد "إزالة CSS غير المستخدمة"، ثم حدد المربع واحفظ وامسح ذاكرة التخزين المؤقت.

3. Perfmatters

Perfmatters هو مكون إضافي مميز تم تطويره بواسطة Brian Jackson وشقيقه Brett Jackson. يمكن لهذا المكون الإضافي المساعدة في إزالة CSS غير المستخدمة بسهولة بالغة.

أولاً، عليك شراء البرنامج الإضافي. ثم تثبيته. قم بتنشيط الترخيص. عند الانتقال إلى الإعدادات، قم بتشغيل مدير البرامج النصية.

ما عليك سوى الانتقال إلى أي صفحة أو منشور على موقع الويب الخاص بك، وستجد أيقونة مدير النصوص البرمجية في قائمة لوحة التحكم، انقر عليها. ستتمكن من إزالة CSS وJS غير المستخدمة من الصفحة أو على مستوى العالم.

هذا المكون الإضافي هو مكون إضافي لتحسين الأداء، ويأتي مع العديد من الخيارات الأخرى لتسريع WordPress. يعد إزالة CSS/JS غير المستخدم جزءًا منه.

4. مدير CSS JS

مدير CSS JS يمكنك إزالة CSS أو JS من الهاتف المحمول أو سطح المكتب على وجه التحديد. اعتمادًا على ما تريد تحقيقه.

يمكن لهذا المكون الإضافي أيضًا تأجيل تحميل ملفات CSS أو JS.

الخاتمة

إذا كان لديك الكثير من CSS وJS غير المستخدمة، فسوف تلاحظ تحسنًا كبيرًا في درجات السرعة والأداء.

قد يكون من المستحيل إزالة كل ملفات CSS غير المستخدمة، ولكن يمكنك تقليلها إلى الحد الأدنى. أستخدم Asset CleanUp لإزالة ملفات CSS غير المستخدمة تارجتريند.

تذكر، قم بالتحسين ولكن لا تكن مهووسًا به كثيرًا، إلا إذا كنت تريد أن يبدو موقعك هكذا أسرع موقع في العالم.

اقرأ أيضا:

كيفية التخلص من الموارد التي تعيق العرض في WordPress

كيفية جعل الووردبريس سريع جدًا

كيفية توجيه الزوار إلى مدونتك