web-dev-qa-db-ja.com

PurifyCSSを使用してWordPress style.cssをクリーンアップするにはどうすればよいですか?

style.cssファイルを消去するためにPurifyCSSを使用しようとしています。正常に動作する場合、静的htmlファイルで試してみます。 CLIコマンドの例を参照してください。

purifycss wp01/wp-content/themes/mytheme/style.css index.html --min --info

しかし、ライブWeb(ローカルホストで実行)で使用しようとすると、間違った結果が得られます。私のコマンドは次のとおりです。

purifycss wp01/wp-content/themes/mytheme/style.css http://localhost/wp01/ --min --info

それは私のcssの非常に小さな部分を出力します。基本的にはhtmlおよびbodyタグのcssです。

私がやろうとしているのは次のようなものです:

purifycss wp01/wp-content/themes/mytheme/style.css http://localhost/wp01/ http://localhost/wp01/another-page http://localhost/wp01/last-page --min --info

webのすべてのページを提供することで、不要なものを一切含まない浄化されたCSSを出力する必要があります。

1
Juraj.Lorinc

WordPress用にCSSを最適化するのは時間のかかる仕事です。すべてのページ(404、アーカイブ、検索など)と、画像、順序付きリスト、順序なしリスト、引用、ギャラリーなど、考えられるすべての要素を考慮する必要があります。

テーマが、エラーや通知などの特別なイベントでのみロードできる何らかの種類のAJAXまたはモーダルを使用する可能性があることは言うまでもありません。

それでも、purifyCSSにはいくつかのクラスが隠されている可能性があります。

私の経験では、最初に WordPressで生成されたクラス をカバーし、次にテーマを参照してクラスを探し、それらを見つけて別のCSSファイルに保存する方が、テーマのレビューが完了するまでは良いと思います。

また、可能性のあるショートコードおよびAJAXハンドラーについてfunctions.phpファイルを調べて、HTMLコンテンツを出力することもできます。

前述したように、自動化されたアプリはすべてを抽出できないため(少なくともフロントサイドでは)、これは非常に簡単ですが、時間のかかるタスクです。

1
Jack Johansson

Roots.ioのWordpressテーマフレームワークでGruntを使用してこれを行う方法について誰かが書いた。 (現在はSageと呼ばれています)誰かを助けるためのリンクです。 https://cfxdesign.com/remove-unused-css-from-wordpress-automatically-with-grunt/

0
Jay