【図解】WordPress SSL化(https化)のURL横のiマーク(Mixed Content警告)を消す方法を解説!
SSL化は終わったはずなのにURL横の謎の「i」マークがどうしても消えない!!どうしたらいいのかわからない!消し方が知りたい!
実際に同じ状況に陥って悩まされた私が、このお悩みを超カンタンに解決できる方法を画像(図解)つきでシェアします♪
Contents
【図解】WordPress SSL化(https化)のURL横のiマーク(Mixed Content警告)を消す方法を解説!
みなさ~ん!
SSL化、終わってますか~っ?
常時SSL化デッドラインの7月24日!もうすぐそこに迫っています!
その日以降は、Google ChromeでアクセスするとSSLで保護されていない全てのページで「安全でない」とババン!!と警告が表示されることが決定しています。
そんな警告がでる怖いサイト、即「戻るボタン」で閉じられちゃいます。
私だったら絶対そうする…(TωT)!
デッドラインを目前に控え、読者さんに「まだ終わってないんですか?大丈夫なんですか?」と散々心配された腰の重~い(笑)わたしが、ついに!
SSL化を終えました~(´艸`*)✨
燦然と輝く「保護された通信」の文字に緑のカギマーク!
が!
超絶PC音痴の私がすんなりSSL化できたわけもなく…
多くの「???」にぶち当たりました(笑)
その中のひとつ、
【SSL化したのにURLの横にヘンな「i」マークついてる問題】
の解決法をシェアさせていただきます!
プラグイン「Search Regex」で一括置換したはずなのに…なぜ?
こんな方にこそ読んでほしい!
ちょっと待って!!諦めないで!
ソレ、自分で解決できるかも!
とりあえず読んでみて~(><!!
…ということで、わたしと同じくすべての機械音痴さん&システム系苦手女子のために!!
解決方法を図解していきますね(*´▽`*)✨
①iマーク(Mixed Content警告)表示ページを右クリックできる環境を整える
こちらはメルマガ読者さん限定ページなのですが…
このように、SSL化したはずなのにサイトURLの左側に
謎の「i」マークが…!
これは、調べてみると…
<Mixed Content警告>
「https://」と「https://」がページ内に混在した状態。
SSL化していないよりは良いけれど、Mixedcontentのまま放置するとSEO的によくないという説も。
せっかくSSL化したのに、そりゃないよ~…
ということで!
このiマーク(Mixed Content警告)表示を消しちゃいましょう!
そのためには…
まず該当ページの画面を右クリック!
え、ちょっと待って!
右クリックができないんだけど…?
こんなときは、「WP Content Copy Protection」このプラグインを一度「停止」にしましょう!
コピペ禁止のプラグインなのですが、そのために右クリックもできなくなっちゃっているんです。
私は「WP Content Copy Protection」だけでしたが…
このプラグイン以外にもコピペ禁止系のプラグインを使用している場合は、そちらも止めないと右クリックできない恐れがあります~!
「i」マークがとれたらプラグインは有効化してOKなので、削除する必要はなし!です♪
【追記】
読者さんからのご報告がありまして…
右クリックできない、下記でご説明する「検証」が出てこない!
こんなときは、プラグイン以外にも【ブラウザ】が問題になっているかも…?
「Yahoo!から自分のサイトを見てもダメで、GoogleCromeを使ったら右クリック⇒検証できた!」とのことです^^*
もし右クリックできないな…?と思ったらブラウザの変更もやってみてくださいね(*´▽`*)✨
②iマーク(Mixed Content警告)表示ページを検証&原因を特定する
では、右クリックして該当のページを検証していきましょう~♪
右クリックすると上記の図のような候補が表示されるので、
その中の「検証」をクリック!
それではいよいよ、原因の特定に参ります…(▼ω▼)!!
検証をクリックすると下記の画面が表示されるので、
上のタブから「Console」をクリック!
そして「Console」の中に表示されている、
「https://~」から始まるURLをクリック!
すると…下記のように、
原因となっている画像が表示されます!
この画像が「https://~」のまま残ってしまっているのが「i」マーク表示の原因だとわかります。
こいつ…こいつや…!
こいつが悪さしてんのや…!
…と、この手順で超カンタン♪に
「犯人」を炙り出すことができるわけです(▼ω▼)ふふふ
プラグイン「Search Regex」で「https://自分のURL」⇒「https://自分のURL」に一括置換したとしても、
ロゴ画像やヘッダー画像などの「画像URL」は「https://」で読み込んだまま残ってしまう
ようで、それがエラーになっている原因だったわけです(><!
私の場合はこのサイトは1つだけのエラーでしたが…
「Console」の中にいくつも「https://~」のURLが表示されている場合は、それらすべてを修正していく必要がありますね!
では♪ここまでで原因を特定できたので、
次からは解決法を解説していきます(´艸`*)✨
③原因となっている画像のURLを修正するための手順
私の場合、原因となっている画像は、
iマーク(Mixed Content警告)表示が出ているページのヘッダー画像
でした。
なので、ヘッダー画像を修正していきます♪
この解決法実践前に…
SSL化時に実践しているかとは思いますが、登録している画像のURLを「https://~」に変換しておく必要があります。
変換するには…
WordPressダッシュボードの「設定」>「一般設定」>「WordPressアドレス」&「サイトアドレス」を「https://~」に修正!
これで下準備OKです(´艸`*)✨
あと!ココ重要!!!
「ダッシュボード」>「外観」>「ウィジェット」の中の、記事下とか記事上とかにコードや画像を入れている場合、プラグインでは置き換えられない!!ので、個別に「http://」から「https://」へ修正が必要!!!
これがわからなくて私はずーーーっと、「なんで?なんで?」ってさまよってました…お気をつけて―!
「カスタマイズ」から「トップページ設定」の中の
ヘッダー背景画像を一度削除し、再度登録!
※ご使用のテンプレートによって手順が違う場合があります
この「再度登録」では、もう一度メディアに登録しなおす必要はなし!
既に登録してある画像をもう一度読み込むだけでOKです★
もう一度読み込むことで「https://~」から始まる画像URLが取得され、エラーが消えます♪
この際に「WordPressアドレス」&「サイトアドレス」を「https://~」に修正していないと「https://~」のまま画像URLが変わらないので、上記の「注意」でご説明しました♪
すると…
原因となっている画像URLを修正できたので、
無事、「保護された通信」と表示されましたぁぁぁ!!!
やりました~(TωT)!!
う、うれしい…!
「緑のカギマーク」がこんなに嬉しいものだとは…!
思ったよりカンタンだったーヾ(*´∀`*)ノ★
ぜんぜん自分でできちゃった!!
このほか、②の手順で特定できますが…
原因となっている画像が「ロゴ画像」、「フッター画像」などの可能性もあります!
その場合も「カスタマイズ」から落ち着いて再度、画像を読み込みましょうね★
「ウィジェット」の画像URLはプラグイン「Search Regex」で一括置換できないので、手動で画像URLに「s」を追加する必要があります!
「ウィジェット」内の画像が原因となっている場合は地道に手動で修正しましょう!(笑)
今回は…
システムや機械など、難しいことが苦手&キライで面倒くさがりなわたしにも簡単にできた解決法をシェアさせていただきました~(´艸`*)✨
わたしがもう業者に頼んじゃおうかギリギリのところ(すぐ楽しようとする。笑)で発見した、超カンタンな解決法。
謎の「i」マークでSSL化が完了せず思い悩み、夜も寝られない…
そんな方の参考になりましたら嬉しいですヾ(*´∀`*)ノ♪
改めてお伝えしますが…
常時SSL化デッドラインの7月24日は目前!!です!!
ず~っと先延ばしにしまくってきたわたしが言うのもなんですが…はやめに対応して安心しましょうね~っ!!(笑)
日々私が実践している内容や、今回のケースのような知っておくべき最新アフィリエイト情報をメルマガやLINE@で配信しています♪
ご興味がある方はぜひ♪ご登録をお願いしますっ(*´▽`*)✨
今回登場した「メルマガ読者さん限定ページ」のパスワードをGET♪
リアルタイムで確認しやすいLINE@もどうぞ♪
メルマガやLINE@で交流できますのを楽しみにしています…♪
▼ぽちっと応援♪おねがいします~★▼
いつも応援ありがとうございます♪
◆◇◆◇◆◇◆◇◆◇◆◇◆◇◆◇◆◇◆◇◆◇◆
凛のメルマガに登録すると、上記のようなアフィリエイトお役立ち情報が届きます(^^♪
無料プレゼントは「凛が144万円稼ぐまでの5か月間の報酬・行動・思考」すべてをまとめたサイト!大好評なので、お見逃しなくっ★
も、もうだめ…
自分では解決できそうにない…(TωT)
こうなったら業者にお金払ってなんとかしてもらうしか…