LuxeritasLuxeritasは標準でシンタックスハイライターが実装されているので、ソースコードを簡単にハイライト表示させることができます。初期状態では冒頭部分を表示して、閲覧者が必要に応じて開閉できるといいですね。WordPress長い文章の冒頭部分をグラデーション表示させておいてボタンをクリックすると開き、またボタンをクリックすると閉じるというものです。開閉動作はアニメーションにしました。本文中にユーザーが必要に応じて開閉できるボックスを設置したくて作成してみました。長い補足説明とか解説、ソースコードなどを対象にするといいでしょう。LuxeritasLuxeritasは、投稿記事の下に前後ページへ移動するリンクを表示させることができます。>マークのボックスで固定表示して、マウスを重ねるとオープンしてタイトルとサムネイルが表示されるようにカスタマイズする方法の紹介です。MSNに設置してあるあれです。現在、当ブログの左右に設定してあります(PCサイズの時のみ)。LuxeritasLuxeritasは標準で記事下に関連記事が表示されます。サムネイルとタイトル、抜粋文が1列で表示されますが、PCだと少し間延びした感じになります。そこでPCサイズでは2列表示になるようにカスタマイズしてみました。WordPressテキストに蛍光マーカー風の下線を付ける方法はあちこちで紹介されています。WordPressのテーマには最初から実装されているものもあります。当ブログで使用しているLuxeritasにも実装されているのですがちょっと配色等がちょっと好みと違うということで、クレヨン風なのものなどいろいろ作成してみました。WordPressLuxeritasのカスタマイズにはまっているhatenaです。今回は見出し(h要素)をカスタマイズでどうせなら連番を付けようといろいろ調べました。シンプルなHTMLで見出しに連番を付加する方法を紹介し、さらに当ブログのLuxeritasに実装したものも紹介します。CSSカウンターを使います。詳細は下記のページに解説してあります。WordPressブログの記事一覧でタイトルと抜粋文を表示することはよくあります。」を付加するなどということをします。それを徐々に消えるような表示にするTipsの紹介です。シンプルなHTMLに適用するサンプルコードと、当ブログで使っているWordPressテーマのLuxeritasの記事一覧に適用する場合のサンプルコードも紹介します。Luxeritas記事一覧ページ(トップページ、カテゴリー、アーカイブ)を、以前のブログのデザインに寄せるカスタマイズをしました。プログラム関係の検索をすると結構な確率で有用な情報が見つかります。そこに設置してある目次がめちゃ便利なんです。これを自分のブログにも設置したいとずっと思ってました。WordPressのブログへ引っ越したのを機にプログラム書いてみました。Luxeritasレスポンシブデザインは画面幅によってカラム数が変化したり、コンテンツ幅が変化します。本文は読みやすいサイズ固定でいいのですが、記事タイトルはコンテンツ幅によってバランスのいいサイズというのが決まってきます。コンテンツ幅に対してフォントサイズが大きすぎると改行されすぎたり、逆にフォントサイズが小さすぎると間延びした感じになっちゃいます。Luxeritas前回の記事で個別記事にアイキャッチ画像を自動表示させるカスタマイズをしましたが、このアイキャッチは記事の幅と同じなので左右に空白ができます。これを取り除いてメインカラムの幅一杯に表示させるようにしてみます。カスタマイズ前とカスタマイズ後をみてください。大差ないと突っ込まないでね。hatenaとしてはトレンドを取り入れたつもりなので。LuxeritasWordPressテーマによっては記事冒頭にアイキャッチ画像を自動で表示する機能が実装されてますが(Cocoonとか)、Luxeritasには現時点では機能は実装されてません。記事冒頭にアイキャッチ画像を自動で表示させて、さらにそこにキャプションを重ねて表示させるようにカスタマイズしてみました。この記事の上の画像のようになります。