デジモノ大好き+

デジタルグッズ自腹レポ・Wordpress関連。+ バツ1おっさんのライフハック。

AmazonJSの画像が表示されないときの回復方法 [WordPress]

投稿日:2018年8月2日 更新日:

AmazonJSはAmazonアソシエイトのリンクを張るときに投稿画面から商品検索ができ、しかもショートコードで貼り付けてくれて、さらに格好良く表示してくれるプラグインなので、ちょーおススメなプラグインではあるのですが、昨今常時SSLが進み古いテーマを使っていると画像読み込みのローディングがずっと続いて表示されないケースがあります。

こんな感じ。

ドッグラン・ドッグカフェ情報( https://www.dogrun-dogcafe.com/ )でAmazonJSを使っていたんですが、この症状にハマりました。

実装しているテーマは、stinger5ver20150505b。
AmazonJSのバージョンは、0.8。

前から表示が安定していなかったんですが、常時SSLにしてから症状が悪化。
試行錯誤したので、対処方法まとめておきます。

amazonjs.php内のhttpをhttpsに変更


左メニュー > プラグイン > プラグイン編集


右上メニュー > amazonjs > amazonjs.php

AmazonJSの記述はamazonの常時SSL化に対応していないので、amazonjs.phpの95行目と96行目のhttpをhttpsに変更。

こんな感じ。

W3 total cacheをインストールしている場合はAmazonJSを対象外に設定

W3 total cacheがAmazonJSを圧縮すると影響しているらしいので、対象外に設定。


左メニュー > Performance > Minify

Never minify the following JS files に

wp-content/plugins/amazonjs/js/amazonjs.js

を追加。

Never minify the following CSS files に

wp-content/plugins/amazonjs/js/amazonjs.css

を追加。

こんな感じ。

functions.phpにあるjqueryの記述を変更

上記2パターンでも改善できない場合は、ここ。


左メニュー > 外観 > テーマの編集


右メニュー > テーマのための関数(functions.php)

6行目にあるhttp: を https:に変更

wp_enqueue_script( 'jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js',array(), false, false);

こんな感じ。

まとめ

AmazonJSのアップデートが2年前に止まっているので、SSLに対応してなかったことと、テーマ自体が古くこちらもSSLに対応していなかったことが原因でした。
特にドッグラン・ドッグカフェ情報の場合は、jqueryの呼び出しが原因だったように思います。

これで回復できない場合は、ほかのプラグインが原因の可能性もあるので、AmazonJS以外のプラグインを全部オフってひとつづつ有効化して原因のプラグインを洗い出すなどお試しください。

テーマをいじる場合は、必ずバックアップをとり、自己責任で作業してください。
また、子テーマで作業するのが望ましいです。

スポンサーリンク

-WordPress
-, , , , ,

関連記事

no image

STINGER8の幅を広げてみた。 [WordPress]

記事下広告のAdsenceをダブルレクタングルにしたかったので気持ち幅を広げてみました。 ただ単に広げればいいってもんでもないので、世間一般的なモニター解像度から目標となる幅を決めてみました。 国内に …

no image

Stinger8の記事タイトルをさりげなく装飾してみた。 [WordPress]

デフォルトもシンプルで文字のサイズも大きく見やすいのでいいんですが、せっかくなんで少し手を入れてみました。 こんな感じにしてみました。 デフォルトはこんな感じですよね。 変更した内容は センタリング …

Stinger8サムネイル画像を大きくして、スマホのレイアウト調整してみた。 [WordPress]

Stinger8のサムネイル画像のサイズは、100×100pxと小さくアイキャッチとしてはちょっと弱いので少し大きくしてみました。 そのままだとスマホのレイアウトが崩れてしまうのでそちらも調整。 今回 …

no image

Stinger8のタイトルとキャッチフレーズをセンタリングしてみた。 [WordPress]

Stinger8のタイトルとキャッチフレーズはデフォルトだと左寄せになります。 style.cssに追記するだけ style.css に以下を追記。 #header-l { text-align: c …

Stinger8のページトップボタンを目立たせてみた。 [WordPress]

主張が強すぎるのもなんですが、あまりにも目立ってないので手を加えてみました。 ↑右端にあるこれね。 (わかりずらいので、囲ってみました。) style.cssを変更 差分はこんな感じです。 #page …