ホームページ > CMS チュートリアル > &#&プレス > CSSとJSを組み合わせるためのWordPressプラグイン

CSSとJSを組み合わせるためのWordPressプラグイン

藏色散人
リリース: 2020-05-07 17:30:00
転載
3081 人が閲覧しました

次のコラム WordPress Tips では、CSS と JS を組み合わせた WordPress プラグインを紹介します。困っている友人の役に立てば幸いです。

CSSとJSを組み合わせるためのWordPressプラグイン

通常、複数の CSS や JS を 1 つのファイルに結合して出力することを検討しますが、この問題を解決するために、これを WordPress に実装する WordPress プラグインを作成しました。 、 目的。

実装原則

私の以前の「PHP 結合圧縮 CSS 出力モジュール式 CSS の作成」を読んでいると、まず私のキャッシュ ファイルの処理方法のいくつかを理解できると思います。ファイルのマージとコードの圧縮に関するいくつかのアイデア。このプラグインの実装原理は上記の記事で紹介したものと基本的に同じです。

インストール

まず、プラグインをダウンロードします。私は GitHub でホストしています。このページからダウンロードできます。ダウンロード後、解凍し、解凍したフォルダー全体を WordPress Web サイトのプラグイン ディレクトリに直接アップロードします。次に、バックグラウンドに移動して有効にします。

を使用して背景に入ります。「設定」メニューの下にサブメニュー「縮小」があります。入力後、さまざまなオプションを設定できます。機能を理解するためのコメントです。

css と js の出力方法が異なるため、wp-minify を使用するにはテーマを変更する必要があります。テーマ内で元の CSS と JS 出力を削除し、次の方法で 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;]); ?>
ログイン後にコピー

CSS を出力する方法は同じですが、別の関数 wp_minify_css() を使用します。関数のパラメータは配列で、配列内の要素はスクリプトファイルへのパスで、WordPressのインストールディレクトリをルートディレクトリとした完全な相対パスで記述します。

WordPress のルート ディレクトリを基準にしてスクリプトを記述する必要があるのはなぜですか?現在のテーマ ディレクトリに相対するのではなく?実際、その理由は非常に単純で、参照する CSS や JS がテーマ ディレクトリにあるとは限らず、他のディレクトリにあるスタイルやスクリプトを参照する場合があるからです。もちろん、これは相対パスです。「/../test.js」のように、WordPress の上位ディレクトリにあるスクリプトを参照することもできますが、スクリプトの先頭は / で始まる必要があることに注意してください。相対パスエラーが発生する可能性があります。

もちろん、具体的な使用方法は原理を理解した上で簡単に変更したり使用したりできます。

その他の WordPress 技術記事については、

WordPress ウェブサイト構築チュートリアル

列をご覧ください。

以上がCSSとJSを組み合わせるためのWordPressプラグインの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:segmentfault.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート