SSL化したのに鍵マークが表示されない!?

どうも!トリでございますよ。

 

さて、前回に引き続きWPのSSL化のお話をしていきます。今回は新規ブログではなく、ある程度育ったブログをお持ちの方に向けての内容となっております。

 

前回お伝えした手順でhttps表示にはできたかと思います。が、「アドレスバーに鍵マークがつかないんだけど・・・」という問題にぶつかっている方が多くいるかと。

 

トリもその1人でした。「なんでや!?なにがあかんのや!?」と一人PCの前で唸っておりました。そして鍵マークがつかない原因という原因を1つずつ潰して、無事常時SSL化に成功しました!

 

今回は全米が涙したトリの汗と涙の常時SSL化に向けての戦いの記録をお伝えして参りたいと思います。

 

トリの記事を参考にWPの設定やテーマを編集する場合は必ず先にバックアップを取って下さいね!

 

 

SSL化の鍵マークが表示されない

 

アドレスに鍵マークが付かない場合の対処法

 

SSL化アドレスバー

 

URLはhttpsと表示されているのに、上記のように鍵マークが表示されない・・・という場合、もう少し細かいところまで設定してあげないと完全なるSSL化ブログにはなりません

 

で、ここが厄介なところで、どこをどうすれば完全なSSL化になるかってという答えは実はなくてですねーそれぞれのブログによって異なってくるんですねー。めんどうですねー。

 

なので、httpsって表示されているのに鍵マークが出ていないって方は、1つ1つその原因を探って潰していくしかないんです。そんなわけで、以下トリが試したことを列挙しておきますので、参考にしてくださいね。

 

 

トップページにあるhttpのリンクを全てhttpsに変更

そのサイト自体がSSL化できていたとしても、非SSL化(httpで始まる)のサイトへのリンクが貼られていると完全なSSL化にならないことがあるようです。

 

ただし完璧に外部リンクを全てhttpsにしないといけないかというと、実はそうでもないみたいで・・・。このブログのリンク集とか見てもらうとわかるのですが、httpのアドレスを持つサイトへのリンクが貼られていますが、きちんと完全SSL化の証拠である鍵マークが表示されているんですよね。

 

なので、とりあえずどのページへ行っても表示されるグローバルメニューやウィジェットに貼られているリンクはhttpsにしておくと良さそうです。

 

また、トップページにある画像や動画ファイルの参照先もhttpsのリンクにしておくと無難です。ま、とりあえずやれることは全てやってみましょう!

 

グローバルメニュー&ウィジェット

 

 

ブラウザの機能でSSL化のエラーを探す

トップページのリンクを全てhttpsにしてもまだ鍵マークが表示されない!となった場合、ブラウザに何がいけないのか聞いてみましょう。

 

  • Chromeの場合

まずはF12ボタンを押してみましょう。右側にズラズラズラーとなんかややこしそうなソースが出てきます。注目すべきは右下のボックスの"Console"タブ。"Mixed Content"というところにヒントが隠されています。要はそこに「httpsとhttpのリンクが混在してるよ~」って警告が出ている状態なんですね。なので、その表示されているリンクを直してあげればOKです。

はてな

 

今回の場合だとリンクにhatenaの文字が・・・。どうやらはてなブックマークへのリンクが影響している模様です。ということで、GOISBLOGさんのこちらの記事を参考にやってみました。

はてな原因

 

まず「テーマの編集」という禁断のゾーン(?)に潜入します。

テーマの編集

 

各phpファイルで"hatena"で検索をかけて、引っかかったところを片っ端から下記コードに書き換えました。

引用元:GOISBLOG

「SSL化(https)後のはてなブックマークが消えちゃう件」より

 

【BEFORE】

警告にも出ているように、一部httpの表記のままになっている箇所があります。

はてなbefore

 

【AFTER】

上記コードを<li>~</li>の間にコピペして、全てhttpsの表記に変更しました。

はてなafter

 

 

これで、どや!?

 

 

