So entfernen Sie ungenutztes CSS und JS in WordPress (sehr einfach)

Viele ungenutzte CSS können Ihre Website verlangsamen. Wenn Sie Ihre Website mit Google PageSpeed ​​Insight testen, erhalten Sie möglicherweise eine Warnung, nicht verwendete CSS zu entfernen. Es gibt eine einfache Möglichkeit, dies ohne Codierung und Technik zu tun.

Viele ungenutzte CSS und JS auf Ihrer Website können die Ladezeit Ihrer Website beeinträchtigen. Wenn Sie Ihre Website über a . betreiben Geschwindigkeitstest-Tools sowie Google PageSpeed ​​Insight, erhalten Sie möglicherweise eine Warnung zum Entfernen von nicht verwendetem CSS.

Zum Glück gibt es eine sehr einfache Möglichkeit, dies zu tun. Sie benötigen keine besonderen technischen Kenntnisse, um ungenutztes CSS und JS von Ihrer WordPress-Site entfernen zu können.

Dies liegt an einem erstaunlichen Plugin, das als . bekannt ist Asset CleanUp: Page Speed ​​Booster. Mit diesem Plugin ist das Entfernen von ungenutztem CSS so einfach wie das Klicken auf ein paar Schaltflächen. Alternativ, wenn es Ihnen nichts ausmacht, ein paar Dollar pro Jahr auszugeben, mit WP Rakete, es gibt einen entfernten ungenutzten CSS-Button, aktiviere ihn einfach und das Plugin entfernt automatisch alle ungenutzten CSS.

Kasse: Top 7 verwaltetes Google Cloud WordPress Hosting

Was ist ungenutztes CSS?

Ungenutztes CSS ist eine CSS-Datei, die auf einer Seite vorhanden ist, aber meistens nicht zum Laden der Seite benötigt wird. Wenn ein Besucher eine Website öffnet, muss der Browser normalerweise alle externen Stylesheets auf der besuchten Seite herunterladen, analysieren und verarbeiten, bevor er dem Besucher den Seiteninhalt anzeigen kann. Wenn auf einer solchen Seite CSS vorhanden ist, das auf der Seite nicht verwendet wird, verschwendet der Browser seine Zeit damit.

Ein klassisches Beispiel hierfür sind die meisten der verwendeten Kontaktformular-Plugins. Obwohl diese Plugins meistens nur auf der Kontaktseite verwendet werden, laden Sie ihr CSS auf der gesamten Website. Es spielt keine Rolle, ob es sich um die Homepage handelt, auf der es nicht verwendet wird, das CSS wird geladen.

Wenn zu viele CSS nicht benötigt werden, aber geladen werden und die Zeit des Browsers zum Lesen und Anzeigen einer Seite verlangsamt, kann dies zu einem Problem werden.

Abgesehen von Plugins schreiben Theme-Entwickler viele Dinge in die style.css, die meist nicht benötigt werden. Aber ob nötig oder nicht, sie werden immer geladen, wenn Ihre Site geladen wird!

Ein ungenutztes CSS ist vielleicht kein Problem, aber viele ungenutzte CSS können die Ladezeit Ihrer Website beeinträchtigen.

Kasse: Top 10 der schnellsten und besten WordPress-Themes 

So identifizieren Sie ungenutztes CSS

Ungenutztes CSS und JS zu finden ist sehr einfach. Es gibt zwei Ansätze, die ich empfehlen werde.

Eine besteht darin, Ihre Website über Google PageSpeed ​​Insight zu analysieren. Überprüfen Sie, ob auf Ihrer Website ein Problem mit dem Entfernen nicht verwendeter CSS vorliegt. Klicken Sie darauf und Sie können die dafür verantwortliche Komponente Ihrer Website identifizieren.

Nicht verwendetes CSS

Sie können von oben sehen, dass ein Fall von nicht verwendetem CSS aufgezeichnet wurde. Ich kann das Plugin und den Speicherort des nicht verwendeten CSS sehen, indem ich mir das anschaue.

