Mother's Life

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

混在コンテンツ状態の解消法。ファビコンとSNSボタンのSSL化

      2022/03/28

Part1Part2に引き続き、混在コンテンツ状態の解消法の続きです。

※注
現在は配布されていないワードプレステーマである、”STINGER5”を利用した編集方法をご紹介しています。情報が古いですが備忘録として残しています。

(2022年2月13日 追記)

ファビコンのURLを変更

ファビコンとは、上の画像のようにブラウザのタブ部分や、ブックマークに登録したときにサイト名の前に表示される小さなアイコンのことです。初期アイコンをそのまま使っている人はこの作業は必要ありません。

参考に、STINGER5は初期状態だと上の画像にある通り、黒地に”5″の数字のアイコンが設定されています。

ワードプレスにログインし、トップページの左サイドメニューから「外観」→「テーマファイルエディター」を選択します。

編集画面の右側に、現在使っているテーマ(デザインテンプレート)を構成する様々なファイルが一覧表示されます。ファビコンの表示はheader.phpというファイルが担当しているので、こちらを開きます。

49行目にファビコンのリンクがあります。この箇所が旧URLになっていますので書き換えて保存します。

古いブラウザを使っている人用のプログラムの書き換え

ファビコンの操作をした時と同じheader.phpファイルの中の、ファビコン設定プログラムの数行うしろにある<!–[if lt IE 9]>という表記の下に「http」があるので、「http:」までを削除してスラッシュ2本を文頭にします。

「https」と記述すると、仮にリンク先がSSL非対応の場合にリンクが無効になってしまいますが、「//」の場合はリンク先がどちらでも対応できます。リンク先URLがはっきりわからない場合はスラッシュ2本にしておきましょう。

このプログラムはIE9より古いバージョンのブラウザを使っている人向けで、古いブラウザだと見出しの吹きだしなど一部のデザインがうまく表示されないため、それを防ぐためのプログラムです。

SNSボタンのリンクを変更

STINGER5に限らずほとんどのワードプレステーマにおいて、各SNSのシェアボタンが表示される機能がデフォルトで備わっていると思います。そのボタンの埋め込みリンクの一部に「http」が含まれていたので修正を行いました。

STINGER5において、SNSボタンの設置を担当するファイルはsns.phpsns-top.phpの2つです。

sns.phpファイルの中身

sns-top.phpファイルの中身

どちらもほぼ内容が同じで、素人にはどこが違うのか細かい点はよくわからないのですがそれはさておき…「http」で始まるリンクを探したところ、両ファイルとも4か所見つかりました。

STINGER5にはデフォルトでtwitter、フェイスブック、はてなブックマークのボタンが設置されているようです。このうち一番最初にプログラムが記載されているTwitterはSSL対応URLになっていますが、他2つが非対応URLになっています。

毎度のことながらリンク先がSSL対応か非対応かに関わらずアクセス可能なように、リンク先URLの文頭を「http:」までを削除し、「//(スラッシュ2本)」になるように書き換えて保存します。

ここまでの操作を終え、サイトを確認したところ…やっと緑のカギアイコンが出ました!と、喜んだのもつかの間で…

サイトの詳細をためしに確認してみたところ、このような記載が。とりあえずパッと見で表示されていないコンテンツは見当たりません。とりあえず「安全な接続」にはなったので、原因は焦らず探していこうと一旦作業は終了。完結編は次回に持ち越しです。

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