
2017年初めに、本サイト全体を常時SSL化、完全HTTPS化しました。幸いなことに大きな問題も発生せず、無事に移行を行うことができました。以前は、SSL化は証明書の取得にもコストがかかり、作業も大変だったようですが、現在は無料でSSL化することもできます。
更新情報:
本記事はHTTPで運営しているサイトをHTTPSに移行する際の手続きについての手順を紹介しています。SSL化は以前は大変な作業でしたが、2017年以降、情報、ツール、環境が整ってきているため、比較的スムースに移行を行うことができるようになりました。さらに、これからWordPressでブログを始める方は、最初からSSL化した状態で運用することが簡単に出来るようになってきています。エックスサーバーでWordPressのサイトをこれから始める方は、以下の記事をご参照下さい。
超簡単! エックスサーバーでのSSL/HTTPS対応のWordPress サイトの始め方
HTTPS化の作業をご自分で行うのが不安な方向けに、ブロギングライフではHTTPSの移行サポートも行なっております。
移行化作業の情報などもネット上に開示されており、とても参考になりました。ツールもWordPressは充実しているので、移行作業の工数を大幅に減らすことができます。
運営期間、サイトの種類・コンテンツ、環境にもよりますが、WordPressであれば、https化は簡単に行うことができることを実感しました。
HTTPS移行の主な作業項目・手順
主な作業内容、手順は以下の通りです。
- データベースのバックアップ
- ドメインのSSL設定
- 内部リンクをhttpからhttpsに変更
- WordPressのサイトアドレス設定をhttpsに変更
- rel=”canonical”の対象URLをhttpsに変更
- .htaccessにHTTPSへの301リダイレクトを追加
- ブラウザでの表示確認
- Google Search ConsoleとAnalyticsの登録
- Search Consoleにサイトマップを追加
- SNSなどのリンクアドレスをhttpsに変更
- HSTSの設定
作業項目を見ると、作業量が多いように思いますが、実際に作業を行った時、予想していたよりもはるかにスムーズに移行を行うことができました。
移行作業を行う上で、本サイトが使用しているテーマ(現在はテーマを変更しています)、Simplicityの作者わいひらさんの記事を全面的に参照しました。
基本的な移行作業手順と内容は、テーマやレンタルサーバーによって変わるものではありませんが、上記記事では、本サイトと同じ環境(WordPress, Simplicity, 、エックスサーバー)でわいひらさんが行った手順を詳細にお書きくださっていたので、本当に参考になりました。
わいひらさんのブログ、寝ログさんの記事のおかげで、https移行の作業時間を大幅に短縮することができました。この場を借りて、御礼申し上げます。本当にありがとうございました!!
以下、行った主な作業を順を追って紹介します。
データベースのバックアップ
作業を行う前に、バックアップを取っておくことは重要なことです。バックアップすれば、作業中に何か問題が起きたり、うまく作業を行うことができなかった時に、元の状態に戻すことができます。
バックアップは、今回の作業に限らず、定期的に行うべきことです。特に今回のような比較的大きな変更作業を行う場合は、バックアップを行うことは重要です。
バックアップと言っても、データベースファイルをダウンロードするだけの単純な作業です。データベースのバックアップのやり方は色々あります。
エックスサーバーの場合は、サーバーパネルにログインして、MySQL設定からMySQLバックアップのタブを選んで、作業を行うサイトのデータベースファイルの”エクスポート実行”ボタンを押すとデータベースファイルをダウンロード(バックアップ)することができます。
WordPressでは、プラグインを使って、データベースのバックアップを行うこともできます。今回は、プラグインを使う方法でバックアップしました。
私が使用したのは、BackWPupです。バックアップを行った時にチェックしたBackWPup最新版のWordPress対応バージョンは4.6.2でした。本サイトのWordPressのバージョンは4.7.0でした。バージョンの更新が6ヶ月前と少し古かったのですが、他の同種プラグインも、どれも更新は少し前でした。データベースのバックアップは比較的単純な作業なので、プラグインとWordPressのバージョンの互換性はそれほど神経質にならなくても大丈夫です。
BackWPupを使用したデータベースバックアップのやり方
ワードプレスの管理画面の左がwに表示されるメニューのBackWPupにポインターを合わせる(マウスオーバーする)とサブメニューが表示されます。サブメニューから、ダッシュボードを選びます。
BackWPupのダッシュボードが表示されます。ダッシュボードの右下に表示される1クリックバックアップの下の青いボタン”データベースのバックアップをダウンロード”をクリックします。
パソコンのダウンロードフォルダー等に、ファイル名の後に拡張子sqlがついたファイル(例:database_name.sql)がダウンロードされます。
以上でバックアップは完了です。
[作業項目リストに戻る ]
ドメインのSSL設定を行う
本サイトはエックスサーバーを使用しています。サーバーにSSLの機能設定の追加を行います。設定の仕方は、レンタルサーバー会社によって多少異なりますが、やることは基本的に同じです。
エックスサーバーのサーバーパネルにログインし、メニューの中から”SSL設定”を選択します。
ドメイン選択画面が表示されます。表示されるドメインの中から、SSL化を行うドメインの欄の”選択する”とクリックします。
選択したドメインのSSL設定画面が表示されます。設定前なので、「現在、独自SSL設定はありません。」と表示されています。”独自SSL設定の追加”と表示されているタブをクリックします。
現在は、運営しているWordPressのサイトは全てSSL化しています。
設定対象ドメインのサイトが表示されているのを確認後、”独自SSL設定を追加する(確定)”のボタンをクリックします。
上記、SSL設定追加を実行すると、「SSL新規取得申請中です。しばらくお待ちください。」とメッセージが表示されます。申請が完了すると、『「www.example.com」に独自SSL設定を追加しました。』というメッセージが表示されます。
”SSL設定の一覧”のタブをクリックすると、無料独自SSL一覧に設定を行ったサイトとSSL用のアドレスが表示されます。
設定後、直ぐに上の画面のSSL用アドレスのURLをクリックしても、SSL設定が反映していないため、ブラウザで安全ではない旨の警告が表示されます。反映完了後は、警告は表示されなくなります。
以上で、ドメインのSSL設定は完了です。
[作業項目リストに戻る ]
内部リンクの変更
上記SSL設定を行ったことで、ドメインはhttp://からhttps://に変更されました。この変更に伴いサイト内のリンクアドレスもhttpからhttpsに変更する必要があります。
内部リンクの変更(書き換え)をマニュアルで行うのは大変です。しかし、WordPressの場合はSearch Regexと言うプラグインで簡単に行うことができます。Search Regexは、サイト内を対象ワードを検索して、置き換える(書き換える)機能を持ったプラグインです。
Search Regexは、サイトの引っ越し(URLの変更)作業を行う時にとても便利な機能を提供するプラグインです。httpからhttpsへの移行は、サイトの引っ越しと基本的に同じ作業が(も)発生します。
Search Regexを使って内部リンクの置き換えを行う
WordPress管理画面左のメニューにポインターを合わせる(マウスオーバーする)と表示されるサブメニューから、Search Regexを選びます。
Search Regexの画面が表示されます。
上段に表示される項目、Source: “Post content”, Limit to: “No Limit”, Order By: “Ascending”は、そのままで大丈夫です。検索の対象は投稿コンテント、制限は設けない、昇順と言う意味の設定です。
Search pattern(検索パターン)には、SSL化前のサイトURL(例:http://www.example.com)を入力し、Replace pattern(置き換えパターン)には、SSL化後のURLを入力します。(例:https://www.example.com)
Regex:のボックス欄はチェックする必要はありません。以下の画像は、本サイトの場合の入力例です。
下の実行ボタンは、”Search”(検索), “Replace”((検索)と置換), “Replace&Save”(置換と保存)の3種類があります。
実際に置き換えを行う前に、確認のため”Replace”ボタンを押してSearch Regexを実行します。
以下の画面のような検索・置き換え実行の結果(Results)が表示されます。検索対象のパターンと置き換えパターンが赤字で表示されています。
本サイトはコンテンツが少ないため、上記画像の検索結果は271と少ないです。記事が多いサイトの場合は、記事数の分とプラスアルファ多くなります。
置き換え前と置き換え後の内容を確認します。念のため、実行して問題がないか一つ一つ確認します。手間はかかりますが、トラブル・問題発生のリスクを軽減するためにも重要な確認作業です。
確認作業後、特に問題がなければ、”Replace & Save”ボタンを押して、置き換えを実行します。
置き換えが完了すると、Search Regexの下に、実行された(置き換えられ保存された)件数が表示されます。
以上で、内部リンクの変更は完了です。
[作業項目リストに戻る ]
WordPressのサイトアドレス設定をhttpsに変更
WordPressのアドレス設定をhttpからhttpsに変更します。
管理画面左のメニューから設定にポインターを当て(マウスオーバー)、表示されるサブメニューから”一般”を選びます。
WordPress アドレス(URL)とサイトアドレス(URL)を、httpからhttpsに変更します。
変更前:
変更後:
入力後、”変更を保存”のボタンを押します。これで、WordPressのサイトアドレスの設定の変更は完了です。
[作業項目リストに戻る ]
rel=”canonical”の対象URLをhttpsに変更
rel=”canonical”の参照先のURLもhttpからhttpsに変更する必要があります。この作業は、Googleがhttpsへの移行で推奨する作業の一つです。
canonicalタグで参照しているURLがhttpのままで残っていると、検索インデックスにhttpが残ってしまうようなことが発生した事例が過去にあったとのことです。
https://www.suzukikenichi.com/blog/dont-forget-to-update-rel-canonical-when-switching-to-https/
canonicalタグの参照がhttpで残っているかの確認は、内部リンクの変更で紹介したSearch Regexを使用すると簡単にできます。
Resourceの設定を、”Post meta value”にして、Search patterにhttp:のアドレスを入力して検索してみて下さい。
検索してもhttpを参照しているcanonicalタグがなければ、何もする必要はありません。これは念のための確認です。
httpを参照しているcanonicalがあった場合は、上で紹介したようにSearch Regexを使って、httpからhttpsへの置換を行います。
本サイトのHTTPSへの移行作業時、Search Regexでメタバリューの検索を行ったところ、幾つかのcanonicalタグの参照先がhttpで残っていました。そのため、それらをhttpsに置き換えしました。
[作業項目リストに戻る ]
.htaccessにHTTPからHTTPSへの301リダイレクトを追加
サイトの引っ越しと同様にhttpで始まる旧アドレスでアクセスが行われた場合に、移行した新しいhttpsのアドレスに転送する処理を.htaccessに追加する必要があります。転送は、301リダイレクトを使用します。
.htaccessのバックアップ
リダイレクトを追加する前に、バックアップを行います。.htaccessは、”public_html”のディレクトリ(サイトリソースのルートディレクトリ)にあります。FTPでダウンロードするか、ファイルをコピーしておきます。
.htaccessは、非常に重要なファイルなので、変更を行う前にバックアップを必ず行う方が良いです。ファイルサイズも小さいので、簡単にバックアップできます。
HTTPSへの301リダイレクトを追加
.htaccessの編集の仕方は、データベースのバックアップと同様にやり方は色々あります。FTPで編集するのが一般的です。(エックスサーバーのサーバーパネルからも編集はできます。)
.htaccessに以下のコードを追記します。
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
リダイレクトの動作確認
Search Consoleを使用して、リダイレクトが正しく動作しているかの確認を行います。移行前のサイトのプロパティから、”Fetch as Google”を行って確認します。
英語になっていますが、紫色の文字のhttpのアドレスから、オレンジ色で”Redirected”(リダイレクトされました)と表示されています。リダイレクト先は、httpsになっています。さらに、Fetchのログ(Downloaded HTTP response:の下の表示)から、問題なく301リダイレクトされていることが確認できました。
ブラウザからもマニュアル入力で”http://example.com”と入力して、転送の確認を行います。”https://example.com”が表示されていれば、大丈夫です。
ここまでの作業で、サイト側の基本的なSSL化/HTTPS移行作業は完了となります。
[作業項目リストに戻る ]
ブラウザでの表示確認
普及している主なブラウザでは、表示しているサイトのURL欄(アドレス欄)にそのサイトが安全であるか否かの付加情報を表示するようになっています。上に書いた様なHTTPSへの移行作業を行った後、ブラウザでHTTPS移行後のサイトを表示して確認を行います。
HTTPSのサイトで安全な接続になっている場合の、主要ブラウザの表示例を紹介します。
Chrome
Chromeでは、”鍵マーク”、”Secure(安全)”、”https”が緑色で表示されます。
鍵マークをクリックすると、安全な接続であることのメッセージ(ここでは英語ですが、日本語の場合もあります)が表示されます。
Safari
Safariでは、アドレスの前に鍵マークがグレーで表示されます。私の使用しているSafariでは、アドレスバーにhttpまたは、httpsの表示はされません。
鍵マークをクリックすると”暗号化された接続を使用しています”と表示されます。暗号化によりhttpsのサイトから、またはhttpsへのサイトへの情報はプライベートな状態を保ちますの意味のメッセージが表示されます。(画像では、メッセージは英語で表示されていますが、日本語の場合もあります。)
Firefox
Fireboxでは、緑色の鍵マーク、続いてhttpsからのURLフルアドレスが表示されます。
鍵マークの左側に表示されているiマークをクリックすると、安全な接続であることのメッセージ(ここでは英語ですが、日本語の場合もあります)が表示されます。Firefoxの表示形式は、Chromeに似ています。(Chromeの表示形式は、Firefoxに似ています。)
表示形式はブラウザのバージョンなどによっても異なる可能性があります。今後、細かい表示形式は変更となる場合があります。
上はページ上のリソース(要素)が全てSSL化されている場合の表示例です。運用歴が長く、記事数も多いサイトの場合は、上のように表示されないことが多いようです。
httpsでも全てが安全ではない状態
https化しても、サイト、ページの一部にhttpによる接続(記述)が残っていたりするとhttpsの前に鍵マークが表示されません。Chromeでは、iマークをクリックすると、サイトへの接続が完全に安全になっていない旨のメッセージが表示されます。
Firefoxでは、鍵マークに黄色の注意マークが加えられて表示されます。青色のiマークを押すと、赤字で接続が安全でないとメッセージが表示されます。黄色の注意マークに、「このウェブサイトは安全でないコンテント(例えば画像)が含まれています。」と表示されます。Learn More(日本語では”詳細表示”)をクリックすると、詳しい内容が表示されます。
運用歴が長く、記事数が多いサイトでは、一部にhttpの参照などが残っていて、全てが安全ではない状態を示すブラウザ表示になることが珍しくないと思われます。対応策については、冒頭で紹介したSimplicity製作者わいひらさんのサイトSSL化の記事内に書かれていることなどをご参照下さい。運用歴が長く、記事数が多くなればなるほど、SSL化は作業が多くなり、大変なことだと思います。
[作業項目リストに戻る ]
Google Search ConsoleとAnalyticsの登録
httpからhttpsへの移行は、URLが変わるため、サイトの引っ越し(アドレス変更)と基本的に同じ取扱となります。Search ConsoleやAnalytics等のサイト運営に必要なツールの設定も行う必要があります。
Search Consoleの登録はAnalyticsを設定していると簡単にできるため、先にAnalyticsの設定変更を行います。
Google Analyticsの設定変更
Analyticsにログインして、https化したサイトを選択します。画面上段のメニューバーの”管理”をクリックし表示される管理項目の中から、”プロパティ設定”を選択します。
プロパティ設定で表示されるデフォルトのURLがhttpで表示されているはずです。”http://”の部分をクリックし表示されるドロップダウンメニューからhttps://を選びます。
画面下の青色の”保存”ボタンを押すと変更登録完了となります。Analyticsの変更は以上です。続いて、Search Consoleの登録を行います。
Search Consoleの登録
httpとhttpsではURLが異なるため、Google Search Consoleでは別アドレスとして取り扱います。そのため、Search ConsoleにhttpsのURLで新たに登録する必要があります。
httpsのアドレスでAnalyticsのトラッキングの設定が済んでいれば、Search Consoleの認証はアナリティクスのトラッキングコードを使用すると簡単にできます。
Googleは、Search Consoleでwww.example.comとexample.comの両方を登録することを推奨しています。
Search Consoleにサイトマップを追加
httpsのURLで作成されたサイトマップをSearch Consoleに登録します。
[作業項目リストに戻る ]
SNSなどのリンクアドレスをhttpsに変更
SNSや関連サイトからのリンクのアドレスをhttpからhttpsに変更します。本サイトは休眠中だったので、関連サイトからのリンクは貼っていませんでした。
外部からのリンクは、httpのままでもリダイレクトされてhttpsに行くので当該作業はオプション的なものです。
私の場合は、Twitterからのリンクをhttpsに変更しました。(それだけです。)
[作業項目リストに戻る ]
HSTSの設定
Googleは、HTTPSのサイトではHSTSをサポートすることを推奨しています。以下は、Search ConsoleヘルプページのHTTPSを実装する場合のおすすめの方法に記載されているHSTSの説明です。
HSTS は、自動的に HTTPS ページをリクエストするようにブラウザに指示する仕組みで、ユーザーがブラウザのアドレスバーに http を入力した場合でも HTTPS が使用されます。検索結果に安全な URL を提供するように Google も指示されます。これらはすべて、保護されていないコンテンツをユーザーに提供するリスクを最小限に抑えるものです。
HSTSの設定については、以下の記事をご参照下さい。
[作業項目リストに戻る ]
以上です。
本サイトは、投稿記事数が少なかったこともあり、無事、大きな問題もなく移行することができました。本作業の後、運営するサイトは全てSSL化しました。https化の動向や常時SSL化後の状況などによって、今後の対応を考えていく予定です。https化に費やした時間より、この記事を作成することにかかった時間のほうがはるかに長くなってしまいました。
サイトのSSL化をご検討中の方へ
以前と比べると、サイトのSSL化についての情報も多く、インターネット上に沢山の情報があります。体験談などもあるので参考になると思います。一方で、本記事や他のSSL化についての記事などを読んでも、ご自分でやれるか心配な方もいらっしゃると思います。ブロギングライフでは、サイト運営者のサポートとコンサルティングを行っています。サイトのHTTPS化についてのサポートも承ります。既に10サイト以上、SSL化/HTTPS化のサポート実績がございます。
ご興味のある方は、以下のページをご覧下さい。
この記事を参考に無事http化することができました!ありがとうございます!
しかし一つ問題が起きてしまいまして…
検索結果に表示されている自サイトのリンクを押すと、全てトップページに飛んでしまうようになってしまいました。
URLが置き換わっている途中なのかな?とも思いますが、アナリティクスで計測している大部分のページが投稿ページからトップページに変わってしまっています…
バックアップで戻した方が無難なのか、置きかわり途中ということで少し様子を見る方がいいのか、ご教授いただければ幸いです。
よろしくお願い申し上げます。
はじめまして。無事にhttps化できたとのこと、良かったですね!記事がお役に立ったようで嬉しく思います。
特定の記事ページで、アドレスをhttpでアクセスするとリダイレクトされて該当するhttpsのページが表示されますが、その間に別のURL(ドメインの後に/blog/が入る)を経由して301リダイレクトされているような現象が発生しています。そのことが、検索からの訪問がトップページに表示されることと何らかの関係があるかもしれません。リダイレクトの設定などをご確認されることをお勧め致します。
アナリティクスのトラッキングがトップページに変わってしまうということは、ページもトップページが表示されているからではないのでしょうか?ご自分で各ページを表示して、アナリティクスのトラッキングが正常に動作しているかご確認してみて下さい。
Google Search Consoleでhttpsのドメインの方のインデックスが進行しているのであれば、上記リダイレクト関連の確認して必要に応じて修正するなどして、様子を見ることをお勧め致します。インデックスが進行していない場合は、リダイレクトの設定など何らかの問題発生している可能性が高いです。問題の原因を調べて修正する必要があります。中々問題が分からなくて、インデックスも進行しないのであれば、一旦、バックアップで元に戻すことも一案です。