こんな質問にお答えします!
ブログやホームページなどのWebサイトを「http://」から「https://」に変更(「SSL化」と言う)することは、あなたのサイトの信頼性を確保するためにも必須です。
今までWordPressでブログを構築していた人はもちろん、新規ブログを立ち上げる際にも必ず行いましょう。
しかし、SSL化はメリットが多い分、設定が多いというデメリットも聞いたことがあるかもしれません。
というわけで今回は、
- WordPressでhttpsにする(SSL化)方法
- エックスサーバーの設定手順
- httpsにならない時の対処法
などを解説します。
見慣れない単語が並んで圧倒されるかもしれませんが、お伝えする手順で進めれば難しくはありません。安心してくださいね。
WordPressの常時SSL化とは?
常時SSL化とは、ブログ全体をHTTPSにすることです。
SSL化することで通信を暗号化できるため、第三者による情報の盗聴や改ざんを防ぐことができます。
SSL化のメリット
ブログをSSL化(https化)には次のようなメリットがあります。
- セキュリティを強化できる
- サイト訪問者へ不信感を与えない
- SEOの効果も高まる
SSL化したブログ・サイトは、通信が暗号されているため、読者が安全にサイトを閲覧できます。
ですので、SSL化されていないサイトで、ログインIDやパスワード、メールアドレスなどの個人情報を入力しないようにしましょう。
悪意のある第三者から情報が簡単に見られてしまいます。
また、サイトのSSL化はSEO対策にも効果があると言われています。
Gmail 、 Google 検索、 YouTube では以前からセキュアな接続を実現しており、昨年は、検索結果での HTTPS URL の掲載順位を若干引き上げる取り組みにも着手しました。(…) Google は、より多くの HTTPS ページを探すよう、インデックス システムを調整していることをお知らせします。
引用元:Google検索セントラル
エックスサーバーでのSSL化(https)の手順
- バックアップをとる
- エックスサーバーでSSL設定を行う
- WordPressの設定からURLを変更する
- Search Regexで内部リンクを置換する
- .htaccess にリダイレクト用のコードを追記する
といった手順で行いますので、1つずつ解説していきます。
1.事前にデータベースのバックアップをとる
まずは、事前にデータベースのバックアップをとります。
「もし間違えて設定してしまったらどうしよう!?」という場合でも、バックアップをとっておけば問題ありません。復元してもう一度やり直せばOKです。
バップアップにはプラグインを使用します。
- BackupWPup
- UpdraftPlus
バックアッププラグインはこのどちらかがおすすめですし安心です。
僕はどちらも利用しましたが、復元しやすいのはUpdraftPlusで情報が多いのは現在のところBackWPupですね。
あなたのテーマと互換性のあるもの、使いやすいと思ったものを選んでください。
今回に限らず、WordPressの設定を直接変更する場合は、必ずバックアップをとる癖をつけましょう。
サーバーによっては、サーバー側でバックアップをとってくれている場合もありますが、復元する際にほとんどの場合お金がかかるので、可能な限り自力でやっておいた方が良いでしょう。
BackWPup(プラグイン)の設定方法
今回はBackWPupのプラグインを利用して解説します。
まずは、BackupWPupのプラグインをインストールして有効化しましょう。
次に、Wordpress 管理メニューの「BackWPup→ Dashboard (ダッシュボード)」メニューを選択します。
ダッシュボード画面が表示されると、「One click backup, Download database backups」もしくは下のように「データベースのバックアップをダウンロード」と表示されます。クリックして SQLファイルを取得します。
サイト名とデータベース名から名前が付けられたSQL ファイルがダウンロードされます。
2.エックスサーバーでSSL 設定を行う
次にエックスサーバーの「サーバーパネル」にログインします。
サーバーパネル ログインURLはこちら
» https://secure.xserver.ne.jp/xapanel/login/xserver/server/
ログイン後は、サーバーパネル内のドメインから「SSL設定」をクリックしてください。
ドメイン選択画面で、SSL化したいドメインの列の「選択する」をクリックします。
SSL設定画面で、「独自SSL設定の追加」のタブをクリックします。
設定ドメインが正しいことを確認し、「独自SSL設定を追加する(確定)」をクリックします。
その後は「SSL新規申請中です。しばらくお待ち下さい」と表示されます。
その後、「独自SSL設定を追加しました」というメッセージが表示されます。
最後に、「SSL設定一覧」を開くとこのようにSSL用アドレスが表示されます。
下記のメッセージが表示される間は、次に進むことはできません。
・この接続ではプライバシーが保護されません:Chrome
・安全な接続ではありません:Firefox
・このWebサイトのセキュリティ証明書には問題があります:Microsoft Edge
3.WordPressの設定でURLを変更する
設定が反映されたら、WordPressの設定からURLを変更します。
アドレスを(URL)を「https」表記に変更する
SSL化したいブログ・サイトのWordPress管理画面を開きます。
「設定」→「一般」から、
- WordPressアドレス(URL)
- サイドアドレス(URL)
の2箇所を「https」に変更してください。
設定できたら「変更を保存」をクリックします。
そうすると再度ログイン画面に飛ぶのでログインします。
URLがhttpsになっていればきちんと反映されている証拠です!
4.Search Regexで内部リンクを置換する
次に、Search Regexというプラグインで内部リンクを置き換えます。
Search Regexの設定法
WordPress管理画面の「ツール」から「Search Regex」をクリックします。
次にこのような画面が表示されます。
以下の項目通りに設定してください。
- Source:Post content(デフォルト)
- Limit to:No limit(デフォルト)
- Order By:Ascending(デフォルト)
- Search pattern:http://wp-simplicity.com(SSL化する前のあなたのURL)
- Replace pattern:https://wp-simplicity.com(SSL化後のあなたのURL)
- Regex:選択しない
設定ができたら、真ん中の「Replace »」をクリックします。
すると、置換した結果を一時的に表示した一覧が並びます。
実際に「Search Regex」が置換する部分は上の画像の赤字の部分。
薄黄緑色の部分が置換前(Postの下)、下の薄黄色の分が置換後(replaced with: の下)です。
この時点で、置換前後のURLが間違っていないかを確実にチェックしておきましょう!
置換前、置換後全てのURLが正しいことを確認する
置換前・置換後全てURLが正しいことを確認できたら、「Replace&Save」をクリックします。
一度サイトを更新して、SSL化が反映されたかを確認します。
下のように「鍵マーク」「保護された通信」とChromeで表示が出ればOK!です。
5. .htaccess にリダイレクト用のコードを追記する
実は、ここまでの設定が完了した時点では、まだ『http://』でも『https://』どちらでも表示が可能な状態です。
そのため、「https://」のみで表示されるための設定が必要です。
エックスサーバーのサーバーパネルで「.htaccess編集」を選び、SSL化したいドメインの「選択する」をクリックします。
「.htaccess編集」のタブをクリックし、画像のように以下の表記になっていることを確認します。
- # BEGIN WordPress
- # END WordPress
次に、.htaccess枠内の『# BEGIN WordPress』の上に以下のコードを入れてください。
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]</IfModule>
挿入すると以下のようになります。
ここで注意しておきたいのが、以下のような表記がある場合。
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php $ – [L]RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]</IfModule>
# END WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]</IfModule>
文字列に重複した箇所はある場合には、以下の赤字の部分で表記したように、異なる文字列の部分だけを挿入してください。
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule
^(.*)$https://%{HTTP_HOST}%{REQUEST_URI}
[R=301,L]
RewriteBase /
RewriteRule ^index¥.php$ – [L]RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]</IfModule>
# END WordPress
これらが確認できたら、「.htaccessを編集する」をクリックします。
ここまでの.htaccess を編集する作業は、今まで使っていたhttpのURLからうまくhttpsのURLにリダイレクトがかかるようにするために行っています。
うまくリダイレクトができるようになったかどうかは、
- 検索エンジンで元の http://~の URLで検索
- すぐに https:// ~のURLに変換されて検索されるか ➡ されてたらOK!
で確認することができます。
SSL化(https)のその他の設定
アフィリエイトを行うために、次の設定も必要です。
- Search Console
- Google Analytics
- アフィリエイトリンク修正
ひとつずつ解説します!
SSL化のSearch Console(サーチコンソール)での設定
まずはSearch Consoleにログインします。
画面左上のURL部分をクリックし、「プロパティを追加」をクリック。
次に、プロパティタイプを選びます。
このような画面が表示されますので、右の「URLプレフィックス」に登録するドメインを入力します。
例えば、僕のサイトであれば「https://datetti.com」を入力します。
入力後は「続行」をクリック。
所有権の確認に使える手段は、
- HTMLファイルの設置
- HTMLタグの挿入
- Google Analyticsアカウント
- Googleタグマネージャー
- ドメイン名プロバイダ
から、お好きな方法を選んでOKです。
所有権の確認方法を選んだら「確認」をクリックしましょう!
SSL化のGoogle Analytics(グーグルアナリティクス)での設定
GoogleAnalyticsにログイン後、左のサイドバー下から「管理」を選びます。
「プロパティ設定」をクリック。
デフォルトのURLを「https:// ~」にドメインに変更し、「保存」をクリックしていきましょう!
SSL化設定でのアフィリエイトリンクの修正
Search Regexの今までの操作では、アフィリエイトリンクが『http』のままになっています。
そのため、Search Regex を使って個別にアフィリ エイトリンクも SSL化する必要があります。
ASPによっては、ASP側で変更してくれている場合もあるのですが、
- アクセストレード
- レントラックス
のURLが変換されないようですので変換方法を記載します。
他のASPもリンクが古い場合は http のままになっているので確認するよにしましょう。
大手の場合はだいたい大丈夫ですが、小規模のクリローズドなASPは必須です。
アクセストレードの場合
アクセストレードのリンクは Search Regex て赤 字の部分を変更してください。
【変更前】
<ahref=”http://h.accesstroade.net/sp/cc?rk=000000”
rel=”nofollow” target=”_blank”> 自 由 テキスト <img
src=”http://h.accesstrade.net/sp/rr?rk=000000”
width=”T” height=”1″ border=”0″ alt=”” /></a>
【変更後】
href=”https://h.accesstrade.net/sp/cc?rk=000000”
rel=”nofollow” target=”_blank”>
7 + 7 + <img
src=”https://h.accesstrade.net/sp/rr?rk=000000”
width=”1″ height=”1″ border=”0″ alt=”” /></a>
レントラックス
レントラックスは赤字、青の部分をそれぞれ Search Regexで変更してください。
【変更前】
<imgsrc=”http://www.rentracks.jp/adx/p.gifx?idx=000000”
border=”0″ height=”1″ width=”1″><ahref=”http://www.rentrocks.jp/adx/r.html?idx=000000&
dna=0000″ target=”_blank”>自由テキスト</a>
【変更後】
<imgsrc=”https://www.rentracks.jp/adx/p.gifx?idx=000000”
border=”0″ height=”1″ width=”1″><ahref=”https://www.rentracks.jp/adx/r.html?idx=000000
&dna=0000″ target=”_blank”>
自由テキスト</a>
WordPressがhttpsにならない?エラー&対処方法
画像やテーマによってはエラーが出る場合、下記の解消法を試してみてください。
- サイトロゴ画像を変更
- トップページの画像
- サイドバーの画像やリンク
- プラグイン内のエラー
サイトロゴ画像を変更
まずはWordPress管理画面の『外観』から『カスタマイズ』→『サイトロゴ・アイコン』をクリックしていきましょう。
ロゴ画像をアップロードの欄に、アップロードされている画像を消し、再度『画像を選択』よりアップロードし直していきます。
トップページの画像
トップページの画像も同様に対応していきましょう。
サイドバーの画像やリンク
WordPressの管理画面で『外観』→ウェジェットをクリック。
『メインサイドバー』や『フッター』などに挿入しているテキスト内リンクが『http』のままになっていないか確認し、『https』に書き換えましょう。
プラグイン内のエラー
WordPressプラグイン『postsnippets』など、プラグインの設定で使用しているリンクはSearch Regexの一括変換の対象外ですので、個別で『https』の表記に書き換える必要があります。
TCDの場合
『LazyLoad』のプラグインが有効化されていると、SSL後画像が表示されません。『LazyLoad』のプラグインを停止すると直ります。
STORKの場合
LPページの表記がSearch Regexの一括変換の対象外ですので、個別に変換しましょう。
moreタグの場合
記事内に『more』タグを使用している場合、このリンクはSearch Regexの一括変換の対象外ですので、個別に変換しましょう。
【エックスサーバーで常時SSL化】WordPressでhttpsにする設定方法と手順まとめ
エックスサーバーでワードプレスを常時SSL化するやり方をご紹介しました。
サイトのSSL化(https)は、あなたのブログのセキリュティを強化し、サイト訪問者への安心感を与えますので必ず対応してください。
設定箇所は複数ありますが、お伝えした流れで取り組んでくださいね。
複数サイトがある方は外注し、時間を有効に使うことも検討してみてみましょう。