【超重要】ブログをSSL化した後、早急にしないといけない5つの設定

after-ssl-5set

スポンサーリンク

こんにちは、色んな効率化が大好きなたぬ(@KAivlys)です!

個人のブログでもSEO対策セキュリティ向上といった目的のために、サイトをSSL化させる方が増えてきています。

知らないと損!ブログのSSL化がSEO対策に与える影響とは

2018.04.24

ところがロリポップやさくら、エックスサーバーといった、レンタルサーバーの設定でブログをSSL化させたから安心…。という訳にはいきません。

これから紹介する5つの設定をしないとブログを完全にSSL化させたとはGoogleに認めてもらえないんですよね。

after-ssl-5set6

SSL化したのに保護されていない例

SSL化したら、緑の文字で『保護された通信』とならないと意味がありません。

after-ssl-5set7

きちんとSSL化成功している例

そこで今回は、各レンタルサーバーでSSL化をさせた後、ブログで早急に行わないといけない5つの設定を紹介していこうと思います!

WordPressの設定

after-ssl-5set1

まずは、WordPressの設定です。

管理画面のサイドバーから、設定 > 一般の順に入ります。

after-ssl-5set8

WordPressアドレス(URL)とサイトアドレス(URL)を『https』に変更します。

after-ssl-5set9

これで、WordPressの設定はおしまいです。

保存ボタンを押すとWordPressから強制的にログアウトさせられるので、ログインし直しましょうね。

画像のURLを変更する

after-ssl-5set2

この章の設定を行うと、完全なhttpsサイトにあなたのサイトが生まれ変わります!

具体的にどうするのかというと、画像の読み込みをすべて『https』に変更します。

さっそく、いまサイトの記事がどうなっているか見てみましょう。

after-ssl-5set22

たぬハックのとある記事

サイトをhttpsにしただけだと、画像のリンクが全て『http』のままなんですね。

after-ssl-5set6

画像のリンクをすべてhttpsに変更すれば、完全に保護されたページになります。

つまり、完全なhttpsサイトにするためには、Webサイト内全ての画像をhttpsに変更する必要があります。

記事の中

まず、記事の中の画像URLを変更する方法を紹介します。

1つ1つ記事をみなして、httpsに変更してもいいですが、100記事近く書いてる場合、この方法では時間もかかる上、とても骨が折れますよね。

そこで紹介したいのが、『Search Regex』という神プラグインです。

Search Regexを使うと、記事の中に存在する全てのhttpをhttpsに置換することができます!!

こんな便利な手を使わないなんてありません!さっそく使い方を紹介します(^o^)

STEP1:Search Regexをインストールする



プラグイン>新規追加から『Search Regex』を検索します。

after-ssl-5set23

インストールが完了したら、プラグインを有効化するのをお忘れなく!

after-ssl-5set24

STEP2:Search Regexを使う

ツール>Search Regexで設定画面に移動します。

