カスタムメニューウィジェットを使って、サイドバーにメニューを表示させるやり方と、そのデザインをCSSで変えていくことについて書いていますが、今日は「 実践編 その2」として、前回の「カスタムメニューウィジェットで自由度の高いメニューをつくる 実践編 その1」で紹介した、デザインサンプル2の作り方についてお話していこうと思います。
カテゴリー別アーカイブ: CSSで考えるTwenty Ten カスタマイズ
カスタムメニューウィジェットで自由度の高いメニューをつくる 実践編 その1
カスタムメニューウィジェットで自由度の高いメニューをつくる(1)でサイドバーにカテゴリーやページ、任意の場所へのリンクなどを混在させたメニューの作り方と、それがどのように出力されるのか、という事を見てみました。
今日は前回作ったメニューにどのようにCSSでデザインを当てはめていけばよいのか、実際に作りながら考えていこうと思います。ついでに、デザインをCSSで表現するために、どんな考え方をするのか、という例もご紹介。一粒で2度おいしいこの企画、楽しみながら読んでいただけたらうれしいです。
カスタムメニューウィジェットで自由度の高いメニューをつくる(1)
WordPressをCMS的に使いたいと思ったとき、メニューについて悩む事も多いのではないでしょうか。デフォルトの状態ですと、サイドバーに表示できるのは、カテゴリー一覧や、ページ一覧などで、表示の順番や、表示したいものが簡単に設定できません。見た目もどうしてもブログっぽくなってしまいますよね。
でも、カスタムメニューウィジェットを使えば、Twenty Tenのデフォルト機能だけでも、結構自由度の高いメニューを作れちゃうんですよ。
WordPressのウィジェットに当てられるクラス名を一覧にしてみた
WordPressのウィジェットの使い方で標準のウィジェットの使い方を、Twenty Ten のサイドバーのカスタマイズでウィジェットの大まかなマークアップを見てみました。
今日は、一つ一つのウィジェットに当てられるクラス名を見てみたいと思います。ウィジェットごとにデザインを変えたいな〜〜、と思うときにお役立て下さい。では、行きます!
Twenty Ten のサイドバーのカスタマイズ
Twenty TenのカスタマイズをCSSから考えていますが、前回はサイドバーに移り、まずはサイドバーで使われる事の多いウィジェットの使い方などをみてみました。
いよいよカスタマイズの話に入っていきたいと思います。この記事の前半には今までの記事でサイドバーに関係のある所もピックアップしてあります。
WordPressの小ネタって??
「WordPressのテーマTwenty Tenでは小ネタ&ギャラリー(Asides/Gallery)を特別なスタイルで表示できます。」と、WordPress.comのブログでTwenty Tenの紹介をした記事に書かれていました。
そのときはふ〜〜ん。。という感じであまり詳しく見なかったのですが、時期バージョンでは便利に使えるようになりそうな気配なので、この機会にちょっとみておこうと思います。
WordPressで特定の記事を先頭に固定する方法とTwenty Ten での表示
ちょっとしたお知らせや、ブログの読者に伝えたい事などを記事に書いても、その後に投稿されていけば、あっという間にその記事は埋もれてしまいます。特定の記事をいつもブログの先頭に固定しておける、「先頭に固定表示」のやり方と、CSSについて見ていきたいと思います。
Twenty TenのCSSにコメント入れてみた 長いから前半までね
よく思うんですが、CSSでもHTMLでも、他の人が書いたものを修正したりするのってすごく面倒。
特にCSSは、どこに何が書いてあって、どれとどれが影響し合って..と、分析しないといけないし、意味なさそうに見えた一言がブラウザ対応のおまじないだったり、自分で書く方がずっと早いんじゃないかと思ってしまったりします。
そこで!と言ってはなんですが、Twenty TenのCSSにコメント入れてみました。今までこのブログに書いたあたりまでですが。
関連すると思われる記事にリンクもしました。少しは該当する場所が探しやすくなるかな。では上から順にいきます!
使ってますか?プロフィール情報やカテゴリーの説明
WordPressを使うとき、記事を書く他にいろいろと基本の設定をしたりしますね。カテゴリーやタグを決めるときや、ユーザーのプロフィールを設定するときに「説明」という欄がありますが、これを活用してますか?
記事下のカテゴリーなどへのリンク(entry-utility)〜Twenty Ten メイン部分のCSSカスタマイズ(7)
うわ、タイトルが収集つかないくらい長くなってしまいました。もう少し先を考えてから、タイトルを付け始めるのだったと反省しています。
さて、Twenty Ten メイン部分のCSSについて順々にみてきましたが、今日は記事の下の部分に出てくる、カテゴリーやタグ、コメントなどへのリンクの部分についてみてみようと思います。地味に細かいですが、書いているうちに意外な発見が!興味のある方はおつきあいください。