SSL(https)に移行したWordPressで、プラグインの設定画面で表示崩れが発生しました。

結論から言うと、プラグインディレクトリのURLを取得するWP_PLUGIN_URLが「http://～」でファイルを読み込んでいたのが原因でした。WP_PLUGIN_URLをplugins_urlに変更することで解決。

SSL(https)移行したサイトのプラグインでCSSとJSの読み込みがブロックされる

SSL(https://～)に移行したWordPressでは、WP_PLUGIN_URLでプラグインディレクトリのURLを取得すると「http://～」という形でCSSやJSなどのファイルと読み込みます。

そのため、ブラウザで読み込みをブロックされることが表示崩れの原因になっていました。

WP_PLUGIN_URLではなくplugins_urlを使えばOK

プラグインファイルの中で使用されているWP_PLUGIN_URLをplugins_urlに書き換えることで、「https://～」という形でプラグインディレクトリURLを取得することができます。

修正前

<script src="'.WP_PLUGIN_URL.'/'.str_replace(basename(__FILE__),"",plugin_basename(__FILE__)).'/js/functions.js"></script>
<link rel="stylesheet" href="'.WP_PLUGIN_URL.'/'.str_replace(basename(__FILE__),"",plugin_basename(__FILE__)).'/style.css" type="text/css">

修正後

<script src="'.plugins_url().'/'.str_replace(basename(__FILE__),"",plugin_basename(__FILE__)).'/js/functions.js"></script>
<link rel="stylesheet" href="'.plugins_url().'/'.str_replace(basename(__FILE__),"",plugin_basename(__FILE__)).'/style.css" type="text/css">

SSL化したサイトでは「http://～」の読み込みがブロックされる

ちょこっと前に作ったサイトだと、例えばGoogleフォントの読み込みコードが「http://～」になっていたりします。

そういう場合も読み込みがブロックされて表示がうまくいかないことがあるので注意が必要です。