after-ssl-5set25 after-ssl-5set26
  1. Search pattern:検索する文字列(http://〇〇〇〇)
  2. Replace pattern:置換する文字列(https://〇〇〇〇)

入力し終わったら、いよいよ実行結果を確認してみましょう!

STEP3:[Replace]で実行結果予想を確認する

after-ssl-5set29 after-ssl-5set27

私のブログでは63記事の段階でSSL化したので、記事の中にhttp表記のimgタグが738個ありました。

これが一気に置換されるって想像するとワクワクしますよね!

ドキドキとワクワクを内に秘めて、置換を実行してみましょう。

STEP4:[Replace&Save]で置換を実行する

after-ssl-5set28

STEP5:記事の中を確認する

after-ssl-5set30

ちゃんと、記事の中のhttpがhttpsに変更されていますね♪

記事の中のhttp表記をhttpsに書き換えたところで、気になるURLを確認してみましょう。

after-ssl-5set6

まだ、完璧ではないみたい

画像を使っているところで、記事は修正しましたね。

となると、後はどこに問題があるのでしょうか…。

答えは、ウィジェットでした。

ウィジェット

私のブログでは、サイドバーから画像を読み込んでいたので、このことが原因で保護されたページとして認識されませんでした。

after-ssl-5set31

PCのサイドバー

ウィジェットの画像読み込みもhttpsに変更して、ついに…。

after-ssl-5set7

きちんとSSL化に対応しました。

記事の中の画像をhttpsに全て書き換えても、保護されたページにならなかった方はウィジェットも確認してみてください。

Googleアナリティクスの設定

after-ssl-5set3

解析ツールでGoogleアナリティクスを使っている人は、設定のウェブサイトのURLを『https』に変えておきましょう。

STEP1:サイドバーから[管理]を選択

after-ssl-5set10

STEP2:[プロパティ設定]、[ビューの設定]の順に選択

after-ssl-5set11

STEP3:ウェブサイトのURLを『https』に変更

after-ssl-5set12

選択したら保存して、Googleアナリティクスの設定はおしまいです。

Search Consoleの設定

after-ssl-5set4

次に設定すべきものは、ブロガーの生命線であるSearch Consoleです。

httpshttpは、Googleに全く別のページと認識されるので、httpsもSearch Consoleに新しく登録しなければいけません。

httpsのサイトを新たに登録させる

www無しVerと、www有りVerの2つを保存します。

httpの頃からSearch Consoleを使っていた人は、下の写真のように4つ登録できてたらOKです!

after-ssl-5set14

※ここではSearch Consoleの登録の仕方は割愛させていただきます。

このままだと、サイトマップがまだ登録されていないので、ロボットの巡回を早めるためにも、サイトマップを送信しておきましょう。

after-ssl-5set15

SSL化してもSearch Consoleは今まで通り使えるので、『wwwの有無でどちらを優先的に使うか』などの設定も各自やっておくといいです。

Googleアナリティクスと連係しなおす

アナリティクスとSearch Consoleを連係させている方は、httpsの方で再度、接続し直す必要があります。

STEP1:httpの接続を解除する

after-ssl-5set20

Googleアナリティクス

まず、アナリティクスの画面から、管理>プロパティ設定>Search Consoleを調整の順で選択します。

after-ssl-5set16

そして、httpの接続を削除します。

STEP2:httpsと接続する

次にSearch Consoleの画面から、設定(画面右上の歯車アイコン)>Googleアナリティクスのプロパティの順で選択します。

after-ssl-5set17

httpsと接続してSearch Consoleにサイトを追加を選択します。

Search Consoleのトップページで、下の画像のようにhttpとリンクが解除されて、httpsとリンクが関連付けられているのを確認しておきましょう。

after-ssl-5set18

STEP3:アナリティクスの画面でも確認する

念には念を、Googleアナリティクスの画面でもSearch Consoleに接続されているか確認しておくと良いです。

after-ssl-5set19

[管理] > [プロパティ設定] > [Search Consoleを調整]

これで、Search Consoleの設定もおしまいです。

301リダイレクトの設定

after-ssl-5set5

「301リダイレクト?なにそれ、美味しいの?」という人は危険です。

SSL化させたら、必ず301リダイレクトの設定をしておきましょう。

リダイレクト

あるWebページから自動的に他のウェブページに転送すること。

つまり、SSL化する前に自分のサイトに張られたhttpのページから、強制的にhttpsのページに転送することができるという訳です。

リダイレクトの種類
  1. 301リダイレクト:ページランクを渡す恒久的なリダイレクトGoogle推奨
  2. 302リダイレクト:ページランクを渡さない一時的なリダイレクト

リダイレクトには2種類ありますが、無難にGoogleが推奨している301リダイレクトを使いましょう。

次に、リダレクトを行う方法を紹介します。

.htaccessを変更する

.htaccessはサーバーのドメイン直下に隠しフォルダとして存在しています。

MacならTransmit、WindowsならFileZillaでファイルをダウンロードして、正しく記述してアップロードし直しましょう!

FTPソフトを使えない方は、WordPressの管理画面から.htaccessを直接変更できるプラグインもあるみたいです。

プラグイン新規追加から『WP Htaccess Editor』と検索して使ってみて下さい。

STEP1:リダイレクトのコードを書く

after-ssl-5set21

WordPressを使っている方は、WordPressのコードが記述してあるので、それよりも前の行に、以下のコードを記述してくださいね。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://ドメイン/$1 [R=301,L]
</IfModule>

コードの中のドメインは自分のサイトのドメインを記述します。

なぜかWordPressのコードよりリダイレクトのコードを後ろに記述すると、うまくリダイレクトが起動しません!!

(ここで1時間くらい格闘したんだよなあ…。)

これで、301リダイレクトの設定もおしまいです。『http://あなたのドメイン名』で動作確認も忘れずに!

さいごに

今回はブログをSSL化させた後、早急にやらないといけない5つの設定を紹介しました。

どの設定もブログの生命線級に大事なことなので、抜かりなくキチンとやっておきましょう。

SEO的にまだSSL化の恩恵は少ないですが、やっておくに越したことはないと思います。

わからないことがあれば、何でも聞いてくださいね〜。力になれる範囲でがんばります。

それでは

スポンサーリンク

after-ssl-5set

ABOUTこの記事を書いてる人

たぬ(谷口健太)

25歳社会人。本職は福岡の通販会社でWebマーケッターやっとります。 プログラミング✕マーケティング=最強説を唱えており、非効率的な世の中に革命を起こそうと本ブログを設立。 ストレングスファインダー:戦略性・最上志向・目標志向・未来志向・個別化

NEW POSTこのブログの最新記事