新しいテーマが追加されて、カテゴリタブが使えるようになったのですが、 元々のデフォルト新デザインにはそのようなものはありません。 そこで、以下のタグを <div class="ContentsList"> の下に入れます
<!-- ブログカテゴリ --> <div id="CategoryTab"> $categoryList </div> <!-- ブログカテゴリ -->
次に CSS の最後でいいですが、以下の CSS 記述を追加します
#CategoryTab { float: left; width: 100%; height: 40px; border: 0px solid #000; } #CategoryTab .Category { float: left; text-align: center; margin: 0 6px 0 0; overflow: hidden; white-space: nowrap; } #CategoryTab .Category a { display: block; width: 100px; height: 32px; text-decoration: none; font-size: 11px; color: #fff; padding: 8px 0 0 0; background-image:url('$user.image010'); } #CategoryTab .Category a:hover { text-decoration: underline; color: #567; font-weight: bold; background-image:url('$user.image006'); } #CategoryTab .Category #Category$categoryId { background-image:url('$user.image006'); font-weight: bold; color: #47301C; }
あとは、6番の画像を明るく塗って 10 番の画像を暗く塗ってできあがりです。 $user.image006 と $user.image010 を使っていて、中身を変えれない場合は 他の空いている所を使って、その番号を CSS に書くか、外部画像を使って、 その URL を CSS に書くかどちらかです。 関連する記事 手ブロ新デザイン : あたらしいテーマをカスタマイズしました
|
【手書きブログの最新記事】
- 手書きブログの『協賛会員』
- 既存の絵を MzEditor で参照する : 手書きブログ
- 1280の幅をめいっぱい使う : 手書きブログのデザイン
- 保存がてら、手書きブログの新デザインの内容
- 手書きブログの新デザインで、知らない間にメニューバーが設置されていたのですが、勝手に色設定してあるので見えませんでした。
- カスタムパレットツールの手動インストール
- 手ブロ新デザイン : 簡単な個別コンテンツの追加
- 手ブロ新デザイン : あたらしいテーマをカスタマイズしました(詳細部分)
- 手ブロ新デザイン : あたらしいテーマをカスタマイズしました
- 手ブロ新デザイン : シンプルテンプレート : 一覧部分
- 手ブロ新デザイン : シンプルテンプレート
- 手ブロ新デザイン : 右サイドをもう少し広く使える詳細画面のテンプレート
- 手ブロ新デザイン : 右サイドをもう少し大きく使える一覧画面のテンプレート
- 手ブロ新デザイン : 詳細部分のデフォルトテンプレート
- 手ブロ新デザイン : 一覧画面のデフォルトテンプレート
- 手ブロ新デザイン : 特定のテンプレートを使った時だけ、絵の上部にリンクを表示する
- 手ブロ新デザイン : 一般変数
- 手ブロ新デザイン : ページをナビゲートする HTML が出力される $pageMenu 変数
- 手ブロ新デザイン : 日付部分へ編集ページへのリンクを入れる
- 手ブロ新デザイン : 今すぐ、とにかく「リンク」を使いたい場合