ブログ運用

ブログをSSL化してhttps化にする方法【簡単解説】

2019年10月18日

ブログをSSL化してhttps化にする方法

この記事は下記の疑問にお答えします。

この記事の内容

  • ブログのURLを統一したい
  • URLを「http」から「https」に変更したい
  • wwwあり、なしのURL設定方法
  • htaccessの設定方法
  • 内部リンクのURLを一括で置換したい

 

この記事を書いている僕はこんな感じです。

Webエンジニアの仕事をする前はWordPressでブログやサイトをいくつか運営していました。
2020年にもWordPressでブログを立ち上げたことから、どこよりも最新の情報を提供できます。

というわけで早速、ブログをSSL化していきましょう。

ブログをSSL化してhttpsにする方法

今回説明するSSL化はブログを開設したら、まずやる必須設定の1つです。

SSL化すると、URLが「http」から「https」になります。

なぜ、SSL化するのかというと
SSL化されてないURLにアクセスすると、「保護されていません」という表示になるからです。

そして、SSL化されているサイトの方が上位表示されるからです。

つまり、あなたがブログのSEOを上げたいと考えているのであれば必須の設定になるのです。

今回、エックスサーバー で紹介します。
エックスサーバー では最初のドメイン設定時に「無料独自SSLを利用する」を選択していればSSL化は出来ています。

エックスサーバーのドメイン設定時の画面

 

申し込みの時期によっては選択項目がなかったりする場合もあるので、最初から全て解説します。

SSL化が出来ていてもhttpにくるアクセスをhttpsにリダイレクトする設定をしていない場合もお読みください。

簡単な流れ

  • エックスサーバー でSSL設定する
  • WordPressでURLをhttpsに変更する
  • 内部リンクを「Search Regex」で全て置換する
  • htaccessでリダイレクトさせる

上記の通りに進行すれば大丈夫です。

後半ではリダイレクトチェックツールを紹介します。

エックスサーバー でSSL設定する

まずは、エックスサーバー のサーバーパネルにログインします。

ssl設定

画面右側にある「SSL設定」をクリックします。

 

ssl設定したいドメインを選ぶ

ドメインの一覧が表示されます。
SSLを追加したいドメインを選択します。

 

ssl追加

「独自SSL設定追加」のタブをクリックします。
サイトを選択するとき、上のように「www」が付いているものと付いていなおものの2つ存在します。
あとで、どちらかに統一するのでこのままで大丈夫です。

「CSR情報(SSL証明書申請情報)を入力する」はチェック不要です。

補足

CSRとは「Certificate Signing Request」の略です。
エックスサーバー での無料独自SSL化の場合、設定しなくても使用出来ます。

「追加する」のボタンをクリックします。
すると、「SSL新規取得申請中です。しばらくお待ちください。」と表示されます。

申請が完了すると、次のような画面になります。

独自sslを追加しました

SSL化がネットに反映するまで数分〜1時間ほどかかります。

反映されていない状態でhttpsのURLにアクセスすると次のような画面になります。

Chromeの画面

一度、ここで次の作業は待ちます。
SSL化が反映されたら、次の作業に取り掛かります。

WordPressでURLをhttpsに変更する

ここからはSSL化がネットに反映されたら行います。

WordPressにログインします。

WordPress一般設定

画面左の項目から「設定」→「一般」をクリックします。

 

サイトアドレスhttp

  1. WordPressアドレス
  2. サイトアドレス

2つの項目の「http」を「https」に変更します。

「wwwあり」のURLにしたい場合は「www」を付けてください。

 

サイトアドレス変更後

変更後はこのようになります。

最後に「変更を保存」をクリックします。

内部リンクを「Search Regex」で全て置換する

ここまでで、ブログのURLはSSL化できました。

しかし、内部のリンク達はhttpのままです。
これを全てhttpsに変更してやらないと「保護されていない通信」と表示されてしまいます。

保護されていない通信

特に画像を記事にいくつも添付している場合、

そのが画像のリンクを全て手作業でhttpsに変更していってもいいのですが、
とても時間がかかると思います。

