エックスサーバーの無料SSLでwordpressブログをhttpからhttpsへ変更した方法♪

こんにちは(✿✪‿✪。)ノコンチャ♡

いや~今日もいい天気!本格的なシーズンを前にしてもこの暑さ…www
さすが沖縄ってところです。

まぁ部屋の中はエアコン効いてて涼しいけど、お外との温度差が激しすぎて出たり入ったりは、さすがに体調崩しそうです(*_*)

さて、本題の件だけどご存知のようにインターネットでは、以前からssl証明でhttps接続が推奨されて久しいのだけど、これまではssl証明を設定するには高額な料金が必要でしたね。

自分もだいぶ前からsslというのは知ってはいたけど、仕事でガンガン使っているわけでもないし、お金がかかるのならやめておこうってことで、今まで無視していました。

んで、最近になって契約しているエックスサーバーさんが独自SSL証明が無料で無制限に利用できるという、ありがたいサービスを開始したんだけど、ここまで書き進めてきたブログで今さらSSL設定でURLを変更するのも、自分にとっては、かなり敷居が高い大変な作業になるだろうと思い込んで、ずっと放置していました。

ところが先日、Googleさんからの連絡で今年7月のシステム改変により、今後SSL証明でURLがhttps接続じゃない従来のhttpサイトにはアクセス毎にインターネットブラウザーに「警告」が出るようになると通知してきた。

いや、これはさすがにマズイっしょwww

ただでさえ、疑心暗鬼のインターネットなのに、アクセスしたサイトで「このサイトは保護されていません」とか「悪意あるなんチャラ…」って警告が出たら

「えっ!このサイト見てたら知らないうちに個人情報抜かれるの」なんて、訪問者は不安になって逃げちゃうよね。

自分もアクセスしたサイトで、そんな風に警告が出たら気分悪いし、よっぽどじゃない限り、そのサイトを開くのをためらってしまうかもしれない。

ということで、敷居が高いと思っていたhttps化に、意を決して現在のブログをSSL設定でhttps接続に変更してみたところ、これが意外にもスムーズに移行できたのでここにブログっておきます。

スポンサーリンク

目次

httpsにSSL化した手順まとめ

WordPressをhttpからhttpsへ(エックスサーバー環境)

自分のWordPressサイトをSSL設定するにあたって、何らかの手違いがあった場合に元に戻せるように保険的な意味合いで、事前にバックアップを取っておきました。

ワードプレスのデータベースをバックアップをするには、BackWPupというプラグインが便利だということなので、さっそくインストールして有効化します。

その後、メニューから「BackWPup→ダッシュボード」を選択します。

そのまま何にもせずに「データベースのバックアップをダウンロード」ボタンをクリックしてSQLファイルを取得しておきます。

ダウンロードには、ブログやサイトの規模によっては
多少時間がかかるかもしれません。

自分の場合は、ほんの数分でした(*^^*)

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

では、早速エックスサーバーさんで無料の独自SSLサービスを使わせていただきます。

サーバーパネルにログインしたら
「ドメイン」項目以下にあるSSL設定ボタンをクリック

独自SSL設定の追加タブを開きます

表示されたドメイン選択画面から目的のドメインを探して
「選択する」ボタンをクリック。

「独自SSL設定の追加」タブを開き、自分のサイトを確認して「独自SSL設定を追加する(確定)」をクリックして完了です。

矢印のチェックは無視してもいいようです。

これで自分のサイトは、httpでもhttpsのどちらでもアクセスすることが
出来るようになりました。

えッ!たったこれだけwww
いや~、あっけないくらいに簡単ですよね。

ただし、独自SSL設定を追加すると、「SSL新規取得申請中です。しばらくお待ちください」と出るので、設定が反映されるまでに少し時間がかかるようです

ちなみに、直ちにSSL設定した「https」でアクセスしてみると…

