WordPressの使い方

WordPressでhttpからhttps(SSL化)に記事がある状態から変更する方法

httpからhttps WordPressの使い方

こんにちは。

埼玉県川口市でWEB制作を行っています、テダスクのToshi Seitoです。

最近ですが、お客さんからのご相談で、既に100記事以上記事があるWordPressサイトをhttpsにしたい(SSL化)というお客さんがいました。

お客さんが懸念していたのがSSL化をするとエラーが出てしまうのではないか、ということや画像が表示されなくなったら困るということでした。

実際SSL化をする際にサーバーの設定が必要でかつ、WordPressの書き換えなどが伴うため、初心者には難しい作業ではあります。

今回はそういった人の為に、できる限り画像をつかって分かりやすくやり方を記事にしましたので、もしチャレンジしたいという方はこの記事を読んで作業してみて下さい。

 

[st-card id=204 label=”” name=”” bgcolor=”” color=”” readmore=”on”]

 

作業に掛かる時間

このhttpからhttpsへの作業は待ち時間も合わせてだいたい1時間半は掛かりますので、時間に余裕をもって作業をしましょう。

作業時間の内訳はこんな感じです。

  • 前準備:10分くらい
  • 待ち時間:1時間くらい
  • httpsへの置き換え作業時間:10分くらい
  • 置き換え後の調整:15分くらい
  • リダイレクトの設定:5分くらい

 

前準備:SSL化をする前に行う事

WordPressをhttps化をする前に、いくつかやっておくことがあります。

  1. サーバーの管理画面でSSL化の設定
  2. WordPressのバックアップ

1.サーバーの管理画面でSSL化の設定

WordPressのサイトをhttpsにするには、先ずサーバー側でhttpsのためのSSLを利用するための設定を行います。

ここではさくらインターネットでのSSL化の設定方法をご説明しますが、メジャーどころのサーバーでしたら必ずSSLの設定方法がありますので、サーバーの設定に従って設定して下さい。

先ず、管理画面に入ったら左サイドバーの下の方にある「・ドメイン/SSL設定」のリンクをクリックします。

httpからhttps

 

ドメイン一覧に来たら、SSLを有効にしたいWEBサイトのドメインの行にある、「登録」というリンクをクリックします。

因みにもし既にすでに登録はしている登録はしていたという場合は登録の左の列に表示というリンクが表示されます。

httpからhttps

 

そうすると、無料SSL証明書の設定ができるようになりますので、「無料SSLの設定へ進む」をクリックします。

httpからhttps

 

たくさん文章が書いてあり、なんだか難しそうですが、気にせず「無料SSLを設定する」をクリックします。

httpからhttps

 

そうしてこの画面が表示されれば無事完了です!

赤い文字で書いてある通り、数十分から数時間設定に時間が掛かりますが大体1時間程度で終わることが多いです。

SSLの設定が終わったかどうかの確認は後程お伝えします。

httpからhttps

もしここまでうまく行かない場合は、ドメインの設定に問題がある場合があります。

その場合は、コメントもしくはお問い合わせからご質問ください。

 

https化が完了しているかの確認方法

httpsが完了しているかは、httpsでアクセスしてみれば分かります。

例えば私がSSLを有効にしたばかりのサイトにhttpではなく、「https://サイトのドメイン」にアクセスするとこんな画面が表示されます。

httpからhttps

SSLの設定がまだの場合この画面が表示されます。

因みにエックスサーバーの場合は、SSLが有効になってすぐの時間は警告ではなく、

設定の反映待ちか、存在しないアドレスです。

というページが現れたりしますが、焦らずページが表示されるまで根気よく待ちましょう!

 

SSLが有効になると警告画面が消えて、いつものサイトが表示されるはずです。

 

2.WordPressのバックアップ

無事SSLが有効になったら、今度はWordPressの前準備のバックアップを行います。

バックアップで使うプラグインは、このサイトでも何度か紹介しているUpdraft plusを使います。

updraft plus

 

もしUpdraft Plusを入れていなければプラグインの追加からインストール、有効化をしましょう。

httpからhttps

 

UpdraftPlusをインストールして有効化すると、画面のように「設定」というリンクが出てきますので、クリックします。

httpからhttps

 

そうすると「今すぐバックアップ」というボタンが表示されますので、クリックします。

httpからhttps

 

「今すぐバックアップ」のボタンをクリックすると、今度はバックアップの内容に関するダイアローグが表示されますので、そのままの設定で「今すぐバックアップ」のボタンをクリックします。

httpからhttps

 

そうするとバックアップが始まります。

記事や画像の多さで完了まで時間が変わりますが、早いと数分で終わります。

バックアップが終わると、同じ画面を下にスクロールするとバックアップ済みのログが残ります。

バックアップ日時が先程行ったバックアップというのを確認して、ここで完了になります。

