WordPressサイトを完全にhttps化するために行った7つの手法

WordPressサイトを完全にhttps化するために行った7つの手法

SSLを導入してサイトをhttpsの付いたURLで表示できるようになったら、完全なhttps化を目指して必要な設定を行っていきましょう。

やらなきゃいけない作業も多く少し難しいものもありますが、分かりやすく解説していきますので一緒に設定を進めてみてください。
 
 

スポンサーリンク

httpsを緑色にする必要がある

SSLを導入してサイトをhttps化したときにも解説しましたが、アドレスバーでURLを確認したときに以下のように「https」がグレーのままでは、まだ完全にサイトをhttps化したとは言い切れません。

「https」がグレーで表示されている

「https」がグレーで表示されている

 
 
これは、部分的にしかサイトが暗号化されていないことを表していて、このままでは通信の盗聴やデータの改ざんなどといったハッキングも防ぐことができません。

サイトが完全にhttps化されている場合は、以下のようにURLの前に鍵マークと「保護された通信」という言葉が表示され、「https」も緑色で表示されます。

「https」が緑で表示されている

「https」が緑で表示されている

 
 
このようになって初めて、SSLがちゃんと導入された安心・安全なページであると言えます。
 
 
サイトのhttps化が不完全になる一番の原因として挙げられるのが、「ページの中にhttpのままのリンクが入っている」ということです。

アフィリエイトのリンクや外部サイトへのリンクがhttpのままだったり、ブログに使っている画像や動画のURLがhttpのままだったりすると、ページの一部が安全でない状態であると判断され、httpsが緑色で表示されません。

ということで今回は、サイト内のリンクを適切に変更し、「https」が緑色で表示される完全なサイトのhttps化を目指して作業を行います。
 
 

サイトを完全にhttps化するために行った7つの手法

今回、サイトを完全にhttps化して、アドレスバーのhttpsを緑色で表示させるために、以下の作業を行いました。

  1. サイトURLの変更
  2. 内部リンクを全て置き換える
  3. デベロッパーツールでSSLエラーをチェックする
  4. テーマをチェックする
  5. ナビゲーションメニューをチェックする
  6. ウィジェットをチェックする
  7. .htaccessにリダイレクト用のコードを追記する

 
 
それでは、一つ一つ解説していきます。
 
 

スポンサーリンク

サイトURLの変更

WordPressの管理画面左メニューから『設定一般』という順にクリックして進みます。

『設定→一般』という順にクリック

『設定→一般』という順にクリック

 
 
一般設定ページが開きます。
「WordPress アドレス (URL)」と「サイトアドレス (URL)」の項目を変更しましょう。

以下のように、それぞれのURLの「http」部分を「https」に変更します。

WordPress アドレス (URL) https://ドメイン
サイトアドレス (URL) https://ドメイン
それぞれのURLの「http」部分を「https」に変更

「http」部分を「https」に変更

 
 
URLを変更したら、ページ下部の『変更を保存』ボタンをクリックして、設定を反映させましょう。

『変更を保存』ボタンをクリック

『変更を保存』ボタンをクリック

 
 

内部リンクを全て置き換える

サイト内の内部リンクや、画像のURLを全てhttpsに置き換えます。

これは、記事や固定ページを一つ一つ開いて変更してもかまいませんが、かなりの時間がかかってしまうので正直言ってオススメしません。

ということで、こんな時に便利なプラグイン「Search Regex」を使って、全ての内部リンクを一括で置き換える方法を解説します。
 
 

Search Regexをインストール

まず、Search Regexをインストールしましょう。

WordPressの管理画面から『プラグイン新規追加』という順にクリックして進み、
プラグイン検索ページで「Search Regex」と検索します。

するとSearch Regexのプラグインがヒットしますので、
これを『今すぐインストール』し、有効化すればOKです。

上記の方法でインストールできない場合は、下記のWordPress.orgページからプラグインをダウンロードし、FTPソフトでwp-content/pluginsディレクトリにアップロード。
その後、WordPressの管理画面からプラグインを有効化してください。

WordPress.orgからダウンロード

プラグインのインストール方法を詳しく知りたい方は、こちらの記事も参考にしてみてください。

WordPressにプラグインをインストールする方法+初心者おすすめプラグインまとめ

2016.12.08
 
 

内部リンクを一括で置き換える方法

プラグインをインストールしたら、WordPress管理画面左メニューから
ツールSearch Regex』という順にクリックして進みます。

『ツール→Search Regex』という順にクリック

『ツール→Search Regex』という順にクリック

 
 
Search Regexの設定画面が開きます。

Search Regexの設定画面

Search Regexの設定画面

 
 
以下のように設定しましょう。

Source content(デフォルト)
Order By Ascending(デフォルト)
Limit to No limit(デフォルト)
Search Pattern http://ドメイン(https化前のURL)
Replace pattern https://ドメイン(https化後のURL)
Regex 選択不要

 
 
設定したら『Replace』ボタンをクリックします。

『Replace』ボタンをクリック

『Replace』ボタンをクリック

 
 
