FC2ブログの常時SSL化を完了
3 Comments
常時SSL化は大仕事と聞いて二の足を踏んでいたが丸1日でほぼ完了。当ブログは記事も修正箇所も少なめで助かった。一通りやったことを書いておいたのでまだの人は参考にどうぞ。
◆はじめに
SSL化の設定をする前にブログテンプレートをレスポンシブデザインのものにしておくことを推奨。ブログのデザインが一新されるのはアレだがSSL化の作業はだいぶ楽になるはず。
FC2ブログのテンプレートをレスポンシブデザインに変更
以下の3項目は既にSearch ConsoleやGoogle Analyticsを導入済みの場合に必要な手順。
◆Searh Consoleに新規URLを登録
◆サイトマップの作成
◆Search ConsoleとGoogle Analyticsの関連付け
ブログやってるならSearch Console(旧ウェブマスターツール)とGoogle Analyticsぐらいは導入しておくと色々役立つかも。過去記事古い上にろくに画像がなくて見づらいけど一応載せておく。
ウェブマスターツールの設定と使い方
Googleアナリティクスの設定と使い方
用語の解説など細かいところは省略。経過観察などで若干修正が必要な箇所もあるのでその辺りはご了承下さい。
◆SSL設定
まずサイドバーの設定から環境設定 → ブログの設定 → SSL設定で無効から有効に変更。
転送設定に302(一時的な転送)、301(恒久的な転送)の2種類があるが最初は302にしておく。301に切り替えるのは一通りSSL化の作業ができた後。
301リダイレクトができているかは以下のサイトで確認。TOPページと適当な個別記事のhttp://~から始まるURLでチェックし、リダイレクト先がhttps://~になっていれば完了。
リダイレクトチェック | SEOチェックのためのSEOツール集 ohotuku.jp
◆Searh Consoleに新規URLを登録
SSLを有効にしたらSearch Console - ホームで新規URLを追加する。
「プロパティを追加」でhttpsで始まるサイトのURLを入力し追加。
サイトの所有権を確認。PC用テンプレートにGoogleアナリティクスを設置していればすぐ終わる。
「~の所有権が確認されました。」と出れば完了。
Search ConsoleのTOPページでhttp、httpsの2つが表示されていればOK。
◆サイトマップの作成
サイトマップの作成とSearch Consoleへの登録
サイトマップの作成については以前書いてるので参考にどうぞ。最後によく分からず放置していたが、いつの間にか送信されていたので今回も大丈夫なはず。
httpsのサイトマップを送信。これまでのhttpの方はある程度httpsの方でインデックスできたのを確認してから削除した方が良いとか。
反映されるまで1ヶ月待つこともあるらしいので気長に待つ。※上記画像はhttpのサイトマップ。
◆Search ConsoleとGoogle Analyticsの関連付け
Google Analytics
左カラムの管理(歯車アイコン)からプロパティ設定、ビュー設定のURLを変更。
▼プロパティ設定
デフォルトのURLを「https://」に変更。
▼ビュー設定
ウェブサイトのURLを「https://」に変更。
▼プロパティ設定(Search Console)
プロパティ設定の下の方にある「Search Console を調整」をクリック。
「編集」をクリック。
本来ならここにhttpsで始まるURLが出ているはずなのだが、何故か出なかったので保留。たぶんまだサイトマップが送信されてないせい。
この項目はここで詰まったので続きは以下のサイトを参照。
サイトのHTTPS化で必要となるGoogleサーチコンソールの再登録方法
◆FC2カウンター･アクセス解析のHTMLタグ差し替え
これに関しては公式参照。カウンターとアクセス解析だけでなく、メールフォーム、アフィリエイト、ショッピングカートも対象。
FC2アクセス解析では左カラムの設定 → 解析ページの管理 → 解析ページの登録でhttpsのURLを追加しておく。リダイレクトすればhttpsでカウントするだろうし今まであったhttpの方は削除。
追加したら上の方にある「タグチェックツール」で正しく解析できるかチェックしておく。
◆広告のHTMLタグ差し替え
当ブログの場合、忍者AdMaxとAmazonの広告を設置しているのでその2つを差し替え。
▼忍者AdMax
忍者AdMaxはPC&スマホ用テンプレートのタグを最新のものに差し替えるだけ。右カラムのバナー画像はそのまま貼っているとエラーが出たのでバナー画像からリンクを削除。
11/03追記 レスポンシブデザイン適用で広告の貼り方が変わったので別記事作成。
忍者AdMax レスポンシブ広告でPC・スマホの表示を切り替える
▼Amazon ※個別記事で必要な作業なのでTOPページのSSL化後で良い。
Amazonの広告はBabyLinkを使って貼っていたのだが、各記事で貼ってある広告を全て差し替える必要がありこれに一番時間がかかった。当ブログは50記事もなかったと思うがそれでもかなり大変。
やり方は全記事を1つずつチェックしてアドレスバーに「保護された通信」と出てない記事でHTMLタグを差し替える地道な作業。これを機に需要なさそうな記事は差し替えが面倒で非公開に。
BabyLinkはいつの間にかhttpsに対応していたので当ブログだと2016/11/15以降の記事では差し替えの必要なし。
広告タグの変更箇所を調べて記事本文をまとめてメモ帳などに貼り付け、全て置換すれば楽。
BabyLinkの場合
◆「保護された通信」と表示されない場合
FC2カウンターやFC2アクセス解析、テンプレートの各種広告を差し替えてもTOPページで「保護された通信」と表示されない場合、他の原因が考えられる。
Chromeなら右クリックからコンテキストメニューの検証でConsoleタブを開く。おそらく「Mixed Content:」という警告が出ているはずなので、テンプレートでその部分を修正。
「保護された通信」と表示されるようになれば完了。それでも保護されずアドレスバーに盾アイコンが出ていれば次の項目も試す。
◆アドレスバーに表示される盾アイコンを消す
盾アイコンをクリックすると「このページは承認されていないソースからのスクリプトを読み込もうとしています」と表示される。これはテンプレートのスクリプトファイルが原因。
先程と同じく「Mixed Content:」の内容を確認。当ブログの場合、jqueryのURLが絶対パス「http://~」になっていたので相対パス「//~」に修正。外部URLだし絶対パスで「https://~」の方が良いかも。
正直このjqueryの1行は消してしまいたいがどこに影響があるか分からないし放置。
個別記事だとニコニコ動画のプレイヤー埋め込みタグが原因の場合もあった。YouTubeは問題ないのに差し替え面倒な…。
盾アイコンが消えて今度こそSSL化を完了。まだよく分からない警告が出ているが特に問題なさそうだしスルー。
◆内部リンクの修正
10/20追記 この項目は10/18辺りに修正されたので読み飛ばしてOK。
【ブログ】 SSL対応につきまして 【重要】 - FC2総合インフォメーション
内部リンクを「http://~」にしていた場合、そのリンクを踏むと302リダイレクトによってURLが自動で「https://~」になる。しかしリダイレクトされて辿り着くURLが問題。
これが正規(https:)の個別記事のURLなのだが、
https://tokitamaroku.blog.fc2.com/blog-entry-000.html
↓
過去記事(http:)の内部リンクを踏むと…
http://tokitamaroku.blog.fc2.com/blog-entry-000.html
↓
302リダイレクトでこうなってしまう。
https://tokitamaroku.blog.fc2.com/?no=000
301リダイレクトであれば正規のURLにリダイレクトされるが、FC2ブログのSSL化は302リダイレクトなのでこれに関してはどうしようもない。
ただこのままだとタイトルタグの重複が起こり、検索結果に一部URLが違うだけの同内容の記事が乱立しかねないのでSEO的にあまり宜しくない。
対策として内部リンクから(http:)を消しておけば
//tokitamaroku.blog.fc2.com/blog-entry-000.html
↓
302リダイレクトにより自動で正規URL(https:)になる。
https://tokitamaroku.blog.fc2.com/blog-entry-000.html
今後内部リンクをするときは絶対パス「https://~」ではなく相対パス「//~」で記述するべし。
普段から相対パスで記述しているならこの作業は不要。302リダイレクトの場合、全記事の内部リンクを相対パスにするべきだがcanonicalで正規化していればそこまで問題ないと思われる。
正規化については過去記事を参照。SEOに拘りないなら正規化しなくても良いような気はする。
検索結果にスマホ・携帯のページが出てこないようにする
■その他
レスポンシブデザインのテンプレートでなければPC用だけでなくスマホ用の修正も必須。サイドバーなどのプラグインは忘れがちなので注意。
個別記事で保護されてないのは広告などの内部リンクの修正が必要なので、先にTOPページで「保護された通信」と表示されるようになってから。
SNSボタンのカウントがSSL化でリセットされるのはどうしようもないので我慢。httpsに対応してないものは修正するか最新のものにする。一応最新のものと比較しておくべき。
10/24
常時SSL化(301リダイレクト)とブログテンプレートのレスポンシブデザイン移行が完了。
以下はレスポンシブデザインにする前の愚痴なのでスルー推奨。
SSL化とは関係ないけどスマホ用テンプレートに何年もアクセス解析(FC2・Google)のタグ設置を忘れていたのは痛い。10/7に気づいてから前後のアクセス確認したら全体の40%もスマホって…。
当ブログの全記事SSL化とアクセス解析の設置が完了したのは10/7、その後10/8からはアクセス数が約1.5倍になったけど、本来SSL化に伴いアクセス数が落ち込むこともあるとか。
その後FC2アクセス解析とFC2カウンターのカウント数があまりにも違っておかしいと思ったら今度はスマホ用テンプレートにFC2カウンターが無くて慌てて設置するはめに。
設置する場所はスマホ用プラグインのフリーエリア、もしくは</body>の直前のどちらか。前者はプラグインがTOPページでしか表示されず、個別記事でカウントされない場合があるので注意。
FC2ブログのスマホ用テンプレートにアクセス解析やカウンターのタグ入れ忘れてる人は結構いるみたいなので最後までこの記事読んだ人は一応チェックしておいた方が良いかも。
SSL化の設定をする前にブログテンプレートをレスポンシブデザインのものにしておくことを推奨。ブログのデザインが一新されるのはアレだがSSL化の作業はだいぶ楽になるはず。
FC2ブログのテンプレートをレスポンシブデザインに変更
以下の3項目は既にSearch ConsoleやGoogle Analyticsを導入済みの場合に必要な手順。
◆Searh Consoleに新規URLを登録
◆サイトマップの作成
◆Search ConsoleとGoogle Analyticsの関連付け
ブログやってるならSearch Console(旧ウェブマスターツール)とGoogle Analyticsぐらいは導入しておくと色々役立つかも。過去記事古い上にろくに画像がなくて見づらいけど一応載せておく。
ウェブマスターツールの設定と使い方
Googleアナリティクスの設定と使い方
用語の解説など細かいところは省略。経過観察などで若干修正が必要な箇所もあるのでその辺りはご了承下さい。
◆SSL設定
まずサイドバーの設定から環境設定 → ブログの設定 → SSL設定で無効から有効に変更。
転送設定に302(一時的な転送)、301(恒久的な転送)の2種類があるが最初は302にしておく。301に切り替えるのは一通りSSL化の作業ができた後。
301リダイレクトができているかは以下のサイトで確認。TOPページと適当な個別記事のhttp://~から始まるURLでチェックし、リダイレクト先がhttps://~になっていれば完了。
リダイレクトチェック | SEOチェックのためのSEOツール集 ohotuku.jp
◆Searh Consoleに新規URLを登録
SSLを有効にしたらSearch Console - ホームで新規URLを追加する。
「プロパティを追加」でhttpsで始まるサイトのURLを入力し追加。
サイトの所有権を確認。PC用テンプレートにGoogleアナリティクスを設置していればすぐ終わる。
「~の所有権が確認されました。」と出れば完了。
Search ConsoleのTOPページでhttp、httpsの2つが表示されていればOK。
◆サイトマップの作成
サイトマップの作成とSearch Consoleへの登録
サイトマップの作成については以前書いてるので参考にどうぞ。最後によく分からず放置していたが、いつの間にか送信されていたので今回も大丈夫なはず。
httpsのサイトマップを送信。これまでのhttpの方はある程度httpsの方でインデックスできたのを確認してから削除した方が良いとか。
反映されるまで1ヶ月待つこともあるらしいので気長に待つ。※上記画像はhttpのサイトマップ。
◆Search ConsoleとGoogle Analyticsの関連付け
Google Analytics
左カラムの管理(歯車アイコン)からプロパティ設定、ビュー設定のURLを変更。
▼プロパティ設定
デフォルトのURLを「https://」に変更。
▼ビュー設定
ウェブサイトのURLを「https://」に変更。
▼プロパティ設定(Search Console)
プロパティ設定の下の方にある「Search Console を調整」をクリック。
「編集」をクリック。
本来ならここにhttpsで始まるURLが出ているはずなのだが、何故か出なかったので保留。たぶんまだサイトマップが送信されてないせい。
この項目はここで詰まったので続きは以下のサイトを参照。
サイトのHTTPS化で必要となるGoogleサーチコンソールの再登録方法
◆FC2カウンター･アクセス解析のHTMLタグ差し替え
これに関しては公式参照。カウンターとアクセス解析だけでなく、メールフォーム、アフィリエイト、ショッピングカートも対象。
・FC2カウンターのHTMLタグ差し替え手順
＜ブログでプラグインを使用している場合＞
１．FC2ブログ（http://blog.fc2.com/）へログイン
２．左メニュー「プラグインの設定」をクリック
３．既に設置している「FC2カウンター」のプラグインの「x」を押して削除
４．再度「公式プラグイン追加」より「FC2カウンター」を追加
FC2総合インフォメーション 【重要なお知らせ】 FC2サービスのSSL化につきまして
・FC2アクセス解析のHTMLタグ差し替え手順
１．FC2アクセス解析（http://analyzer.fc2.com/）へログイン
２．「解析ページ選択」から該当のページを選択
３．左メニュー設定の「設置用HTMLタグ」をクリック
４．表示されたFC2アクセス解析のHTMLタグをすべて選択してコピー
５．既にホームページやブログに貼り付けているHTMLタグを削除し、
そこへ４．でコピーしたタグをペースト
FC2総合インフォメーション 【重要なお知らせ】 FC2サービスのSSL化につきまして
FC2アクセス解析では左カラムの設定 → 解析ページの管理 → 解析ページの登録でhttpsのURLを追加しておく。リダイレクトすればhttpsでカウントするだろうし今まであったhttpの方は削除。
追加したら上の方にある「タグチェックツール」で正しく解析できるかチェックしておく。
◆広告のHTMLタグ差し替え
当ブログの場合、忍者AdMaxとAmazonの広告を設置しているのでその2つを差し替え。
▼忍者AdMax
忍者AdMaxはPC&スマホ用テンプレートのタグを最新のものに差し替えるだけ。右カラムのバナー画像はそのまま貼っているとエラーが出たのでバナー画像からリンクを削除。
11/03追記 レスポンシブデザイン適用で広告の貼り方が変わったので別記事作成。
忍者AdMax レスポンシブ広告でPC・スマホの表示を切り替える
▼Amazon ※個別記事で必要な作業なのでTOPページのSSL化後で良い。
Amazonの広告はBabyLinkを使って貼っていたのだが、各記事で貼ってある広告を全て差し替える必要がありこれに一番時間がかかった。当ブログは50記事もなかったと思うがそれでもかなり大変。
やり方は全記事を1つずつチェックしてアドレスバーに「保護された通信」と出てない記事でHTMLタグを差し替える地道な作業。これを機に需要なさそうな記事は差し替えが面倒で非公開に。
BabyLinkはいつの間にかhttpsに対応していたので当ブログだと2016/11/15以降の記事では差し替えの必要なし。
広告タグの変更箇所を調べて記事本文をまとめてメモ帳などに貼り付け、全て置換すれば楽。
BabyLinkの場合
| 検索する文字列 | http://ecx.images-amazon.com/ |
| 置換後の文字列 | https://images-fe.ssl-images-amazon.com/ |
◆「保護された通信」と表示されない場合
FC2カウンターやFC2アクセス解析、テンプレートの各種広告を差し替えてもTOPページで「保護された通信」と表示されない場合、他の原因が考えられる。
Chromeなら右クリックからコンテキストメニューの検証でConsoleタブを開く。おそらく「Mixed Content:」という警告が出ているはずなので、テンプレートでその部分を修正。
「保護された通信」と表示されるようになれば完了。それでも保護されずアドレスバーに盾アイコンが出ていれば次の項目も試す。
◆アドレスバーに表示される盾アイコンを消す
盾アイコンをクリックすると「このページは承認されていないソースからのスクリプトを読み込もうとしています」と表示される。これはテンプレートのスクリプトファイルが原因。
| 絶対パス | <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> |
| 相対パス | <script src="//code.jquery.com/jquery-1.7.1.min.js"></script> |
正直このjqueryの1行は消してしまいたいがどこに影響があるか分からないし放置。
個別記事だとニコニコ動画のプレイヤー埋め込みタグが原因の場合もあった。YouTubeは問題ないのに差し替え面倒な…。
盾アイコンが消えて今度こそSSL化を完了。まだよく分からない警告が出ているが特に問題なさそうだしスルー。
◆内部リンクの修正
10/20追記 この項目は10/18辺りに修正されたので読み飛ばしてOK。
【ブログ】 SSL対応につきまして 【重要】 - FC2総合インフォメーション
内部リンクを「http://~」にしていた場合、そのリンクを踏むと302リダイレクトによってURLが自動で「https://~」になる。しかしリダイレクトされて辿り着くURLが問題。
これが正規(https:)の個別記事のURLなのだが、
https://tokitamaroku.blog.fc2.com/blog-entry-000.html
↓
過去記事(http:)の内部リンクを踏むと…
http://tokitamaroku.blog.fc2.com/blog-entry-000.html
↓
302リダイレクトでこうなってしまう。
https://tokitamaroku.blog.fc2.com/?no=000
301リダイレクトであれば正規のURLにリダイレクトされるが、FC2ブログのSSL化は302リダイレクトなのでこれに関してはどうしようもない。
ただこのままだとタイトルタグの重複が起こり、検索結果に一部URLが違うだけの同内容の記事が乱立しかねないのでSEO的にあまり宜しくない。
対策として内部リンクから(http:)を消しておけば
//tokitamaroku.blog.fc2.com/blog-entry-000.html
↓
302リダイレクトにより自動で正規URL(https:)になる。
https://tokitamaroku.blog.fc2.com/blog-entry-000.html
今後内部リンクをするときは絶対パス「https://~」ではなく相対パス「//~」で記述するべし。
普段から相対パスで記述しているならこの作業は不要。302リダイレクトの場合、全記事の内部リンクを相対パスにするべきだがcanonicalで正規化していればそこまで問題ないと思われる。
正規化については過去記事を参照。SEOに拘りないなら正規化しなくても良いような気はする。
検索結果にスマホ・携帯のページが出てこないようにする
■その他
レスポンシブデザインのテンプレートでなければPC用だけでなくスマホ用の修正も必須。サイドバーなどのプラグインは忘れがちなので注意。
個別記事で保護されてないのは広告などの内部リンクの修正が必要なので、先にTOPページで「保護された通信」と表示されるようになってから。
SNSボタンのカウントがSSL化でリセットされるのはどうしようもないので我慢。httpsに対応してないものは修正するか最新のものにする。一応最新のものと比較しておくべき。
10/24
常時SSL化(301リダイレクト)とブログテンプレートのレスポンシブデザイン移行が完了。
以下はレスポンシブデザインにする前の愚痴なのでスルー推奨。
SSL化とは関係ないけどスマホ用テンプレートに何年もアクセス解析(FC2・Google)のタグ設置を忘れていたのは痛い。10/7に気づいてから前後のアクセス確認したら全体の40%もスマホって…。
当ブログの全記事SSL化とアクセス解析の設置が完了したのは10/7、その後10/8からはアクセス数が約1.5倍になったけど、本来SSL化に伴いアクセス数が落ち込むこともあるとか。
その後FC2アクセス解析とFC2カウンターのカウント数があまりにも違っておかしいと思ったら今度はスマホ用テンプレートにFC2カウンターが無くて慌てて設置するはめに。
設置する場所はスマホ用プラグインのフリーエリア、もしくは</body>の直前のどちらか。前者はプラグインがTOPページでしか表示されず、個別記事でカウントされない場合があるので注意。
FC2ブログのスマホ用テンプレートにアクセス解析やカウンターのタグ入れ忘れてる人は結構いるみたいなので最後までこの記事読んだ人は一応チェックしておいた方が良いかも。
- 関連記事
-
-
FC2ブログでブログカード作成
2021/11/03
-
FC2ブログの常時SSL化を完了
2017/10/13
-
サイトマップの作成とSearch Consoleへの登録
2016/05/21
-
タイトルタグの重複を改善
2016/04/06
-
重複するメタデータ(descriptions)の改善
2015/11/14
-
