SSL化の後に、画像が表示されない、メニュー(子メニューのアニメーション)が表示されない、スタイルシートの読み込み不全でレイアウトが崩れる原因と対策を解説いたします。
何故SSL化(HTTPS化)で画像が表示されなくなったり、レイアウトが崩れたりする？
この原因の多くは、HTTPSのページで、同じドメイン内のHTTPのコンテンツを読み込んでいて、ブラウザーがHTTPSに統一されていないコンテンツの読み込みをブロックしてしまう場合があるからでございます。
(HTTPSのページの中に、HTTPの非暗号化コンテンツの読み込みがある状態は、混在コンテンツの問題と呼ばれます)
つまり、HTTPSでページにアクセスした場合は、そのコンテンツ内の読み込みもすべてHTTPSで読み込めば前述の画像が表示されない、メニュー(子メニューのアニメーション)が表示されない、スタイルシートの読み込み不全 などが解消される可能性があります。
混在コンテンツはどこにある？
混在コンテンツが含まれる場所で多いのが、テーマ内の書き込みとデータベースのコンテンツの記録部分です。
オリジナルテーマを利用されている場合、テーマに直接画像やCSSの読み込みURLが書き込まれている場合があり、このURLがHTTPで始まっていると読み込み不全を引き起こす場合があります。
この場合、テーマ内の下記のようなURLの書き込みを全てHTTPSに修正していく必要があります。
<link rel="stylesheet" href="http://example.com/aaa.css"> <img src="https://example.com/aaa.jpg">
↓
<link rel="stylesheet" href="https://example.com/aaa.css"> <img src="https://example.com/aaa.jpg">
もしくは次のようなURLの書き方をすると、HTTPで読み込むとHTTPに、HTTPSで読み込むとHTTPSに自動的になるようにすることが可能です。
<link rel="stylesheet" href="//example.com/aaa.css"> <img src="//example.com/aaa.jpg">
データベースのURLを修正する
データベースに書き込まれているHTTPのコンテンツをHTTPSに書き換えするのは、何千件もある可能性があり、手作業では大変です。
等のプラグインをご利用いただくと、データベースから読み込まれた後に、コンテンツ内部のHTTPをHTTPSに自動で書き換えてくれますのでデータベースの書き換えが不要になります。
データベースのHTTPS化をSQL文を発行して行うのは危険です
データベース内のHTTPコンテンツをすべて一括でSQL文を発行して書き換えてしまうと、シリアライズデータを壊してしまい、最悪サイトの表示ができなくなることがあります。
参考
ワードプレスのデータベースのテーブルに記録されている特殊なデータ形式a: s:を含むシリアライズデータ
このシリアライズデータのデータを壊さずにデータベースのデータを一括で書き換えてくれるPHPスクリプトに Search Replace DB という著名なスクリプトがあります。
このようなスクリプトを利用してHTTPを一括でHTTPSに書き換えます。