とトライしてみたら、やった!鍵マーク出た~♪(´∀`人)

 

 

・・・

 

 

・・・

 

 

・・・

 

 

(。´・ω・)ん?

 

 

まだなんかアドレスバーの右側に警告マークみたいなのが出てるけど・・・。

承認されていないソース

 

 

な、なんだこれは・・・?と思って「安全でないスクリプトを読み込む」をポチッてみた。

 

すると・・・

 

 

Chrome保護されていない

 

 

んNOOOOOOOOO!!!

 

 

なんと、余はまだ満足しないと申すか!ういやつよのぉ!

 

「教えてChrome!」ともう一度F12ボタンをポチー。

 

どうやら今度はjQueryとi2iが影響している模様。

i2i

 

 

まず、jQueryから潰そうか。

 

テーマの編集から「ヘッダー.php」を"jQuery"で検索をかけて、単純にhttpにsを付け加えました。これだけでエラー一覧からは消えてくれたので、まずはOK。

jQuery

 

 

つづいてi2i。

 

i2iアクセス解析はSSL化対応してるんかな~とサイトへ飛んで調べてみる。

i2i https

 

ありゃ~httpsのパーツを使うには有料版にせんとだめなのね。。。でもGoogle Analyticsも使ってるし、もうそっち一本でいこうかな~と思ったので、i2iアクセス解析を外すことにしました。

 

「ヘッダー.php」からi2iアクセス解析のコードを消して、無事エラー解除に成功。

 

 

  • Internet Exploreの場合

Chromeと同じくF12ボタンを押すとポップアップウィンドウが開きますので、「コンソール」タブに表示されているエラーを1つ1つ探っていってください。

IEコンソール

 

で、原因を潰して鍵マークが表示されても、ウィンドウ下段に下記のような警告文が出ている場合は、まだSSL化ブログ完全体にはなっていないということです。試しに「すべてのコンテンツを表示」を押してみると、「保護されていません」モードになるはずです。そういう時は再び、IEのコンソール機能を使って、セキュリティで保護されていないコンテンツが何かを探って、原因を潰していってください。

すべてのコンテンツを表示

 

※トリの場合はi2iアクセス解析がそれに該当していたようです。鍵マークが表示されている時はi2iアクセス解析が表示されていなかったのですが、「すべてのコンテンツを表示」とするとブログ内に表示されましたので。ご参考まで。

 

 

 

その他やっておくべきこと

サイトの完全SSL化がすんだら、「やれやれだぜ・・・」とジョジョ立ちをする前にまだやるべきことが残ってるんですねー。以下、更にトリがやったことをまとめておきます。

 

 

各種サービスの登録サイトを変更

ASPやランキングサイト等の各種サービスに登録してあるURLを「https」に変更しましょう。特にGoogle AnalyticsとGoogle Search Consoleは忘れずに。

 

  • Google Analytics

1.ログインして、「管理」→「プロパティ設定」でデフォルトのURLを「https://」に変更して保存します。

プロパティ設定

 

2.「管理」→「ビュー設定」でウェブサイトのURLを「https://」に変更して保存します。

ビューの設定

 

 

  • Google Search Console

つづいて、みんな大好きサチコちゃん。実はサチコはアナリティクスとは違って、1から登録し直さないといけないんです。登録の仕方を忘れちゃったという方は過去のサーチコンソールの記事を参考にしてくださいね。

 

 

SNSのカウント数を元に戻す

http→httpsにすると、なんと別サイトと見なされてSNSのカウントが0に戻っちゃうんです。こりゃ勿体ない!しかし、そんなお悩みも「SNS Count Cache」というプラグインで解決します。

 

ただ、私の場合、下記画像の通りFacebookとGoogle+だけはどうしても復活しなくて・・・値がN/Aのままなんですよ。こちらは目下調査中ですので、解決したらまたブログでシェアするようにしますね。

Not Available

 

1.プラグインの新規追加で「SNS Count Cache」をインストール→有効化にする。

SNS Count Cache

2.ダッシュボードの「SNS Count Cache」→「設定」をクリック。

SNS Count Cache設定

 

3.シェア数を復活させたいSNSをチェックし、HTTPからHTTPSへのスキーム移行モードを「有効」にして「設定の更新」をクリック。

シェアキャッシュ機能

 

4.しばらく時間が経てば、SNSのカウントが復活しているはずです。

 

 

 

まとめ

トリの完全SSL化をするまでの軌跡をご紹介しました。いや~めっちゃ長かったですね。あれこれやりまくって、結局何日か掛かった気がします。大変っていうより、めんどくさっ!っていう、これに限りますね。とにかく地道な作業なので。

 

でも1回やっておけば、後は特にすることもないですし、Googleの今後の評価にも多少繋がってくるんじゃないかな(現時点でSSL化は順位への影響は1%未満しかないようですが)。

 

めんどくさいことは先回しにしたい気持ちはわかります!が、今度記事が更に増えてもっとSSL化作業が大変になる前にちゃっちゃとやっちゃいましょう!

 

同じ問題を抱えて詰んでいる方は、トリの戦歴が少しでも役立ってくれると幸いです。

 

はぁーつかれた┐(´д`)┌

 

 

★2つのランキングに参加中!この記事がお役に立ちましたらクリック・シェアして頂けると励みになります(*´∀`*)

人気ブログランキング

ブログランキング・にほんブログ村へ

 

 

この記事に関連する記事一覧

コメントフォーム

名前

メールアドレス

URL

コメント

トラックバックURL: 

ページの先頭へ