そこで「Search Regex」というプラグインを使用して一括で置換します。

Search Regexインストール

プラグインをインストールします。
その後「有効化」します。

 

ツールSearch Regex

すると「ツール」の項目に「Search Regex」があるのでクリックします。

 

置換ドメイン入力

この画面で主に入力するのは2つです。

  1. 「Search pattern」に「http」のURLを入力します。
  2. 「Replace pattern」に「https」のURLを入力します。

他はデフォルトのままで大丈夫です。
触れるとすれば、「source」です。

デフォルトでは「投稿記事(Post content)」の置換をします。

カスタムフィールドを置換する場合は「Source」→「Post meta value」を選択しれ行うことができます。

入力できたたら、「Replace」をクリックします。
この段階ではまだ、置換されません。

確認画面になります。

置換確認画面

すると、置換する一覧が表示されます。

  • 赤枠:置換するURL
  • 緑枠:置換前
  • 黄枠:置換後

ここで、「置換するURL」に間違いがないかを十分に確認します。

全てに目を通しておけるならそうしましょう!とても大切です。

Replace&save

置換内容に問題なそうであれば「Replace&save」をクリックします。

置換が完了するとこのような画面になります。

これで「Search Regex」の作業は終わりです。

htaccessでリダイレクトさせる

ここまででブログのURLは完全にhttpsに変更されました。

しかし、このままではあなたのブログのURLは
「http」と「https」の2つが存在しています。

さらに、「www」が付いているもの、付いていないものを含めると

  • http://〜
  • https://〜
  • http://www.〜
  • https://www.〜

いくつも存在しています。

1度、それぞれのURLにアクセスしてみてください。
どれも表示されていたら「リダイレクト設定」が必要です。

自分のURLがいくつも存在しているのはSEO上、良くないです。

Googleから重複サイト(コピーサイト)と見なされるからです。
重複サイトは悪質なものだと判断され検索されないよう飛ばされます。

ですから、ここで1つのURLにまとめるべく、リダイレクト設定を行います。

エックスサーバー のサーバーパネルにログインします。

htaccess編集

「.htaccess編集」をクリックします。

 

ドメイン選択

設定するドメインを選択します。

 

htaccess編集

「.htaccess編集」をクリックします。

上級者向けと書いてはいますが、手順通りやれば簡単です。

「https」かつ「www」なしの設定

タブを「.htaccess編集」に移動すると、記入できる画面になるので、
次の画像のように最前列にコードを記入します。(以下の構文をコピペOK)

htaccess記入

ここで不安があれば、一度
「htaccess」のコードをメモ帳にコピーしておきます。

補足

「#BEGIN WordPress」より上に記入すれば問題ない。

↓これをコピペします。「https」かつ「wwwなし」の場合

 htaccess
RewriteEngine on
RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]
RewriteRule ^(.*)$ https://%1/$1 [R=301,L]
RewriteCond %{HTTPS} !on
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

最後に間違って消してしまったところはないか確認し、「確認画面へ進む」をクリックし保存してください。

これで、あなたのブログのURLが「https」かつ「www」なしに統一されました。
(https://あなたのドメイン名)

それぞれコードを説明しておきます。

 
RewriteEngine on

Rewrite機能を有効にする。「ここから処理をするよ!」って意味です。

 

 
RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]

URLが「www」から始まっている場合、それより下のコードを実行します。
[NC]は小文字と大文字のどちらも関係なくという意味です。

 
RewriteRule ^(.*)$ https://%1/$1 [R=301,L]

上の「RewriteCondの条件」に当てはまった場合、実行されます。
「www」なしのURLにします。
[R=301,L]は「301リダイレクト」するという意味。

 
RewriteCond %{HTTPS} !on

2行目同様、条件に当てはまれば以下のコードを実行します。
ここではURLが「https」以外から始まる場合に実行するという意味。

 
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

「http」を「https」にするという意味。
「301リダイレクト」して処理が終了します。

「https」かつ「www」ありの設定

「www」ありに設定したい人もいると思うので、

