Xserverを使っている人が、WordPressを「https」化する方法を解説します。 暗号化するとセキュリティが強化されるので、読者様も安心ですよ！
Xserverでは、無料で「httpss」化する事が出来るプランがあります。
プランによっては1,000円～1万円程度はかかるらしいんですよ！？（オプション）
有料版のサイトシールが気になるｗ
これは将来的には、やらなければならない「作業」になると思います。
「https」化するための設定は、結構たくさんいっぱいあります。 図解や解説通りにやっても上手くいかないことは多いですが頑張りましょう。
目次＼(^o^)／
https化（SSL）とは？
サイトの通信データを暗号化する仕組みです。
暗号化することで、ハッカーとかの盗聴攻撃を防げます。
メールフォームやパスワードの入力などの個人情報データを、安全に通信することが可能です。
アドレスが「https」になったら安全だよ！ っていう認識でOK。
https化（SSL）のメリット
https（SSL）と化して暗号化されたサイトは、評価が上がります。
- ユーザーに安心感を植え付ける。（何か鍵マークついてるぞ！？）
- SEOに有利。（らしい）
- サイトの表示速がアップする。
- かっこいい（自己満）
意外と、ライバルサイトがhttps化してなかったりするので、自分が導入すると優越感に浸れます。（笑）
おそらくですが、ユーザーの大半はアドレスバーとか見てないんじゃないかな～と思います。
https化（SSL）のデメリット
「https」化すると、様々なデメリットが発生します。
- 設定作業が地味に面倒。
- 修正作業が超面倒。
- 確認作業がクッソ面倒。
- SNSボタンのカウントがリセットされる。（一応戻せる）
各種作業は、かなりの手間がかかるので、「WordPressを設置したら即効でhttps化してしまう」のも良いかなと思いますね。
記事数が増えたり、ブログのカスタマイズをやってると、修正に時間がかかるのでほどほどで切り上げましょう。
▼ 作業を開始する前に、バックアップを取っておいて下さいね。
関連記事：WordPressのバックアップを取るためのプラグイン「BackWPup」の使い方
Xserver（エックスサーバー）でSSL設定申し込み
一番最初にやるべきは作業はこれです。
Xserverで解説を進めていきます。
↓ Xserverインフォパネルにログインします。
↓ サーバーパネルにログインします。
↓ 「SSL設定」を選択します。
↓ ドメインを選択します。
↓ ①「独自SSL設定の追加」を選択して、②「独自SSL設定を追加する（確定）」をクリックします。
↓ Xserverでの設定は、以上で終了です。お疲れ様でした＼(^o^)／
↑ SSL設定が反映するまで「最大１時間程度かかります。」と表示されればOK。
この接続では、プライバシーが保護されません
↓ SSL設定の反映前に「https」のアドレスにアクセスすると、こうなります。 割とビビります。
※ 何か、人によっては、ここで詰まるらしいです。（原因不明）
私のコンサル生の一人は、https化の作業がすべて終わった後に、「この接続ではプライバシーが保護されません」と表示されました。
しかも、2日くらいブログに接続できないという恐ろしい事態に・・・。怖ッ！
3日後には、無事ブログが公開されました。(^o^)
↓ SSL設定が反映されれば表示されます。 ※ここからメインサイトのURLで解説。（バックアップ取っとけば大丈夫だと判断したため）
WordPressの設定を変更する
WordPressの一般設定を「https」に変更します。
↓ WordPress管理画面から、「設定」→「一般」をクリック。
↓ 「http」のアドレスを「https」に変更します。 入力は正確に！
↓ 一番下までスクロールして「変更を保存」をクリックしておきましょう。
↑ 保存したあとは、強制ログアウトさせられるので、ログインし直しましょう。
リンクと画像をhttps化する
サイトの内部リンクや画像のURLを「https」に変える必要があります。
「Search Regex」というプラグインを使うと、サイト内のURLを検索して、まとめて置換することができます。（Excelの検索置換のようなもの）
Search Regexのインストールと有効化
「Search Regex」のインストール有効化を行って下さい。
↓ 「Search Regex」
関連記事：WordPressにプラグインをインストールして有効化する方法
Search Regexを使って検索置換をする
プラグインの有効化が終わったら、さっそく検索置換をしてみましょう。
WordPress管理画面から「ツール」→「Search Regex」をクリックします。
この画面で検索置換を行います。
↓ ①「Search pattern」には『http』のURLを入れます。 ②「Replace pattern」には『https』のURLを入れます。
↑ URLの入力は正確に行って下さい！
↓ 「Search」をクリックします。
↓ 「Results（検索結果）」に、サイト内の「http」のURLが表示されます。
↓ 「Replace&Save」をクリックして「http」を「https」に置換しましょう。
↓ Sourceのプルダウンメニューから、検索項目を変更しましょう。
↓ 項目を変えたら「Search」をクリック。
↓ 検索をかけても、候補がでなければOKです。 検索結果が表示された場合は「Replace & Save」で置換します。
↓ 同様に、すべての項目を検索置換して行きましょう。
「Search pattern」の検索に引っかからない項目
「Search pattern」の検索に引っかからない項目があります。
↓ 主にこれらの項目たちです。
- トップページ画像
- アイコン画像
- ウィジェット
- グローバルメニュー
- フッター
- プラグイン関係
- テーマ
- 外部リンク
↑ 上記の項目の中に、URLが「http」のままで放置されてるやつがあります。
私の場合は、ほとんど画像でした！（トップページの場合）
▼ 攻略法は別記事にしました。
関連記事：【httpsと化したWordPress】ブログ記事アドレスを緑の鍵にするための方法
リダイレクト（自動転送）の設定方法
リダイレクト設定をやらないといけません。 必須項目です。
画像の差し替え等で、「https」のサイト構築はできました。 これで「https」と「http」の2つのサイトが出来上がったことになります。
リダイレクト設定作業は、「http」にアクセスした人が、「https」のサイトに自動でワープされるようにする設定です。
.htaccess設定
リダイレクトさせるために「.htaccess」というものを設定します。
これを設定すると、古いサイトから新しいサイトに自動でワープしてくれます。
設定方法は、コードを追加することです。
サーバー上でコードを追加する
コードを書き換えるために、Xserverのファイルマネージャにアクセスします。
「Xserverインフォパネル」→「ファイルマネージャ」→「ドメイン」→「public_html」→「.htaccess」←ここまで移動。
▼ ファイルマネージャの移動はこちらを参考にして下さい。
エックスサーバーファイルマネージャのサーバーにアップロードする
これから、「.htaccess」の中にあるコードを編集します。 今から紹介するのは、一番簡単な方法です。
サイトが吹っ飛ぶかもしれないので、バックアップを取っておくと良いです。
いや、取れ。
実際に作業をやる前に、1回記事を読んで「流れを掴んでおく」方が良いかも知れませんね。
↓ 「.htaccess」をクリックしてダウンロードしてください。 このダウンロードファイルは「保険」です。大事に取っておいてください。
↓ ①「.htaccess」にチェックを入れます。
↑ ②「編集」をクリックします。
↓ こんな感じの画面が出ます。
↓ 私は、改行を入れました。
↓ お次は、こちらのコードをコピーして下さい。
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
</IfModule>
↓ コピーしたコードを貼り付けます。
↓ 「編集」をクリックして保存します。 文字コードはイジらなくて良いです。
リダイレクト（自動転送）のための、「.htaccess」コード編集は、以上になります。
ファイルマネージャ作業をミスってしまった場合
上記の作業をミスった場合の修正方法です。
↓ ①ダウンロードしておいた「.htaccess」ファイルを、ドラッグでリストに突っ込みます。 ②アップロードを押します。
実は、「.htaccess」のファイルをファイルマネージャからダウンロードすると、「.htaccess」から「htaccess」になってしまいます。
こうです。
「.htaccess」→「htaccess」
↓ なので、ファイルをアップロードすると、こんな感じになります。 ①がミスったやつ。（仮） ②が今アップロードしたファイルです。
↓ ②チェックを入れます。 ③「ファイル名を変更」を選択します。
↓ 自分で「.」を入れるか、 →「.htaccess」このファイル名をコピーして貼り付けて下さい。
↓ ファイル名を変更したら、「名前の変更」をクリックします。
↓ ファイル名を変更すると、古い奴が上書きされます。
ファイル名が変わってしまう理屈は、実はよくわかりません。（XserverのファイルマネージャからDLしたのが原因か？）
ちなみに、バックアップで取ったファイルは「.htaccess」のままになってます。
FFFTPでダウンロードしたファイルも「.htaccess」のままです。
無難に行くなら、FTPソフトを使ったほうが良いのかも知れません。
もし、何かあっても「バックアップ取っとけばOK」だと思います。
私は、Xserverのファイルマネージャのやり方で何とも無かったです。
テキストエディタを使った「.htaccess」設定
多くのサイトでは、こちらを紹介していますね。
上記のやり方で上手く行かなかった場合は、こちらを試して下さい。
こちらも、Xserverのファイルマネージャを使って作業を進めます。
ファイルマネージャからダウンロードした「.htaccess」ファイルをテキストエディタで開きます。
▼ 無料テキストエディタ
↓ このような画面になります。
▼ こちらのコードをコピーして下さい。
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
</IfModule>
↓ 元からあるコードの上に、コピーしたコードを貼り付けます。
↓ ①左上の「ファイル」をクリック。 ②「名前を付けて保存」をクリック。
↓ ①「ファイルの種類」は、「すべてのファイル」を選択。
↑ ②「文字コードと改行コード」は「UTFｰ8N（BOMなし）」を選択します。
後は、保存したファイルをファイルマネージャにぶち込んで、名前の変更をすればOKです。
「.htaccess」設定後の確認
「http」を抜いたアドレスで「https」のサイトに移動できるかを確認します。
↓ 「http」を抜いたアドレスでアクセスして・・・。
↓ 「https」のサイトに移動できるかチェック。
Google Analytics設定
サイトを「https」にした後は、Google Analyticsの設定も変更する必要があります。
▼ まだGoogle Analyticsに登録してない人はこちらの記事を参考にどうぞ。
この項目は、簡単です。サクッと終わらせましょう。
↓ 「管理」をクリックします。
↓ プロパティ設定をクリックします。
↓ 「デフォルトのURL」をクリックします。
↓ デフォルトのURLを「https」に変更。
↓ 下にスクロールして「保存」をクリックします。
次です。
↓ ビュー設定をクリックします。
↓ デフォルトのURLを「https」に変更。
↓ 下にスクロールして「保存」をクリックします。
以上で、Google Analyticsの設定はおわりです。(^o^)
Search Consoleの設定
Google Analyticsと同様に、「Search Console」も「https」にしてあげなければなりません。
↓ 作業工程はこのようになります。
- プロパティ追加で「https」のアドレスを登録する。
- サイトの所有権を確認する。
- サイトマップを送信する。
- 「www.」付きの「https」アドレスを登録する。
- サイトの所有権を確認する。
- サイトマップを送信する。
- 優先するバージョンを設定する。（ 「www.」なし版）
- ターゲットとする国を選択する。（日本）
はい、こいつは結構な手間がかかります。
私は「Search Console」を登録してサイトマップは送信しているものの、初期の頃にやったので、やり方を完全に忘れていました！
「https」といっても、やり方は一緒です。
▼ 「Search Console」のやり方はこちら。
Google Search Console（サーチコンソール）の登録方法とサイトマップの送信方法
SNSカウント数を元に戻す方法
「https」と化したWordPressは、SNSのカウント数が0になります。
しかし、「SNS Count Cache」というプラグインを導入すれば、カウント数が戻るとのこと。
↓ 「SNS Count Cache」
関連記事：WordPressにプラグインをインストールして有効化する方法
「SNS Count Cache」を有効化したらさっそく設定していきましょう。
↓ 「SNS Count Cache」→「設定」をクリックします。
↓ 「HTTPからHTTPSへのスキーム移行モード」を『有効』に設定します。
↑ 忘れずに「設定の更新」をクリックしてください。
以上で「https」の設定は終わりになります。 お疲れ様でした＼(^o^)／
[…] https://nelog.jp/wordpress-ssl https://thedog8.com/4384.html […]