httpからhttps

もし、このUpdraftPlusでの作業でエラーが出たり、バックアップが完了できなかった場合は、WordPressのバージョンやファイルが多すぎるという可能性がありますので、これ以上は進めるのは止めてプロにお願いするのが賢明です。

 

WordPressでのhttpsへの置き換え作業

さてここまで来たらWordPressでhttpからhttpsへの切り換え作業を始めます。

先ず、WordPressのバックアップの作業の前にも言いましたが、httpsが有効になっているか必ず、https://でアクセスして確認しましょう。

ちなみに私のサイトだとこんな感じになります。

httpからhttps

URL(アドレスバー)の赤く囲んだところを見ると、ビックリマークが付いているのが分かりますか?

これは実は今見ているページが完全にhttps化されていない状態を表しています。

これをこれから、httpsにしていきます。

ちなみにhttpsになっていないところを具体的にいうと、画像です。

 

画像を表示するために、画像の置き場所をURLで指定しています。

自分の例のサイトの場合は

http://ssltest.tedask.net/wp-content/uploads/2020/01/sample.jpg

こんな感じです。

これを

https://ssltest.tedask.net/wp-content/uploads/2020/01/sample.jpg

に置き換える作業を行うわけです。

つまり、極端なことを言えば画像を一切使っていないサイトだったら、これからプラグインで行う一括置き換えの作業は不要だったりします。

 

という感じで説明が長くなりましたが、早速作業を進めていきます。

 

先ずはサイトのURLを手動でhttpsに切り換える

一括書き換えの前に、先ずサイトのURLを設定から書き換えちゃいましょう。

httpでもhttpsからでもいいので、いつも通り/wp-adminで管理画面に入ってください。

管理画面にはいったら「設定」→「一般設定」にいどうして、WordPressアドレスサイトアドレスのどちらもhttpからhttpsに書き換えます(sを足します)。

そして、「変更を保存」

httpからhttps

 

すると一旦ログアウトしてhttpsの状態でログイン画面が出ると思いますので、もう1度ログインします。

 

ログインし直すと、httpsになっているのが分かりますね。

httpからhttps

 

 

Search Regexで記事にあるhttpの一括置き換え

そうしたら次はいよいよ記事にあるhttpをhttpsに一括変換する作業になります。

プラグインの新規追加が面に移動して、「Search Regex」と検索します。

次の画面のプラグインが出てきたらインストール、有効化をします。

httpからhttps

 

有効化をすると、置き換え機能は「ツール」→「Search Regex」と選択すると表示されます。

httpからhttps

 

Search Regexの設定画面に来たら、慎重に設定を始めます。

httpからhttps

SourceはPost Contentでその他はそのまま

Search patterはhttp://サイトのドメイン(最後の「/」入れないこと!

Replace patterはhttps://サイトのドメイン(最後の「/」入れないこと!

特にドメインは間違えないようにして下さい。

設定が終わったら、「Search」をクリックします。

 

すると、これから置き換える文字の確認が出来ます。

httpからhttps

みてもちょっと難しいと思うのですが、サイトのドメインが赤く表示されていればOKです。

確認が済んだら、今度は「Replace & Save(置き換えて保存)」をクリックします。

httpからhttps

置き換えが完了しました。

 

そうしたら、1度トップページをみてみましょう!

httpからhttps

残念ながらまだ、完全に切り替わっていないのが分かります。

これはなぜかというと、置き換えたのはあくまで記事の画像に限って置き換えているので、例えばロゴに使っている画像や、ヘッダーの画像、ウィジェットに使っている画像については場合によっては手動で置き換えなければいけません。

これからその作業を行います。

その前に、一つパソコンにインストールして欲しいブラウザがあります。

それはFireFoxです。

史上最速の Firefox をダウンロード
ページ読み込みの高速化、メモリー使用量の削減、さらに豊富な機能を兼ね備えた、まったく新しい Firefox、誕生。

FireFoxはインターネットエクスプローラやGoogle Chromeと同じホームページを見るためのブラウザです。

今後はこのFireFoxを無理に使う必要はありませんので、とりあえずこのSSL化のためだけにとりあえずインストールして下さい。(作業が終わったらアンインストールしても良いです。)

httpsに切り替わっていない画像を探すのに凄く便利です。

 

FireFoxを使ってhttpsに切り替わっていない画像を探す

それでは早速作業をしていきます。

FireFoxを開いて、サイトのドメインをhttps://サイトドメインでアクセスします。

FireFoxだと、httpが完全でないと鍵マークの横にビックリマークが付きます。

httpからhttps

 

それを確認したら、今度はその鍵マークをクリックします。

httpからhttps

するとダイアローグの右側に更に矢印が出てくるので、それをクリックします。

そうすると更に、画面がでてくるので、「詳細を表示」をクリックします。

