WordPressサイトのhttps化で発生しやすい6つのエラーと解決策

Sponsored Link


WordPressサイトのhttps化ではエラーが発生する??

どうも、Linです。ノート、発掘です。

 

WordPressのhttps 化で最も苦戦して、かつ、めんどくさいのが https 化の設定後に発生するエラーです。

エラーの解消には Web ブラウザーで開発者ツールなどを用いて、 エラー箇所を特定し、そいつらを https に対応するように修正しなければなりません。

例えばウェブブラウザの Chrome ならば

Command + option + I

で development Tool というものが立ち上がりますので、そこのConsoleを見て、どこにエラーが発生しているのか確認して修正していくことになります。

WordPress https化 手順 設定

 

ぼく自身、これまで10サイト以上 https化してきてこのエラーシューティングには苦労させられました。

サイトごとに エラーが出る場所が違っていて、 最初は苦戦して https 化なんてやらなければよかったと後悔したことがありました。

しかし、なんとか、このエラーたちを解消し続けて乗り越えることができましたので、今日はその苦しかった経験を活かし、

WordPressサイトのhttps化で発生しやすいありがちなエラーと解決策

をまとめてみました。

 

 

WordPressサイトのhttps化で発生しやすい6つのエラーと解決策

ぼくが10サイト以上https化する中で遭遇してきたエラーは次の6つ。

 

エラー1. サイトロゴ画像

ほぼすべてのサイトで見られたエラーとして、

サイトのロゴ画像のURLが http のままになっていた

ということです。

WordPressのテーマによっては大丈夫なものがありましたが、ほぼ全ての WordPress のテーマでここが引っかかりエラーが出てしまいました。

修正方法としてはテーマによっても異なりますが、

  1. カスタマイズでロゴ画像を設定し直す
  2. テーマを編集して画像のURL を https に変更

という2つ。

ロゴ画像をカスタマイズから設定した方はカスタマイズで再設定すればオッケーです。

カスタマイズ機能がついていない無料テーマを使っている方は、おそらくテーマを編集してるロゴ画像をぶっこんでいると思いますので、そのテーマを編集箇所のimgタグのsrc 属性の引用先を https に変更しましょう。

 

エラー2. ファビコンのロゴの画像

続いてはファビコンです。

サイトの 顔と呼べるこの「ファビコン」もやはり画像の URL が http のままになっていて、エラーが出てしまうケースがありました。

解決策としてはサイトロゴと大体同じ。

カスタマイズからファビコンを設定している方はカスタマイズからファビコンの再設定をすればいいです。

また、ぼくと同じように All One Favicon というプラグインを使っている方は、このプラグインの設定から画像の引用先の URL を https に変更すれば問題ありません。

 

エラー3. 著者情報の画像の URL

続いては、著者情報を設定している時に発生するかものエラーですね。

著者情報には「著者の写真」を掲載しているケースがあると思うのですが、この著者の写真も https の画像を URL に変更しなければなりません。

Simple Local Avatorというプラグインを使っている場合は、一度アバターの画像を削除し、もう一度設定する必要があります。

これはユーザーのプロフィール編集から画像を設定すればいいですね。

ぼくはこの時に元から使っていた著者情報の写真が見つからなかったために著者情報の写真の変更を余儀なくされましたので要注意笑

 

エラー4. 楽天モーションウィジェットが古かった

楽天アフィリエイトの中の広告の種類に「楽天モーションウィジェット」という便利な広告があります。

これは読者の関心に基づいて、楽天市場で販売されている商品を代わる代わる見せるという広告のこと。

3年前からずっと同じサイトに同じスクリプトをずっと貼っていましたら、これがエラーの原因に笑

どうやら、この古い楽天モーションウィジェットのスクリプトは https に対応していなかったので、エラーが出てしまったようですね。

もう一度こちらのページから楽天モーションウィジェットの新しいスクリプト取得し、貼り直してみると見事に https のエラーが解除されましたので試してみてください。

 

 

エラー5. アプリーチのアプリアイコン画像

アプリの紹介に役に立つアプリーチというツールは便利。

気軽に、そして綺麗にアプリのリンクを貼ることができるので重宝しているのですが、このアプリーチではったコードのアプリアイコンの画像でエラーが発生!

ただ、全てのアプリーチリンクかというとそうでもなく、最近貼ったリンクに関してはセーフでした。

確か最近新しいバージョンのアプリーチが出た気がするので、古いアプリーチで貼ってしまったアイコン画像だけに問題があるようです。

 

このエラーが数カ所の場合はサクッと新しいアプリーチのリンクに差し替えてしまえばいいのですが、数十、数百箇所に及ぶアプリの紹介となるとこれは骨が折れますね。

そこでおすすめしたいのが「Search Regex」というプラグインを用いて、この問題となっているアプリ画像の写真のimgタグのsrc属性の画像 URL の引用先のみ新しいものに置換してしまうという方法。

具体的にいうと、

appreach-image

というidがついているimg要素のsrc属性を「https://is2-ssl.mzstatic.com〜」というようにhttpsのURLに変更してやればオッケーです。

 

エラー6.ウィジェットの画像

また、ウィジェットに画像、画像リンクを掲載している場合もエラーが発生する時があります。

テキストウィジェットでimgタグを貼って画像掲載している場合は、src 属性のURLをhttpsに書き換えましょう。

また、 画像ウィジェット(Image Widget)を使っている場合は、画像を削除してもう一度設定し直せばオッケーです。

 

さあ、WordPress の https 化で発生するエラーを1つ1つ潰していこう!

以上が WordPress の https 化で対処したエラーの達とその解決方法でした。

冒頭ではWordPress の https 化のエラーの対処が一番厄介と書きましたが、

まぁ想像よりもぜんぜん厄介じゃないので安心してください。

エラーが出る箇所としては

  1. 画像の引用元の URL が http のままになっている
  2. アフィリエイトリンクが古い

という2つの要因に集約されますので、そんなに難しい作業ではありません。

ガンガン WordPress のサイトを https 化していきましょう!

 

それでは!

Lin

飯橋凛(Ihashi Lin)

新卒で入ったネット広告代理店を1年半で退職。
その後、副業として活動していたウェブメディア運営のフリーランスへ。
現在はプログラミングの勉強に励み、0からフリーエンジニアの道を目指す。最近はキムチをまとめ買いしている


Sponsored Link

コメントはこちらからお願いします!



もう1本読んでみる