ご冗談でしょう、チャッキーさん

チャッキーさんの旅と読書とWordPress学び備忘録

【DigiPress】Fancie NoteでAmazon JSの丸いリストアイコンを非表示・削除する方法

約 4 分

Amazon JSはWordPressでAmazonの標品を紹介する時によく使われているPluginですが、デジプレスのテンプレートを使用しているとリストアイコンが表示されてしまいます。

こんな感じで↓ ↓ ↓

Amazon JS list

チャッキー
これはちょっとかっこ悪いなぁ

さっそく修正するためGoogle先生に聞いてみました。・・・が、出て来るのはどれも古い情報ばかり!Digipressのテンプレートを使っている人のCSSをコピペしてみましたがリストは非表示になりません。

頼みの綱であるデジプレスのサポート掲示板を見てみましたが…数人の方が僕と同じ悩みを抱え質問しているものの未回答のままの放置プレイ・・・

チャッキー
こうなったら自分で解決するしかい!

ということで、リストを検証してCSSを確認してみたら割りと簡単に非表示に出来ましたので僕と同じ理由で悩んでいる人、自分への備忘録としてAmazonJSのリストを消す方法を記述しておきます。

Amazon JSのリストアイコンを非表示にするCSS

Amazon JSのリストアイコンを消すには、ダッシュボードメニューから「DigiPress」→「ビジュアル設定」の一番下にある「オリジナルスタイルシート設定」OR 子テーマを作成の方は子テーマのCSSに以下を追記してください。

きちんと適応されるとリストアイコンが消えているはずです。

Amazon JS list
Before

arrow

digipress AmazonJS
After

もしも上記のCSSを追記しても内容が適用されない場合はブラウザーキャッシュが残っている可能性があります。キャッシュをクリアするかシークレット・ウインドウで表示してみてください。またエックスサーバーを利用の方は「mod_pagespeed」を停止すると上手く行く可能性が高いです。

気をつけるポイント

Table of Contents Plusのリストを非表示にする

デジプレスのテンプレートをお使いの方で「AmazonJS」と同じくらいよく使われている「Table of Contents Plus」もリスト表記が邪魔だと思う方もいらっしゃるかもしれません。ついでにリストマークを非表示にするCSSを記述しておきます。

↑これでリストが消えてるはず

本文記事中の全てのリストアイコンを非表示にする方法

色々書いてきましたが、わずらわしいからリストアイコンを全て非表示にしたいという方もいらっしゃるかと思います。その方はコチラを追記ください。

ということで本日はココまで

チャッキー
本日も最後までお付き合い頂きましてありがとうございました

ブログランキングに参加してます。

にほんブログ村 ブログブログへ

クリックすると現在の順位が表示されます。

About The Author

チャッキーさん
ご訪問ありがとうございます。管理人のチャッキーと申します。
日本語を学ぶ為にブログを始めました。内容は主に旅と読書とWordPressという全く自分の知らない世界についてです。現在、南米をぷらぷら散歩中。時々、出稼ぎのため広島県にいます。

オススメ記事