Chromeでは、このような画面が現れました。
まだ、反映されてませんね(;^_^A

しかし自分の場合は、ほんの数分後にはSSL設定が反映されて
httpsでも正常に開けるようになりました(^^♪

ワードプレス(ブログ)の設定

次に自分のブログ(Wordpress)の管理画面で「設定」項目にある「一般」を開き
以下の項目を変更する。

1、Wordpressアドレス(URL)
2、サイトアドレス(URL)

それぞれのURLを「http」から「https」に書き換える

リダイレクト設定

ブログのアドレスを書き換えたので、URLが変わってしまい今までの「http」ではもうどこからもアクセスが出来ないので、今まで通りの「http」でも「https」に自働的に変換してアクセスが可能になるように「.htaccessファイル」にリダイレクト用のコードを追記します。

自分の場合は、エックスサーバーのFTPは使わずに
PCでは、フリーFTPソフトの「WinSCP」、Macでは「Cyberduck」を使っています。

  

FTPでサーバーにアクセスし、自分のドメイン→「public_html」ディレクトリにある「.htaccessファイル」を探します。

見つけたら、万一のためとりあえずダウンロードしてバックアップを取っておきます。

FTPソフトの編集で「.htaccessファイル」に直接以下のコードを追記しました。

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

このコードを「.htaccessファイル」の一番上の部分にスペースを空けて挿入追記し保存。
使用したエディタも、ネットで拾ったフリーソフトを使用しています。

これで、これまで「http」できていたアクセスを「https」にリダイレクト(転送)してくれるはずです。

試しに、TwitterやFacebookなどのSNSに過去に投稿した、ブログ紹介の記事をクリックしてみたところ、ちゃんと該当のブログ記事を表示してくれました。

とりあえず、ここまでは順調です。

ブログ内部で参照している「http」を「https」変更する

次に、ブログ内の記事で参照しているリンクや画像リンクを全て「http」から「https」に変更します。

いちいち投稿記事を開いて一つ一つ手作業で行っていては、あまりにも時間と労力がかかりすぎるし、そんなことはまず自分には無理。

しかし、さすがワードプレス!
そんなときのための便利なプラグインがあるんですね!(^^)!

指定した文字列を任意の文字列に置き換えるプラグイン「Search Regex」
今回はこれを使い一括で、あっという間に変更してしまいました。

Search Regexをインストールして有効化します。

wordpress管理画面でツール項目以下の「Search Regex」を選択する

以下の画面でデフォルトのまま

Search Patternに 以前の「http」URL
Replace Patternに 変更した「https」URL

それぞれを記入します。

記入したURLに間違いがないことを確認して、まずは一旦、真ん中の「Replace」ボタンを押して状況を確認してみます。

この時点では、このように書き換えますよとの一覧表示なので
データの書換はまだ行われない。

ちなみに書き換え前の文字列が薄緑色の枠に、その下の薄黄色の枠に書換後の文字列が表示され、ずらずらと一覧表示される。

一度書き換えを行うと、もう元には戻せないのでこの時点で、間違えは無いかよくチェックしておく必要があるようだ。

とはいっても、これだけの数のチェックは気が遠くなりそうなので、せっかちな自分は、ある程度、ザっと見渡して思い切って「Replace&Save」ボタンを押した。

すると、一瞬で書換は完了した。
自分のブログでは、書換個所は8,000個以上になっていました。

一応、とりあえずこれでWordpressブログのSSL設定「https」接続化という目的は意外にも簡単に達成できたわけだけど、ページによっては一部でまだ完全に安全ではない状態になっているようです。

Windowsの場合


Macの場合

Win、Mac ともに上が安全な接続状態で、下が「https」接続ではあるが、ページの一部で安全な接続ではない状態を表している。

これの原因としては、過去に設定したアドセンスや、アマゾンの商品紹介などで
まだ「http」ファイルや画像を読み込んでいるのがほとんどだ。

まとめて修正する方法もあるようだけど、まぁ慌てることはないだろう。
これは今後、見つけ次第に修正を施していきたい。

他にも、まだ修正する箇所とかアプリの設定とかがあって、やっておいた方が良いのだろうけど、ここに書くともっともっと長くなりそうなので今回は、ここまでにしておきます。

この件でまた何かあれば、改めてブログにまとめたいと思います。

ところで、今回使用したプラグインは、今後あまり使わないだろうから削除しようかと思ったが、しばらく様子を見るということで削除ではなく停止にしておいた。

それではこの辺で(@^^)/~~~
@ivy_marcos32

この記事が気に入ったら
いいね!しよう

最新情報をお届けします


スポンサーリンク