プラウグイン更新の影響を受けず、プラグインのCSSを変更したい(WordPress)

プラウグイン更新の影響を受けず、プラグインのCSSを変更したいです。

いまのことろは、プラグインを更新するごとに、毎回CSSファイルを書き変える。という苦肉の策です。

これしかないかなぁ。と思っていたところ、さきほどこんな記事を見つけました。
http://hapisupu.com/2015/12/wordpress-wp-polls-questionnaire-japanese

プラグイン「WP-Polls」の使い方についての記事で、後半の方にはCSS変更の方法が書かれています。

いわく

自分のテーマディレクトリに「polls-css.css」をコピーして、コピーしたファイルを変更しましょう。テーマ内に「polls-css.css」が存在するとそちらを優先して読みこむようになっています。

とのこと。

と、いうことは、ですよ？

たとえば、「A」というプラグインなら、テーマディレクトリに「A-css.css」をコピーして、コピーしたファイルを変更すればいいのでしょうか？
いや、そんなことないですよね？

そこで質問です。

(１)「WP-Polls」の場合は、"そういう仕様"になっているから、更新の影響を受けずないようなCSSが可能なのでしょうか？

(２)「A」というプラグインの場合にも、更新の影響を受けないようなCSSを書きたいのですが、「WP-Polls」の"そういう仕様"の部分を、コピペすれば、「A」でも"そういう仕様"は可能でしょうか？そしてそれはどこに何をかけばいいでしょうか？

よろしくお願いいたします。

行動規範の内容に同意します

回答1件

ベストアンサー

まず、1つ覚えておいていただきたいこととして、**"プラグイン毎に仕様が異なる"**ということです。単純な話し、プラグインやテーマは、世界中のデザイナーや開発者がテーマやプラグインを開発し各々公開しています。人が変われば思想も異なります。という前提を元に以下の回答です。

(１)「WP-Polls」の場合は、"そういう仕様"になっているから、更新の影響を受けずないようなCSSが可能なのでしょうか？

はい、その通りです。WP-Pollsプラグインのソースをみてみると、まず始めに、テーマ内にpolls-css.cssファイルがあるかを確認し、テーマ内にpolls-css.cssファイルがある場合はそれを優先するような仕様になっています。以下は、WP-Pollsからの抜粋です。

php
1if(@file_exists(get_stylesheet_directory().'/polls-css.css')) {
2    wp_enqueue_style('wp-polls', get_stylesheet_directory_uri().'/polls-css.css', false, WP_POLLS_VERSION, 'all');
3} else {
4    wp_enqueue_style('wp-polls', plugins_url('wp-polls/polls-css.css'), false, WP_POLLS_VERSION, 'all');
5}

(２)「A」というプラグインの場合にも、更新の影響を受けないようなCSSを書きたいのですが、「WP-Polls」の"そういう仕様"の部分を、コピペすれば、「A」でも"そういう仕様"は可能でしょうか？そしてそれはどこに何をかけばいいでしょうか？

これは、プラグインを改変することになるため不可です。WordPress本体のファイル含め、プラグインやテーマの改変は厳禁です。テーマの場合は必ず子テーマを作成します。

では、プラグインの場合、どのようにしてプラグインのアップデートの影響を受けずCSSを変更するか。結論から述べると、プラグインのアップデートの影響を受けずにCSSの変更を行うことは不可能です。理由は簡単で、プラグインやテーマは、その作者の気分で突然仕様が変わるからです。そういうものだと思って諦めてください。例えばCSSの場合、HTMLに付与されているクラス名がタイポ（入力ミスや不慮の事故）などで変わっていただけで、CSSは適用されなくなります。また、HTMLの構造が変わるということも考えられますよね。以上のことから、アップデートの影響を受けずにCSSを変更することは不可能です。

しかし、プラグインのアップデートの影響を極力抑えてCSSを変更することは可能です。方法は簡単で、CSSには優先順位という仕様がありますので、それを利用すればよいと思います。例えば"WP-Kuck1u-Plugin"というプラグインがあると仮定します。WP-Kuck1u-PluginのCSSには以下のように書かれています。

css
1.kuck1u-plugin {
2  color: #000;
3}

kuck1u-pluginというクラス名がついた要素のフォントカラーが黒になるだけのCSSです。でも、いま使っているテーマに黒のフォントカラーが似合わにから変更したい、という場合、テーマのstyle.cssに以下のようにスタイルを追加します。

css
1.kuck1u-plugin {
2  color: #666 !important;
3}

このようにすることで、WP-Kuck1u-PluginのCSSを上書きすることができます。CSSの優先順位の付け方は!importantを付与する以外にもありますので、お好みな方法を選択すればよいと思います。これが１番、プラグインのアップデートの影響を抑えられる方法だと思います。

その他の方法として、詳しくは説明しませんが、wp_dequeue_style()関数やwp_deregister_style()関数で、プラグインのCSSを無効化し、テーマのstyle.cssで自身でスタイルを当てるという方法もあります。

上で述べた2つの方法のうち、どちらの方法を使うにしても大切なことは、プラグインや親テーマ、WordPress本体を改変しないこと、**本番環境のアップデート前にローカル環境でのテストを怠らない（日々のメンテナンス）**です。

こんな感じの回答でいかがでしょうか？

投稿2016/09/20 17:23

退会済みユーザー

総合スコア0

退会済みユーザー

2016/09/20 22:48

おはようございます。いつもありがとうございます。＞以下は、WP-Pollsからの抜粋なるほど。その部分だったのですね。ありがとうございます。＞これが１番、プラグインのアップデートの影響を抑えられる方法 importantはどこかで聞いたことあります。それ以外にも優先順位を決める方法はあるのですね。調べてみます。＞プラグインや親テーマ、WordPress本体を改変しないこと子テーマは最近覚えて作っていたのですが、プラグインは改変しちゃってましたね… 優先順位を決める色々な方法とやら、さっそく調べてみます。＞こんな感じの回答でいかがでしょうか？なんとも読みやすく、美しいご回答です。笑

行動規範の内容に同意します