40代こじらせ女子のワードプレスdeブログ

私生活の事とか世の中の事とか徒然に。あんまり働いていないので、副業としてネットビジネスの足跡も記録的に書いてみる・・・

      

カテゴリの親子階層をわかりやすくする方法 STINGER5



このブログを開始して
そろそろ1ヶ月。

STINGER5の使い心地も
概ね満足なんだけど、
1カ所不満な場所があったの。
それはSTINGER5のカテゴリ表示。
カテゴリの親子階層をわかりやすくする方法
カテゴリの中に親子を設置しているけど、
これでは理解しにくいでしょ?

実はワードプレスを開始する時の
テーマ選定の際に、Simplicityと
どちらにしようか迷ったー!
カテゴリの親子階層をわかりやすくする方法
これがSimplicityカテゴリの
デフォルト表示方法。
こっちのほうがキレイ!

親子階層カテゴリに、段差というか段落
(インデント)を付けるイメージです。

そんなこんなで、STINGER5のカテゴリの
親子階層をわかりやすくする方法を
調べてみました。

・・スポンサーリンク・・



STINGER5カテゴリの親子階層をきれいに表示する方法

STINGER5カテゴリの表示は
style.cssでコントロール
しています。

外観→テーマの編集→style.css
カテゴリの親子階層をわかりやすくする方法

この
ul.children{padding: 0px;}
で子カテゴリを表示しています。
カテゴリの親子階層をわかりやすくする方法
padding: 0px; は
「左右上下どこも余白がない」
という意味です。

ul.children{padding: 0px; }を
ul.children {padding-left:20px; }に変更
カテゴリの親子階層をわかりやすくする方法
padding-left:20px; は
「左側に余白20ピクセル」
という意味です。

この変更を加えて更新をして
ブログを確認してみると・・・
カテゴリの親子階層をわかりやすくする方法
カテゴリの親子階層が
キレイに段差表示されました!


情報がお役に立てば、共有いただけると嬉しいです♪

 - ワードプレステーマ

     

  関連記事

SEOのキーワード
実感SEOに強いワードプレステーマSTINGER5

ちょっとあいだブログの更新をさぼってしまいました。 けっこう気分やなところがある …

STINGER5
SEO・レスポンシブルに強いワードプレスのテーマstinger5

かつて一度ブログを立ち上げたことがあったけど、そのブログはアフィリエイトをはじめ …

           

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です