Die zweite Möglichkeit besteht darin, eine detailliertere Analyse zu erhalten. Sie können dies erreichen, indem Sie Chrome Dev-Tools verwenden.

Öffnen Sie in Ihrem Chrome-Browser die Chrome-Entwicklungstools und gehen Sie dann zur Abdeckung. Klicken Sie dann innerhalb des Abdeckungsbereichs auf die Schaltfläche zum Nachladen. Sie finden a umfassende Anleitung dazu im Google Developers Tool.

Die andere Möglichkeit ist zu verwenden Jitbit, um nach ungenutzten CSS-Selektoren zu suchen. Sie können auch verwenden PurifyCSS um ungenutztes CSS zu finden

So entfernen Sie ungenutztes CSS

Befolgen Sie diese Schritte, um ungenutztes CSS aus WordPress zu entfernen:

1. Installieren Sie Asset CleanUp

Gehen Sie zu Plugin und dann Neu hinzufügen. Dann geben Sie „Asset CleanUp“ in das Suchfeld der Seite Neues Plugin hinzufügen ein. Installieren und aktivieren Sie das Plugin.

2. Gehen Sie zu den Plugin-Einstellungen

Um auf die Plugin-Einstellungen zuzugreifen, klicken Sie im WordPress-Dashboard auf Einstellungen und dann auf Asset CleanUp.

3. Entladen Sie unerwünschtes CSS und JS

In den Plugin-Einstellungen müssen Sie möglicherweise akzeptieren, dass Sie wissen, wie das Plugin unter dem Stripping-Fat-Tap funktioniert, bevor Sie beginnen.

Um CSS und JS zu entladen, klicken Sie auf CSS- und JSS-Manager. Von dort aus können Sie CSS und JS entfernen, die Sie nicht benötigen. Sie können es nur für die Startseite, für die gesamte Website oder für eine bestimmte URL entfernen. Sie können auch für Beiträge, Seiten oder Kategorien entfernen.

Ein Beispiel ist das Entladen eines Kontaktformulars vom Laden für die gesamte Website mit Ausnahme der Kontaktseite

CSS entladen

Nehmen Sie sich Zeit und entladen Sie jedes CSS und JS, von dem Sie wissen, dass es nicht benötigt wird. Stellen Sie sicher, dass Sie Ihre Website testen, nachdem Sie fertig sind, um sicherzustellen, dass alles in Ordnung ist.

Entfernen Sie nicht verwendete CSS-WordPress-Plugins

Hier sind einige Plugins, mit denen Sie ungenutztes CSS in WordpPress entfernen können:

1. Asset CleanUp: Page Speed ​​Booster

Asset CleanUp

Asset CleanUp: Page Speed ​​Booster macht es auch Anfängern leicht, ungenutztes CSS und JSin WordPress zu entfernen. Sie müssen lediglich ein bestimmtes CSS deaktivieren, das für eine bestimmte Seite nicht benötigt wird.

Sie können auch für einzelne Beiträge allein deaktivieren. Mit der Premium-Version können Sie ungenutztes CSS/JS durch Plugins deaktivieren.

Dieses Plugin ist ein komplettes Performance-Plugin mit vielen anderen Optionen, um WordPress zu beschleunigen. Das Entfernen von nicht verwendetem CSS/JS ist nur ein Teil davon.

In diesem Beitrag habe ich dieses Plugin verwendet, hat eine Anleitung.

2. WP Rakete

WP Rakete ist das führende WordPress-Premium-Performance-Plugin. Wenn Sie ein Neuling sind, ich meine, wenn Sie mit WordPress nicht vertraut oder nicht vertraut sind, dann ist WP Rocket der einfachste Weg, um ungenutztes CSS zu entfernen.

Sie müssen das Plugin kaufen. Sobald Sie dies getan haben, können Sie es von Ihrem Konto herunterladen oder in Ihrer E-Mail nach einem Download-Link suchen.