置き換えする候補がずらっと表示されます。

置き換えするリンクの候補

置き換えするソースコードの候補

 
 
上の薄緑色のマーカーが引かれているソースコードが置き換え前の状態で、下の薄黄色のマーカーが引かれているソースコードが置き換え後の状態です。

赤色のマーカーが引かれている部分は、Search Regexが置換する部分です。

リンクを置き換えてしまうと、基本的に元に戻すことはできませんので、ここは念入りにチェックしておきましょう。
 
 
置き換え内容をチェックし、問題がなければ『Replace & Save』ボタンをクリックします。

『Replace & Save』ボタンをクリック

『Replace & Save』ボタンをクリック

 
 
これで、内部リンクの置き換えが完了しました。
 
 

スポンサーリンク

デベロッパーツールでSSLエラーをチェックする

ページのどこを変更すればいいのか調べる際は、Google Chromeのデベロッパーツールを使うのが便利です。

Google Chromeでページを開いたら、画面のどこかを右クリックしましょう。

以下のようなメニューが表示されますので、この中の『検証』をクリックします。

『検証』をクリック

『検証』をクリック

 
 
すると、以下のようにデベロッパーツールが開きます。
※ページ上でF12キーを押しても開きます

Google Chrome デベロッパーツール

Google Chrome デベロッパーツール

 
 
Console』タブをクリックして開きましょう。

『Console』タブをクリック

『Console』タブをクリック

 
 
以下のようにエラー箇所がリスト表示されますので、該当箇所のリンクを修正しましょう。

エラー箇所がリスト表示される

エラー箇所がリスト表示される

 
 

テーマをチェックする

なかなかサイトが完全にhttps化されない場合、テーマカスタマイザーで設定した画像などが原因でエラーが出ることがあります。

以下のような画像を設定している場合は、再度設定し直すことをオススメします。

  • ヘッダー画像
  • ロゴ画像
  • ファビコン
  • アップルタッチアイコン

 
 

スポンサーリンク

ナビゲーションメニューをチェックする

ナビゲーションメニューのリンクもチェックしておきましょう。

カテゴリーや固定ページなどを設定している場合は自動的にhttpsになってくれていますが、カスタムリンクを使っている場合はhttpのままになっている可能性があります。

ナビゲーションメニューの設定については、以下の記事を参考にしてみてください。

WordPressサイトにナビゲーションメニューを設定する方法

2016.12.04
 
 

ウィジェットをチェックする

ウィジェット内のリンクも隅々まで確認しておきましょう。

例えば、サイドバーにhttpのままの外部リンクを貼っていたりすると、そのウィジェットが適用されている全てのページが一部安全でないと判断され、エラーになってしまいます。

ウィジェットの設定については、以下の記事を参考にしてみてください。

WordPress ウィジェットの基本的な使い方と設定方法

2016.11.06
 
 

スポンサーリンク

.htaccessにリダイレクト用のコードを追記する

「http」と「https」の両サイトは別サイト扱いとなっているため、これまで「http」のサイトに来てくれていたユーザーを、「https」のサイトにリダイレクト(転送)する設定が必要です。

以下では、エックスサーバーを例に解説していきたいと思います。

FTPソフトなどを使ってサーバーにログインし、「.htaccess」というファイルを編集します。

サイトのドメインpublic_html』という順に進み、「public_html」ディレクトリ内にある
「.htaccess」ファイルをダウンロードしましょう。

「.htaccess」ファイルをダウンロード

「.htaccess」ファイルをダウンロード

.htaccessファイルは非常に重要なファイルなので、万が一に備えて、編集前に必ずバックアップをとっておくようにしましょう。
 
 
テキストエディタでファイルを開き、以下のコードをファイルの先頭部分に貼り付けます。

コードをファイルの先頭部分に貼り付け

リダイレクト用のコードをファイルの先頭部分に貼り付け

 
 
編集した.htaccessファイルを保存して、サーバー上の「public_html」ディレクトリに上書きアップロードします。

リンゴ
エラーが出る場合は、先ほどとったバックアップから復元しましょう。
 
 
これで、リダイレクトの設定は完了です。
これまで「http」のサイトに来ていたアクセスが「https」のサイトに転送されるようになりました。
この転送は全てのページで行われます。

リンゴ
httpのサイトにアクセスしてもhttpsのサイトに転送されるかテストしてみましょう。
 
 

まとめ

今回は、SSL導入後にWordPressサイトを完全にhttps化するために行った全手法を紹介しました。

やることも多くて疲れてしまうかもしれませんが、サイトを完全にhttps化すれば、セキュリティに優れた安心・安全なサイトを作ることができるので、妥協せずしっかり設定しておきましょう。
 

WordPress マニュアル

WordPressでブログサイトを開設する方法を、完全マニュアルとしてまとめています。
WordPressの使い方や設定で分からないことがあったら、ぜひこのページを参考にしてください。

WordPress マニュアルへ

WordPress完全マニュアル

スポンサーリンク








WordPressサイトを完全にhttps化するために行った7つの手法