c0d3man52

Webサイト制作

[WordPress] 個別記事内の画像URLを強制的にSSL・HTTPSに対応させる

WordPressでSSL化をする際に、個別の記事内に記述された画像URLのリンクを強制的にSSL・HTTPSに対応させる方法を調べてみました。

更新日: 2018.7.17公開日: 2017.9.18

WordPressをSSL化する際に生じる問題

WordPressをSSL化する際に面倒なのが、過去に書いた記事の中のURL。特に画像URLは、SSLページ内でhttp://があると、Mixedコンテンツ扱いとなってブラウザでエラー表記されてしまいます。これではセキュリティ上もSEO上もよろしくはないので対策が必要となります。

考えられる対策とメリットとデメリットを書き出してみると、、、

メリットデメリット
(1)DBを書き換える一括でできる新しい記事には適応されない
(2)プラグインを使う手軽で知識がなくてもできるプラグインに依存する・重くなるかも?
(3)テーマの関数を編集する比較的手軽、効果が永続的知識が少し必要

という感じかと思います。

今回は、WordPressの動作にも影響が少なく、手軽にできて、効果も永続的な(3)の「テーマのfunction.phpをいじる」で実践してみます。

テーマ関数(function.php)に置換スクリプトを追記する

テーマ関数に下記のコードを追記します。記述する場所は、ファイルに一番下で問題ないと思います。

置換方法やフックのタイミングは適宜変更してください。PHPやWordPressのフックをよく知らない人は、下記のままでも良いと思います。

function forceSSl($content) {
    global  $referalString;
    //http:を削除
  $content = preg_replace('/src='http:/', 'src='' . $referalString, $content); //シングルクォート版
    $content = preg_replace('/src="http:/', 'src="' . $referalString, $content); //ダブルクォート版
    return $content;
}
add_action('the_content', 'forceSSl');

URLをくくる際にシングルクォートの人とダブルクォートの人がいるかもしれないので両方記載していますが、どちらか片方でも問題ありません。

このフックを追加することで、「http://example.com/hoge.jpg」といった画像URLを「//example.com/hoge.jpg」に置換します。頭に「http」を入れないことで、サイトがHTTPSならhttpsを、HTTPならhttpを、ブラウザが自動で判別してくれます。


数行のコードで、ページ内の画像URLをSSLにすることができました。

SSL・HTTPS化は今後対応が必須となりそうな情勢ですが、サイトの記事コンテンツを書き直すのはかなり大変なので、ぜひ使ってみてください。