賢威6.1を使っていてずっと思っていたんだけど、
記事のカテゴリ文字数が多いからか…
新着記事アイコンに6文字しかカテゴリ名が表示されず、
ぶつ切り状態でもどかしかった。
色々調べていたけど、
該当する記事がなかなか見当たらないので、
思い切って自分でカスタマイズにトライしてみた。
よければ参考にしてみてほしい。
賢威6.1 最新記事カテゴリのアイコンサイズ変更
まず、
実践前にかならず注意しておくことを伝える。
CSSをいじる場合、思いもかけない影響が出ることがある。
下手にいじって、元に戻せなくなることも当然ありえる。
そのため、
いじるページの全文をメモ帳などにコピーしておくこと。
そうすれば、もし異常な状態になっても、
コピーしておいた全文を貼りつけ直せば元通りになる。
その部分だけは徹底して欲しい。
じゃあ早速始めてみる。
作業自体は結構簡単だからご安心を。
①
賢威のダッシュボードを開く
↓
『外観』「テーマ編集」を開く
↓
『スタイル』「design.css」を開く
design.cssはその名の通り、
ブログデザインを構築する情報がまとまったシートだね。
②
下記のソースをカスタマイズする。
------------------------------------------------------
/*最新情報のアイコン設定*/
#main-contents dl.news dd.cat{
float: center; (←初期値はleft)
overflow: hidden;
width: 12em; (←初期値は6em)
height: 1.5em;
padding: 0.1em 0.3em 0;
border-bottom: none;
background: #333;
color: #fff;
font-size: 0.555em; (←初期値は0.858em)
text-align: center;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}
------------------------------------------------------
floatはleftのままだと、
記事タイトルと隙間がなくなって詰まった印象だ。
centerにすることで綺麗な状態が作れる。
※本来floatにcenterという値はありません。
ただこの方法でうまくいったので記載しました。
widthはカテゴリ文字表示数の変更。
初期値だと6文字しか入らないが数字を増やすと、
増やした分だけ文字数を多く表示できる。
widthのみいじるとレイアウトが崩れるが、
上記のfloatをcenterに変更しておくことで、
十分な文字表示領域を確保できる。
font-sizeは文字の大きさを変更する。
ここはあなたが自分で調節してみて確認してほしい。
上記のように変更することで、
僕のトップページのような表示になる。
※このブログは現在賢威を使っておりません。
カテゴリ文字数で苦戦している人は、
参考にしてもらえると幸いです。
P.S.
ご不明点があれば遠慮なく聞いてください^^
↓ ↓ ↓
ひすいちへ問い合わせ♪