Mother's Life

1980年代初期生まれの主婦が送る、80~90年代の女子の懐かしカルチャーをご紹介するブログ。妊娠・出産・育児ネタもついでに。

混在コンテンツ解消法。コンテンツ内の画像と広告をSSL化する

      2022/02/20

前回の記事の続きになります。

サイト(ブログ)をSSL化することができても、サイト内にSSL化されていないコンテンツが含まれていると、ブラウザからの警告が表示されるというお話を前回いたしました。主な原因はサイト内の画像や広告リンクにあることが多いので、今回はこの2点についての解消方法を紹介します。

参考リンク:SSL対応でhttpとhttpsが混在したコンテンツが表示できない原因を特定する

コンテンツがSSL対応かを確認する方法

SSL化されているURLとそうでないURLの見分け方を前の記事で説明していなかったので、こちらで解説します。

URLの頭の文字が「https」か、”https”を省略した”//“のスラッシュ2本になっていればSSL対応のコンテンツです。SSL非対応の場合は「http」です。

ちなみに、外部サイトへリンクを飛ばす場合、相手方がSSL非対応であっても混在コンテンツとはみなされません。サイト内に埋め込まれて、コンテンツの一部とみなされるリンクのみが混在コンテンツの原因になります。

コンテンツ中の画像リンクURLを置き換える

私のワードプレスの記事編集画面を例としてアップします。URL変更前に書いた記事に挿入した画像のリンクURLは、すべて旧URLの”http://chocotto.pya.jp”から始まっています。これを全部”https://pya-chocotto.ssl-lolipop.jp”に書き換えます。

1つ1つ手打ちで変更するのは気が遠くなる作業ですので、ワードプレスのプラグイン(無料の追加機能)を使って一括変換します。おすすめのプラグインはSearch Regexというものです。

プラグインの入手方法は簡単で、管理画面の左側メニューから「プラグイン」を選択し、「新規追加」をクリックします。

リンク先の検索窓に「Search Regex」と入力すると該当プラグインが検索結果のトップに表示されるはずです。私の管理画面だとすでにインストール済みなのでボタンが表示されませんが、通常は「今すぐインストール」というボタンが表示されていますのでクリックします。

インストールが完了したら、「有効化」をクリックするとすぐに使えるようになります。

使い方はとても簡単なので直感で操作可能だと思いますが、一応詳しい使い方や注意点をまとめたブログがあったので、以降の手順はそちらでご確認ください。

※参考→SSL化に便利!「Search Regex」でURLの置き換えをしてみよう

広告のURLの置き換え

私はグーグルアドセンスと忍者AdMaxという2つの広告プロバイダを利用していますが、忍者AdMaxの方のリンクがSSL非対応URLだったため、忍者AdMaxからSSL対応の広告コードを改めて取得して貼り換える作業をしました。

まずはワードプレスにログインし、画面左側にあるメニュー一覧から、「外観」→「テーマファイルエディター」をクリックします。

テーマファイルエディターを開くと、現在使っているテーマ(デザインのテンプレート)を構成するファイル一覧が右側、左側に選択されているファイルの内容が表示されます。

忍者AdMaxの広告はブログのサイドバーに設置しているので、当ブログのテーマSTINGER5のファイルの中でサイドバーのデザインを担当する「sidebar.php」というファイルを選択して左側に表示させます。

<!– admax –>という2つのタグの間にあるのが広告URLです。URLが”http”で始まっており、SSL非対応URLであることがわかります。この部分を新しいコードに書き換えていきます。

忍者AdMaxのサイトにログインし、広告リンクを再度取得します。SSL化ほぼ必須の流れに伴い、有名どころの広告プロバイダーならSSL対応の広告リンクを用意しているはずです。このURLも”https”で始まっていますので、SSLに対応したリンクであることがわかります。

万が一SSL対応URLが提供されていない場合は、URLのトップを”//”(スラッシュ2本)に書き換えます。こうすると接続先がSSL対応・非対応に関係なく接続できるようになります。

広告プロバイダからコピーしてきたリンクを、以前の広告リンクに上書きする形で貼り付けて保存すれば完了です。

(※注)
広告リンクの設置箇所は、使用しているテーマや自サイトの編集状況によって異なります。テーマ側で簡単に広告を挿入・変更できるツールが用意されているのなら、テーマを直接編集するよりそちらを使った方が間違いはありません。

直接編集時は、少しでも関係ない箇所をいじってしまうとサイトが崩れるなどのトラブルが起こります。必ずバックアップを取るか、編集前のファイルをそのままコピペしてPCのメモ帳などに保管しておくなど、万が一があっても元に戻せるような対策をしてください。編集は自己責任でお願いします。

 - その他いろいろ, サイト作成