Installieren Sie das Plugin über Dashboard>Plugins>Neu hinzufügen>Hochladen.

Navigieren Sie einfach zu den WP Rocket-Einstellungen und klicken Sie dann auf die Registerkarte „Dateioptimierung“. Scrollen Sie dann nach unten und Sie sehen „Unbenutztes CSS entfernen“, aktivieren Sie das Kontrollkästchen, speichern und leeren Sie den Cache.

Entfernen Sie nicht verwendete CSS WP Rocket

3. Perfmatters

Perfmatters

Perfmatters ist ein Premium-Plugin, das von Brian Jackson und seinem Bruder Brett Jackson entwickelt wurde. Dieses Plugin kann dabei helfen, ungenutztes CSS ganz einfach zu entfernen.

Zuerst müssen Sie das Plugin kaufen. Dann installieren Sie es. Lizenz aktivieren. Wenn Sie zu den Einstellungen navigieren, aktivieren Sie den Skript-Manager.

Gehen Sie einfach zu einer beliebigen Seite oder einem Beitrag auf Ihrer Website. Sie sehen das Skriptmanager-Symbol im Dashboard-Menü, klicken Sie darauf. Sie können ungenutztes CSS und JS von der Seite oder global entfernen.

Dieses Plugin ist ein Performance-Plugin, das viele andere Optionen bietet, um WordPress zu beschleunigen. Das Entfernen von ungenutztem CSS/JS ist ein Teil davon.

4. CSS JS-Manager

CSS-JS-Manager

CSS JS-Manager kann CSS oder JS speziell von Mobile oder Desktop entfernen. Je nachdem, was Sie erreichen möchten.

Dieses Plugin kann auch das Laden von CSS- oder JS-Dateien aufschieben.

Fazit

Wenn Sie viel ungenutztes CSS und JS haben, werden Sie eine große Verbesserung der Geschwindigkeits- und Leistungswerte feststellen.

Es ist möglicherweise unmöglich, alle nicht verwendeten CSS zu entfernen, aber Sie können sie auf ein Minimum reduzieren. Ich verwende Asset CleanUp, um ungenutztes CSS zu entfernen für ZielTrend.

Denken Sie daran, optimieren Sie, aber seien Sie nicht zu besessen davon, es sei denn, Sie möchten, dass Ihre Website so aussieht die schnellste Website der Welt.

Lies auch:

So beseitigen Sie Render-Blocking-Ressourcen in WordPress

Wie man WordPress sehr schnell macht

So steigern Sie den Traffic auf Ihren Blog

Mfon Abel Ekene

Mfon Abel Ekene

Es macht mir Spaß, Inhalte zu erstellen, die hilfreich sind. Meine Leidenschaft ist es, der Internetbevölkerung zu helfen, das zu finden, was sie brauchen, indem ich sie in die richtige Richtung weise. Es ist das, was ich liebe, und ich habe viele Stunden der Recherche und des Testens investiert, um sicherzustellen, dass ich mit meinen Inhalten auf TargetTrend genau das tue.

Artikel: 50

Erhalten Sie Technikfreaks

Tech-Trends, Startup-Trends, Rezensionen, Online-Einkommen, Web-Tools und Marketing ein- oder zweimal monatlich

3 Kommentare

  1. Gute Liste. Die Asset-Bereinigung ist für die meisten Themen nicht gut genug, da ich die Haupt-CSS-Datei nicht entfernen kann. Normalerweise ist auch die Haupt-CSS-Datei sehr groß.

    Das einzige kostenlose Plugin, das ohne ein Abonnement eines externen Dienstes auskommt, ist Debloat. Vielleicht möchten Sie es in Betracht ziehen: https://wordpress.org/plugins/debloat/

Hinterlassen Sie uns einen Kommentar

E-Mail-Adresse wird nicht veröffentlicht. Pflichtfelder sind MIT * gekennzeichnet. *