httpからhttps

 

そうすると、今度は大きいダイアローグでページ情報がでてきます。

開いたときは「セキュリティ」のタブが開いているので、「メディア」をクリックします。

そうすると下のように、画像のURLが一覧で表示されます。

httpからhttps

これを見ながらどこに設定している画像かを探して、httpsにURLを変更してきます。

 

私のサイトだと、スクロールしてしたから2番目のところがhttpのままなのがわかりますね。(文字が小さくてすみません^^;)

httpからhttps

URLを選択すると自動でプレビューが表示されます。

そうすると、メガネの画像がどうやら書き換わっていないようです。

それは何処にあるかというと、サイドバーで設定した画像です。

httpからhttps

こんな風に、WordPressで設定した画像のURLまでは切り替わらないのです。

それを変更してきます。

画像が設定されているウィジェットまで行きます。

対象の画像を見つけたら、とりあえず消しちゃいましょう!

httpからhttps

 

そして、また同じ画像を挿入するために「メディアを追加」をクリックします。

httpからhttps

 

同じ画像を探して、選択するとURLが表示されますが、httpsになっていますよね?

httpからhttps

これはhttpsでこの管理画面にアクセスしているので、自動でそうなっています。

ですので、この状態で「投稿に挿入」をクリックします。

 

このあと保存します。

httpからhttps

 

それでは再度トップページを見てみましょう。

httpからhttps

どうでしょう、さっきまであった黄色いビックリマークが消えて、ちゃんと鍵マークが付いていますね。

これはchromeでも一緒です。

他のページも一応確認してみて、問題なければ以上でhttpsへの書き換え作業は終わります。

 

httpsへのリダイレクト処理

httpsの切替は先程の作業で無事完了しましたが、実は最後のもう一つだけやる事があります。

それはリダイレクト処理というものです。

リダイレクト処理は簡単にいうと、アクセスしたページから別のページへ強制的に移動させることを言います。

 

現在はhttpにアクセスしても、httpsにアクセスしてもどちらも見られる状態です。

しかしながら折角httpsを有効にしたのに、httpにアクセスされてしまってはセキュリティの観点からもよくないですよね。

なので最後の作業は、httpからhttpsへ強制的に移動させる処理をさせる為の作業をします。

 

プラグインを使ってリダイレクト処理をさせる

かつては、httpsへのリダイレクト処理はサーバー側の設定ファイルで行っていましたが、現在はWordPressでプラグインが用意されているのでそれを使っちゃいます。

今回は例としてさくらインターネットでhttps化を行いましたが、もしさくらインターネットをお使いの場合はさくらインターネットの公式のリダイレクト処理のプラグインがあるのでそちらをお勧めします。

httpからhttps

 

もし、さくらインターネット以外をお使いの場合は、「Really Simple SSL」がおすすめです。

httpからhttps

 

今回はさくらインターネットの公式SSL化プラグインで設定を進めますが、Really Simple SSLはインストールして有効にするだけですので、難しくは無いかなと思います。

 

それではさくらインターネットの公式SSL化プラグインで設定をしていきます。

プラグインをインストール後、設定は「設定」→「SAKURA RS SSL」をクリックします。

httpからhttps

 

設定画面を開いたら、色々文章で書いてあって難しそうですが、すでにSSL化は終わっているので、二つのチェックボックスにチェックを入れて、「SSL化を実行する」をクリックすればOKです。

httpからhttps

 

そうすると、ログイン画面になりますので、再度ログインします。

 

そうしたら、今度はトップページを表示します。

そして、わざとアドレスバーにhttp://サイトのドメインを入力してアクセスしてみます。

そうすると、どうでしょうか?

自動で鍵マークが付きましたか?

もし鍵マークがついたら、リダイレクト処理が成功です!

 

以上で無事httpからhttps化への全プロセスが完了しました。

お疲れさまでした!

 

最後に

httpからhttps化は本来は最初にやるのが楽で、その理由は途中にある書き換え作業が必要ないからです。

でも、書き換えるべき所が分かれば、こうしてやり方をまもればご自身でもできることですので、チャレンジしてみてはいかがでしょうか。

ただし作業をする際は必ずバックアップを取ることを忘れないで下さい。

 

この作業をお願いしたい場合

もしアクセスが多いWordPressサイトや長い間運営している記事の多いサイトの場合は、プロにお願いした方が良いです。

やはりデータベースを書き換えるという作業はリスクが伴う作業です。

バックアップがあってもそれが復元できないことや、不測の事態も起こり得るので、その点を考えてもお願いする方が確実です。

そういったときは、WordPressのプロであるテダスクにぜひご依頼下さい。

 

 

いいね!をしてWordPressの
お役立ち情報を受け取る!

コメント

タイトルとURLをコピーしました