Teilen Sie ein WordPress-Plugin, das CSS und JS zusammenführt

藏色散人
Freigeben: 2021-04-25 17:42:35
nach vorne
2208 Leute haben es durchsucht

Die folgende Tutorial-Kolumne von WordPress stellt Ihnen ein WordPress-Plug-in vor, das CSS und JS kombiniert. Ich hoffe, es wird Freunden, die es benötigen, hilfreich sein!

Wir erwägen normalerweise, mehrere CSS- oder JS-Dateien in einer Datei für die Ausgabe zusammenzuführen. Um dieses Problem zu lösen, habe ich dieses WordPress-Plugin geschrieben, um diesen Zweck in WordPress zu erreichen.

Implementierungsprinzip

Wenn Sie mein vorheriges „PHP Combined Compressed CSS Output Modular CSS Writing“ gelesen haben, können Sie zunächst einige meiner Methoden zur Verarbeitung von Cache-Dateien sowie einige Ideen zum Zusammenführen von Dateien und zum Komprimieren von Codes verstehen. Das Implementierungsprinzip dieses Plug-Ins ist im Wesentlichen das gleiche wie im obigen Artikel.

Installation

Laden Sie zunächst dieses Plugin herunter. Ich hoste es auf meinem GitHub. Sie können es auf dieser Seite herunterladen. Nach dem Herunterladen entpacken Sie es. Laden Sie nach dem Entpacken den gesamten entpackten Ordner direkt in Ihr WordPress-Website-Plug-in-Verzeichnis hoch. Gehen Sie dann in den Hintergrund, um es zu aktivieren.

Verwenden Sie

, um den Hintergrund einzugeben. Unter dem Menü „Einstellungen“ gibt es ein Untermenü „Minimieren“. Nach der Eingabe können Sie die verschiedenen Optionen festlegen und es gibt Kommentare, damit Sie die Funktionen verstehen können.

Sie müssen das Design ändern, wenn Sie wp-minify verwenden, da die Art und Weise, wie Sie CSS und JS ausgeben, unterschiedlich ist. Löschen Sie in Ihrem Theme die ursprüngliche CSS- und JS-Ausgabe und verwenden Sie die folgende Methode zur Ausgabe von JS:

<?php wp_minfiy_js([&#39;/wp-content/themes/yourtheme/js/base.js&#39;,&#39;/wp-content/themes/yourtheme/js/module.js&#39;,&#39;/wp-content/themes/yourtheme/js/others.js&#39;]); ?>
Nach dem Login kopieren

Die Methode zur Ausgabe von CSS ist dieselbe, verwenden Sie jedoch eine andere Funktion wp_minify_css(). Der Parameter der Funktion ist ein Array und das Element innerhalb des Arrays ist der Pfad zur Skriptdatei. Nehmen Sie das WordPress-Installationsverzeichnis als Stammverzeichnis und schreiben Sie den vollständigen relativen Pfad.

Warum sollten wir Skripte relativ zum Stammverzeichnis von WordPress schreiben? Anstatt relativ zu Ihrem aktuellen Theme-Verzeichnis? Tatsächlich ist der Grund sehr einfach, denn das CSS oder JS, auf das Sie verweisen, befindet sich nicht unbedingt im Themenverzeichnis. Manchmal verweisen Sie auf Stile oder Skripte in anderen Verzeichnissen. Natürlich ist dies ein relativer Pfad. Sie können das Skript auch im übergeordneten Verzeichnis von WordPress referenzieren, z. B. „/../test.js“, aber beachten Sie, dass der Anfang des Skripts andernfalls mit / beginnen muss Dies kann zu relativen Pfadfehlern führen.

Natürlich können die spezifischen Nutzungsmethoden leicht geändert oder angewendet werden, nachdem Sie die Prinzipien verstanden haben. Für weitere Informationen lesen Sie bitte meinen Blog: http://www.tangshuang.net/2432.html

Das obige ist der detaillierte Inhalt vonTeilen Sie ein WordPress-Plugin, das CSS und JS zusammenführt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:segmentfault.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage