2018年9月10日WordPressで、SSL化したのにアドレスバーに「このサイトへの接続は完全には保護されていません」と表示される時の対処法についてまとめました。おじさんの場合、原因は2つあったのですが、ブログカードと画像のURLが原因でした。原因2:削除した画像の挿入コードが残ってる原因2の対処法まとめ症状アドレスバーに表示されるステータスには大きく分けて3つあります。「保護された通信」だとサイトはSSL化されhttps://で始まるURLになっているので安全ですよ、ということです。「情報、または保護されていない通信」はさらに細かく分けられるようです。「このサイトへの接続は完全には保護されていません」などがそうです。「保護されていない通信、または危険」は明らかに危険な場合です。フィッシング詐欺のサイトとかはこれですね。今回おじさんが遭遇したのは「このサイトへの接続は完全には保護されていません」という警告です。以下で、この状態から「保護された通信」にする方法を解説します。「保護された通信」のメリット対処法を解説する前に「保護された通信」にするメリットについて説明しておきます。おじさん的にはメリットは以下の2つだと思います。Googleからの評価が上がるサイト訪問者が安心するGoogleは2015年からhttpsのページを優先的にインデックスするようになっています。常にユーザーのセキュリティを最優先に考え、長年にわたってウェブの安全性の向上やブラウジング体験の改善に取り組んできました。掲載順位を若干引き上げる取り組みにも着手しました。データ改ざんの対象となってはいけません。everywhere」の推進に取り組んできたのはこのためです。いうことで、httpsの方が検索順位が上がる、逆に言えばhttpは検索順位が下がるということです。ユーザーもアドレスバーを見て緑色の表示になっていれば安心して閲覧できます。原因1:ブログカードおじさんの場合、「このサイトへの接続は完全には保護されていません」となっていた原因の1つはブログカードでした。ブログカードというのはこんな感じで記事内にリンクを貼るとそれがカードのように表示される機能です。当ブログはこの記事を書いている時点ではLuxeritasというテーマを使っていますLuxeritasはブログカードが使えるようになっています。見栄えがいいのでおじさんも使ってたんですがまさかこれが原因だとは。原因の特定方法どうやってブログカードが原因であることを特定したかというと、「Googleデベロッパーツール」です。デベロッパーツールの参考:Web開発でよく使う、特に使えるChromeデベロッパー・ツールの機能デベロッパーツールの機能を使って調べたところ、以下の画像のような警告を発見しました。2枚目の画像の赤枠のところに「blogcard」と書かれていることから、原因がブログカードにあることがわかりました。アドレスバーの「完全に保護されていません」の情報には「このサイトで目にする画像は、悪意のあるユーザーによって差し替えられたものである可能性があります」と書かれていることから、ブログカードで使われている画像が悪さをしていることがわかりました。image」と表示されているので、ブログカードの画像のsrc属性がhttpであることが原因であることがわかりました。原因1の対処法どうやらブログカードの画像のsrc属性のhttpをhttpsに変えてやれば良さそうですが、方法は色々ありそうです。ブログカードを表示するコードはLuxeritasのphpに書かれているので、それを変更することも考えましたが、コードの場所の特定がめんどくさいし、コードをうまく修正できるかどうか怪しかったのでこの方法はあきらめました。参考2:HTTPで稼働しているWordPressサイトを常時SSL、HTTP/2化する方法(実践編)もう1つ思いついたのはブログカードの機能をオフにすることです。試しにwordpress(Luxeritas)でブログカードの機能を「ブログカード有効化」と「直書きのURLをブログカード化する」の両方ともチェックをはずしてみたところ、いくつかのページではデベロッパーツールの警告も消え、アドレスバーも「保護された通信」になりました。ところが、「完全に保護されていません」と表示されるページがいくつか残ってしまいました。原因2:削除した画像の挿入コードが残ってる「完全に保護されていません」と表示されたままだったので、再びデベロッパーツールを開いてチェックして見ると以下の画像のように、先ほどと同じ警告が表示されていました。wordpressで該当箇所を見てみると警告されているはずの画像が表示されていないことに気がつきました。怪しいと思ったのでエディタを「テキスト」に変えて見たところ以下の画像のようになっていました。画像は表示されていないのに、画像を挿入するコードだけ生き残ってました。これがもう1つの原因でした。画像を挿入したもののいらないと思ってあとで消したために、挿入コードだけ残ったんだと思います。原因2の対処法ということで、画像は表示されていないのに残っていたコードを消去したら、ちゃんと「保護された通信」と表示されるようになりました。まとめhttpsにした方がSEO的に良い「このサイトへの接続は完全には保護されていません」の原因はブログカードかももう一つの原因は残された画像挿入コードかもSSL化については以下の記事も参考になるかもしれません。ossanおじログロリポップ!(LOLIPOP!)でサーバー契約するときの手順をまとめました。ossanおじログGoogleアカウントを作成するときの手順をまとめました。これさえ読めば初心者の方でも簡単に作成できます。ossanおじログムームードメインでDNSサーバー(ネームサーバー)の設定をする手順についてまとめました。...サイト内検索おじさんこんにちは。WordPressとかブログ運営でわかったこと、調べたことを書いてます。国民年金制度について詳しく解説(お得な情報もあるよ)歯磨き&マウスケアグッズで個人的に買って良かったものリストTopMediaの鈴木幸子のメールはスパムだよサイバーマンデーで欲しいもの集めてみた。