上と同じくコピペできるコードを載せます。

↓これをコピペします。「https」かつ「wwwあり」の場合

 htaccess
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule .* https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
RewriteCond %{HTTP_HOST} !^www\. [NC]
RewriteRule .* https://www.%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

コードの詳細は先ほどとほぼ同じなので割愛します。
これで、あなたのブログのURLが「https」かつ「www」ありに統一されました。
(https://www.あなたのドメイン名)

ここで注意しておきたいのが、
WordPressでの設定で説明(記事の最初)した「WordPressアドレス」と「サイトアドレス」を
今、設定した「https://〜」か「https://www〜」に統一してください。
あべこべは厳禁です。

以上が「.htaccess」の設定です。

ここまでの設定がうまく行えているかチェックするためにも
以下の章も続きでお読みください。

リダイレクトチェックツールの使い方

ここまでで、URLを「https://〜」か「https://www〜」に設定できました。

次に、その設定がちゃんと出来ているか確認作業に入ります。

リダイレクトをチェックするツールはいくつもあるので、
お好きな物を探してください。
基本的に使い方は同じです。

僕の場合、とあるチェックツールで確認してみると
「リダイレクトされていません」と表示されたので
その場合は違うツールでもう一度確認することをオススメします。

僕は今回、「リダイレクトチェッカー」を使います。

リダイレクトチェッカー

使い方はとっても簡単で、調べたいURLを入力するだけです。

 

リダイレクトされているかチェック

このブログを例にすると、しっかりリダイレクトされているのが分かります。

補足

301とは
恒久的なリダイレクト
「302」は一時的なリダイレクト

このブログは「https://〜」なので調べる項目として

  1. http://〜
  2. http://www.〜
  3. https://www.〜

この3つをチェクして、全て「301リダイレクト」されていれば大丈夫です。
あなたの場合でチェックしましょう。

にゃーきゃっと
できていたかにゃ?

できていなかった場合、考えられる原因として、

「チェックツールの不具合」か「.htaccess」の設定間違いなので
前の項目に戻って確認しましょう。

ブログのURLにアクセスしてみる

これまでの設定が完了していれば、ブログにアクセスした場合、
「このサイトは保護されています」に変わっているはずです。

確認するためにも、1度自分のブログにアクセスしましょう。
WordPressの管理画面ももれなく「https化」されますよ!

保護された通信の画面

 

このように表示されます。
お使いのブラウザにより多少違う表示になります。(上の画像はChrome)

URLの表示は設定したものになっているけれど、
保護された通信になっていない場合、考えらることは、

ブログのどこか一部にまだ「http」が呼び出されている記事があるからです。
プラグインの「Search Regex」でもう一度置換してみましょう。

リンク等も要チェックですよ!!

まとめ

まとめ

これで、ブログのURLをSSL化する設定は完了です。

また、外部のその他のツールの設定も必要になってきます。
具体的には「サーチコンソール」や「アナリティクス」です。

早めに段階で設定しておくことをオススメします。
記事が多くなってからでは置換の作業で時間を取られる場合もあります。

以下に今回の大事なポイントをまとめます。

まとめ

  • エックスサーバー 申し込みの時期によってはSSL化がすでに完了している
  • SSL化がネットに反映するまで数分〜1時間ほどかかる
  • 「Search Regex」というプラグインを使用してサイト内URLを一括で置換
  • 「.htaccess」でリダイレクト設定する
  • 「.htaccess」の編集前に最初の内容のコピーを取っておく
  • リダイレクトチェックツールによっては不具合があるものがある

以上です。

にいやん
それでは! よきBlogLifeを!!
  • この記事を書いた人
つちだ

えんじ兄やん(えんにぃ)

現役のエンジニアです。日々Web制作に勤しみつつ、ブログ更新していきます。ポートフォリオ兼仕事依頼ページも同時に作成中ですのでご期待ください。 東京在住/30歳/フロントエンド/スノボ/バイク/オムライス

-ブログ運用

© 2021 そろりかく。 Powered by AFFINGER5