The THORで、AmazonJSのリスト表示が崩れる件、すごく気になっていたのですが、ようやく解決しました。ちょっとだけ、ご満悦。

AmazonJSが余計なところで、リストを表示して、見栄えの悪いアフィリエイトになっちゃうので、嫌だったのですが、原因不明で直しようがないので、我慢していました。まあ、一応、表示されているし、ということで。

が、Google先生に聞いたら、素敵なサイトを発見しました。

関連記事

読み込み中... 読み込み中...

Amazon JSはWordPressでAmazonの商品を紹介する際によく使われるプラグインですが、弊社テーマ（アルバトロス、ハミングバード、ストーク）と組み合わせると、リストアイコンが表示されてしまうなどのCSSの問題が発生します。

今回はそのリストアイコンを非表示にする方法をご紹介。

AmazonJSのアイコン部分を消すには、下記CSSを子テーマのstyle.cssや【外観 > カスタマイズ > 追加CSS】などに追記していただくことで変更可能です。

/* AmazonJSのアイコンを消す */
.entry-content .amazonjs_item li:before,
.entry-content .amazonjs_item a[target=”_blank”]:after{
content:none;
}

早速、やってみましたが、動きません。

うまくいかない場合は、キャッシュを消せというので、消してみました。AmazonJSも、ブラウザも。

・・・うんとも、すんとも言いません。今までと同じ。

プラグインの設定をON/OFFを繰り返して、2のn乗ぐらい試したがダメです。

で、以前にXOOPSか何かで、CSSも階層化していて、「.entry-content」って、何となく「.content」のサブセットだったようなことを思い出しました。「.entry-content」⊂「.content」という関係になっているなら、「.content」に書いたほうが、効く範囲が広そう、それに、THE THORは「.content」かもしれないし。

ということで、

.content .amazonjs_item li:before,
.content .amazonjs_item a[target=”_blank”]:after{
content:none;
}

と書いたら、なんと、動きました。

ねっ。

• Facebook
• Twitter
• Pinterest
• LinkedIn