Luxeritasでシンタックスハイライターを使用する方法と開閉できるようにカスタマイズ
Luxeritasは標準でシンタックスハイライターが実装されているので、ソースコードを簡単にハイライト表示させることができます。 長いソースコードを掲載する場合、記事がソースコードで占有されてしまうので、 初期状態では冒頭部分を表示して、閲覧者が必要に応じて開閉できるといいですね。 Luxeritasでソースコードをハイライト表示させるには Luxeritas 3.6.2 のバージョンから、ブロッ ...
【Luxeritas】Next / Prev ナビゲーションを画面左右に固定表示
Luxeritasは、投稿記事の下に前後ページへ移動するリンクを表示させることができます。これをブラウザ画面の左右に < >マークのボックスで固定表示して、マウスを重ねるとオープンしてタイトルとサムネイルが表示されるようにカスタマイズする方法の紹介です。 MSNに設置してあるあれです。現在、当ブログの左右に設定してあります(PCサイズの時のみ)。 仕様 記事下のページナビは前後の記事に ...
WordPressテーマLuxeritasを2か月使い倒した結果、最強と確信
6月にFC2ブログらかWordpressに移行して、7月から本格的にLuxeritasのカスタマイズにはまり、2か月間いろいろ使い倒した結果、現状の無料ordpressテーマの中で(いや有料も含めても)、最強のテーマだと確信しました。(あくまで個人的な感想です。) 最強の理由1 高速 2か月前、当ブログの記事 WordPressのテーマを選ぶ でいくつかのテーマの速度を Google PageSp ...
【Luxeritas】関連記事を2列表示にカスタマイズ
Luxeritasは標準で記事下に関連記事が表示されます。サムネイルとタイトル、抜粋文が1列で表示されますが、PCだと少し間延びした感じになります。そこでPCサイズでは2列表示になるようにカスタマイズしてみました。 関連記事表示設定 テーマをインストールしたままの設定だと表示されていると思いますが、もし表示されいなかったら、WordPressのダッシュボードから Luxeritas → カスタマイ ...
【Luxeritas】記事一覧ページをカスタマイズ
記事一覧ページ(トップページ、カテゴリー、アーカイブ)を、以前のブログのデザインに寄せるカスタマイズをしました。 やったこと タイル型のグリッドレイアウトで最大3列、サイドバーなしアイキャッチ画像の上部と左右の空白を取り除く アイキャッチ画像のマウスホバーでズーム効果タイルにマテリアルデザイン風に影をつける タイル型のグリッドレイアウト Luxeritas→カスタマイズ(外観)→ グリッドレイアウ ...
【Luxeritas】サイドバーにQiita風目次を設置
Qiita をご存知でしょうか。プログラム関係の検索をすると結構な確率で有用な情報が見つかります。そこに設置してある目次がめちゃ便利なんです。これを自分のブログにも設置したいとずっと思ってました。WordPressのブログへ引っ越したのを機にプログラム書いてみました。 どんなものか Luxeritasはプラグインなしに記事の冒頭に自動で目次を挿入してくれるのだが、読み進んでスクロールしたら見えなく ...
【Luxeritas】個別記事タイトルのフォントサイズを画面幅にあわせていい具合に調節するCSS
レスポンシブデザインは画面幅によってカラム数が変化したり、コンテンツ幅が変化します。本文は読みやすいサイズ固定でいいのですが、記事タイトルはコンテンツ幅によってバランスのいいサイズというのが決まってきます。コンテンツ幅に対してフォントサイズが大きすぎると改行されすぎたり、逆にフォントサイズが小さすぎると間延びした感じになっちゃいます。 Luxeritasの場合、フォントサイズの切り替えがスマホ用と ...
【Luxeritas】個別記事のアイキャッチ画像の左右の空白を取り除く
前回の記事で個別記事にアイキャッチ画像を自動表示させるカスタマイズをしましたが、このアイキャッチは記事の幅と同じなので左右に空白ができます。これを取り除いてメインカラムの幅一杯に表示させるようにしてみます。 ビフォー&アフター まずは、カスタマイズ前とカスタマイズ後をみてください。 あまり大差ないと突っ込まないでね。hatenaとしてはトレンドを取り入れたつもりなので。 マイナスマージンで打ち消す ...
【Luxeritas】個別記事にアイキャッチとキャプションをカッコよく表示させる
WordPressテーマによっては記事冒頭にアイキャッチ画像を自動で表示する機能が実装されてますが(Cocoonとか)、Luxeritasには現時点では機能は実装されてません。そこで、 記事冒頭にアイキャッチ画像を自動で表示させて、さらにそこにキャプションを重ねて表示させるようにカスタマイズしてみました。この記事の上の画像のようになります。 記事冒頭にアイキャッチ画像とキャプションを表示させる ア ...
WordPressのテーマを選ぶ
初期設定が終わったら次はテーマを選択します。WordPressのテーマは海外・国産、また、無料・有料含めて非常に多くあって迷います。haena がいろいろ調べて、迷った挙句、最終的に選択した基準などを公開します。趣味でブログの作成しようと思っている方、あるいは、FC2などの無料レンタルブログからの引越を考えている方に参考になると思います。 テーマとは FC2ブログだとテンプレートにあたるものと考え ...