【常時SSL化】一部のページだけ警告表示!原因はまさかのLINE@のQRコード

常時SSL化のトラブルの原因はLINE@のQRコード 数字解析・検証
この記事を書いた人
垣内さん

ブログ運営者です。フリーランスのデザイナー。隙間時間にネットビジネスに手を出してます。twitter(@hananakadesign)

このブログをフォローする

常時SSL化したのに一部のページだけがなぜか警告表示!解決したので情報シェアです。

 

常時SSL化が成功したのに、一部のページだけ警告表示。の原因と解決策をサクッと知る

原因…「http://」のままの画像が1つあったからでした。
解決策…imgタグの記述にsを1つ足して「http://」から「httpa://」にして保存

 

常時SSL化に迷走している人のお役に立てるかもしれないので、短いですが記事にまとめておきます。

 

垣内
垣内

依頼者様のWEBサイトを本日公開!準備しておいたからサクッと公開できるぞ〜!!!

と思ってたんですが、公開直前に一部のページで警告表示が出ていることに気がつきました。

 

サイトの環境について

WordPressで作成させていただいたのは、兵庫県姫路市のリラクゼーションサロンアンジュ様のWEBサイトでした。

レンタルサーバー エックスサーバー

独自ドメイン取得 エックスサーバー

利用CMS WordPress

 

WordPressインストール前からSSL化設定と常時SSL化設定は終えてありました。

 

 

常時SSL化させた方法

エックスサーバーの公式の説明の通りに行いました。

 

①無料独自SSL設定を済ませて、

無料独自SSL設定 | レンタルサーバー【エックスサーバー】
レンタルサーバー「エックスサーバー」のご利用マニュアル|無料・無制限に利用可能な独自SSL「無料独自SSL」の設定手順に関するご案内です。

 

②常時SSL化の設定を行った。

Webサイトの常時SSL化 | レンタルサーバー【エックスサーバー】
レンタルサーバー「エックスサーバー」のご利用マニュアル|Webサイトを常時SSL化する方法について記載しています。

 

エックスサーバーで新規サイトを常時SSL化させるのはとっても簡単です。初心者さんでも大丈夫。マニュアルに書いてあるまま操作するだけです。

(ちなみに当ブログのレンタルサーバーはMixhostです。Mixhostもマニュアルがあり、勧められていたプラグインを利用しました。こちらも簡単。)

 

 

…え?なぜ?一部のページだけ警告表示が

 

垣内
垣内

常時SSL化は完璧やでぇ〜〜

そう思っていたのに、公開直前にアドレスバーを見てふと気がつく。

 

常時SSL化が一部のページで反映されていない。原因は画像のURL

 

そして、FireFoxで表示すると警告表示。

常時SSL化で一部のページだけ警告表示Firefox

 

 

ウィジェット周りのプラグインを疑う。でも違うみたい

SSL化がうまくいっているページの共通点が「1カラムに設定した、サイドバーが無いページ」でした。

そこでまずは2カラムの時だけ表示されるもの、「サイドバー」を疑いました。

常時SSL化で苦戦。ウィジェットを疑ってみる

 

「常時SSL化 画像」とググったところ、SSL化されていない画像や内部リンクが1つでもあるとダメだと判明。

WordPressにアップロードした画像や動画のURLが「http://」のままの場合、全部https://に変更して、さらに利用している投稿や固定ページでも記載を全部変更しなきゃいけない。

 

(記事数が膨大で手作業での修正が面倒な場合は、時短技をググって探してみてください。わいひらさんの記事が分かりやすそう↓)

WordPressサイトの内部リンクSSL対応(HTTPS化)をコードコピペでちょっと楽にする方法
WordpressサイトをHTTPS化した時に必要となる内部リンクURLや、画像・iframeの手軽なSSL対応方法の紹介です。Wordpressで、the_contentをフックしてコンテンツ表示前に置換して表示させる方法です。

 

写真が原因だろうかと思いましたが、今回は新規のWEBサイト立ち上げで最初から投稿画像は全てSSL化されていたので大丈夫でした。

 

垣内
垣内

ウィジェット周りのプラグインが原因…?
テーマは他の利用者さんのサイトは大丈夫だから違うっぽい…。
写真のリンクは保護されてるって出るから大丈夫だなぁ…。

え〜〜〜〜
わっからん

 

 

 

「http://〜」の画像を表示していた事が原因だった

 

分からなかったので、ウィジェットを1つづつ消してみました。

そして原因が判明。

 

常時SSL化がうまくいかない原因はLINE@のQRコードでした

 

LINE@QRコードが原因でした。

 

SSL化されない原因ウィジェットのhttp://の画像

 

ダッシュボードからウィジェットのテキストを見たらありました。「http://〜」で始まる画像が!!

この子を修正します。

(修正といっても一瞬で終わります)

 

LINE@のQRコードのimgタグの記述に「s」を足す

SSL化されていない画像の修正方法

 

http://

↓sを1つ付け足して

https://

 

保存をクリックで修正完了。

 

 

できた!!良かった。

画像のURLを修正したらSSL化できました

問題があったページを見ると、無事にSSL化されていました!!

 

 

たかがsされどs

 

今回は「s」を1文字記入するだけで解決。

 

このたった1文字の問題を見つけるのに気がつけば1時間以上も経っていました。なんて勿体無い。

 

一部のページだけでSSL化がうまくいかない場合、投稿画像など内部のURLが「http://」になっていないか確認してみてください。

 

自分のWordPress上に投稿した画像や動画だけでなく、アフィリエイトタグを利用して表示しているバナー画像も対象なんですね。

 

しばらくの間は、SSL化代行業者がバブルになってそうですね。

サイト数に対して対応できる業者が圧倒的に足りないでしょうから、今後値段も釣り上がるかも。

 

 

この記事のコメント一覧

  1. 千代子 より:

    ランキングから訪問させて頂きました。

    「s」入れるだけだったんですね。
    ありがとうございます。勉強になりました。

  2. ごんたママ より:

    垣内さん、おはようございます!
    常時SSL化するためには、画像に「http://」が1つでもあるとできないんですね。
    勉強になります。
    いつも素敵な情報ありがとうございます。

  3. とろり より:

    とろりと申します。FC2の新着記事から来ました。
    大変勉強になりました。
    1つでもhttpがあると、こうなってしまうのですね。
    ありがとうございました。