コメントを一定時間編集可能にするプラグイン Simple Comment Editing
ブログでコメントを投稿した後、誤字や間違いに気づくということはよくありますよね。それを修正したり、コメント自体を削除したりしたいですね。前のFC2ブログでは投稿後も編集や削除出来たので、WordPressでもできるものと思っていました。実際、できていたので。しかし、それは管理者としてログインしていたからということに最近気づきました。 一般ユーザーとしてコメント投稿すると後から編集も削除もできないん ...
Luxeritasでシンタックスハイライターを使用する方法と開閉できるようにカスタマイズ
Luxeritasは標準でシンタックスハイライターが実装されているので、ソースコードを簡単にハイライト表示させることができます。 長いソースコードを掲載する場合、記事がソースコードで占有されてしまうので、 初期状態では冒頭部分を表示して、閲覧者が必要に応じて開閉できるといいですね。 Luxeritasでソースコードをハイライト表示させるには Luxeritas 3.6.2 のバージョンから、ブロッ ...
jQueryで文章をグラデーションで隠してアニメーションで開閉するボックスを作った
長い文章の冒頭部分をグラデーション表示させておいてボタンをクリックすると開き、またボタンをクリックすると閉じるというものです。開閉動作はアニメーションにしました。 概要 本文中にユーザーが必要に応じて開閉できるボックスを設置したくて作成してみました。例えば、長い補足説明とか解説、ソースコードなどを対象にするといいでしょう。 CSSだけで実現する方法もありますが、HTMLが複雑になる(input要素 ...
【Luxeritas】Next / Prev ナビゲーションを画面左右に固定表示
Luxeritasは、投稿記事の下に前後ページへ移動するリンクを表示させることができます。これをブラウザ画面の左右に < >マークのボックスで固定表示して、マウスを重ねるとオープンしてタイトルとサムネイルが表示されるようにカスタマイズする方法の紹介です。 MSNに設置してあるあれです。現在、当ブログの左右に設定してあります(PCサイズの時のみ)。 仕様 記事下のページナビは前後の記事に ...
WordPressの記事を書く時のマークダウン記法対応のお勧めエディター
WordPressの記事の原稿を書く時に、外部エディターでマークダウン記法で書くといいと前回の記事の最後に書きましたが、その場合、どのエディターがいいのでしょうか。それは、ずばり、Typora です。 実はちょっと前まではプログラミング用エディターの Visual Studio Codeを使っていました。Typora の存在は知っていてこの記事を書くためにTypora も比較用に使ってみました。そ ...
Gutenbergでマークダウン記法を使って執筆速度をアップしよう
マークダウン記法を使うと、HTMLを簡単に高速入力できます。teratailや Qiitaなどのサイトで使えるので、hatenaもよく使います。 このマークダウンにWordPressのブロックエディターGutenbergが対応していたことをつい最近知りました。 ただし、完全に対応しているようではないので、Gutenbergでどのマークダウン記法が使えるのか、どのように使えばいいのかについて調べてみ ...
WordPressテーマLuxeritasを2か月使い倒した結果、最強と確信
6月にFC2ブログらかWordpressに移行して、7月から本格的にLuxeritasのカスタマイズにはまり、2か月間いろいろ使い倒した結果、現状の無料ordpressテーマの中で（いや有料も含めても）、最強のテーマだと確信しました。（あくまで個人的な感想です。） 最強の理由1 高速 2か月前、当ブログの記事 WordPressのテーマを選ぶ でいくつかのテーマの速度を Google PageSp ...
【Luxeritas】関連記事を2列表示にカスタマイズ
Luxeritasは標準で記事下に関連記事が表示されます。サムネイルとタイトル、抜粋文が1列で表示されますが、PCだと少し間延びした感じになります。そこでPCサイズでは2列表示になるようにカスタマイズしてみました。 関連記事表示設定 テーマをインストールしたままの設定だと表示されていると思いますが、もし表示されいなかったら、WordPressのダッシュボードから Luxeritas → カスタマイ ...
CSSで蛍光マーカーいろいろ、クレヨン風など
テキストに蛍光マーカー風の下線を付ける方法はあちこちで紹介されています。また、WordPressのテーマには最初から実装されているものもあります。当ブログで使用しているLuxeritasにも実装されているのですがちょっと配色等がちょっと好みと違うということで、クレヨン風なのものなどいろいろ作成してみました。 よくある蛍光マーカー 蛍光ペンとかマーカーで検索すると背景色にCSSグラデーションを使った ...
CSSで見出しに連番を付ける－Luxeritasに適用
Luxeritasのカスタマイズにはまっているhatenaです。今回は見出し(h要素)をカスタマイズでどうせなら連番を付けようといろいろ調べました。 シンプルなHTMLで見出しに連番を付加する方法を紹介し、さらに当ブログのLuxeritasに実装したものも紹介します。 シンプルなHTMLへの実装例 CSSカウンターを使います。詳細は下記のページに解説してあります。 CSS カウンターの使用 - 開 ...
CSSグラデーションで抜粋を徐々に消えるように表示
ブログの記事一覧でタイトルと抜粋文を表示することはよくあります。抜粋文が長いときは文字数制限して「 ... 」を付加するなどということをします。それを徐々に消えるような表示にするTipsの紹介です。シンプルなHTMLに適用するサンプルコードと、当ブログで使っているWordPressテーマのLuxeritasの記事一覧に適用する場合のサンプルコードも紹介します。 シンプルなHTMLに適用するサンプル ...
【Luxeritas】記事一覧ページをカスタマイズ
記事一覧ページ（トップページ、カテゴリー、アーカイブ）を、以前のブログのデザインに寄せるカスタマイズをしました。 やったこと タイル型のグリッドレイアウトで最大3列、サイドバーなしアイキャッチ画像の上部と左右の空白を取り除く アイキャッチ画像のマウスホバーでズーム効果タイルにマテリアルデザイン風に影をつける タイル型のグリッドレイアウト Luxeritas→カスタマイズ（外観）→ グリッドレイアウ ...