HTMLコードの入力を短縮!ルクセリタス【定型文】の登録と使いかた|WordPress
WordPressテーマ、ルクセリタスに パターン登録(旧 定型文登録)というのがあります。
よく使用する HTMLコードなどの定型文を事前に登録しておくといったもので
投稿編集画面で 必要な時に簡単に呼び出せるという便利な機能になります。
登録しておくことで文字の打ち間違いもなく 記事作成の時間短縮にもなるので
ぜひとも この機能を有効に使いこなしたいところです。
バージョンアップされたルクセリタスのパターン登録には
ブロックパターン・HTML定型文・ショートコードとありますが
今回はHTML定型文の使いかたについてまとめていきます。
Luxeritas 定型文登録機能とは
パターン登録、HTML定型文の登録は 記事内でよく使用する文章や
CSSで作成した記事の装飾のためのHTMLコードを事前に登録しておき、
記事作成の際に 呼び出すことができる機能です。
こちらは WordPress テーマ Luxeritas(ルクセリタス)での投稿編集エディタ画面です。
このエディタに 定型文 というボタンがあります。
事前に登録してある定型文をここから呼び出します。
例えで 囲み枠を呼び出すためのコードを使用してみました。
登録した定型文がテキスト画面では通常のHTMLコードで表示されています。
本来なら CSSで作成した囲み枠を呼び出すには このように HTMLコードを 毎回 記述しなくてはなりません。
この呼び出すためのコードは <span> や <class> などを使うのですが、慣れていないと覚えるもの大変ですよね?
毎回書き込むのは面倒だし、1か所でも間違えると表示されないということです。
そんなミスを回避するためにも 定型文登録 はとってもありがたい機能なのです!
CSS作成と HTMLコード
イメージは このような感じで 外観カスタマイズなどの CSSを編集する画面で
スタイルを作成したものを 投稿画面で呼び出します。
投稿画面から かんたんに装飾の指定ができるものがありますので このボタンにないコードを作成します。
囲み枠などの作成がまだの方は こちらの記事を参考頂ければと思います。
HTML定型文登録を作成する
記事内で使用する HTMLコードを 定型文登録していきます。
ダッシュボード画面の Luxeritas から パターン登録 (旧 定型文登録から名称変更)を開きます。
パターン登録 HTML定形文リストの 新規追加 から登録していきます。
作成した定型文を編集したい場合は、編集から画面を開くことができます。
ラベルの設定
一度作成したラベル名は 変更出来ません!
変更したい場合は 削除して再作成する形で変更してください。
囲み型での 定型文登録
今回のような 囲み枠や 文字のカスタマイズ・アンダーラインなどは
指定した文字の前後にコードを書き込む 囲み型で登録すると簡単に変換できます。
ビジュアルエディタ画面でマウスを左クリックした状態でスライドさせ 囲みたい文章をマークします。
< > 本文 </ > の HTMLコードの間に文章が入り その文字を装飾してくれます。
先ほどの HTMLのコードを記述します。
囲み型 にチェックを入れ 上段のボックスに初めのコード < div~ >下段のボックスに </div> とだけ記述します。
これで囲み型のコード登録完了です。
上段のコードが <span ~>だった場合、下段は </span> というように
上段で使用している要素と同じ要素にスラッシュが付いたものを書き込んでください。
定型文登録ができない !?
何度 登録しても、コードが消えてしまう!? というケースがあります。
実は、ラベルに設定する文字に ハイフン(ー)などを使用できない文字・記号があるようです。
登録できない時は 使用する文字を変更して もう一度作成してみてください。
エディタ画面から 定形文登録の使い方
最後にもう一度 投稿画面からの定型文の使いかたをおさらいしておきます。
エディタ画面のツールバーから 定形文登録 のボタンをクリックすると 登録したコードのラベル名の一覧が表示されます。
① 囲みたい文字(文章)を指定します。
② 定形文ボタンをクリックし
③ 一覧から使用したい定型文を選びます。
④ 今回は 基本枠1 ですのでこちらをクリックします。
⑤ これで文章に囲み枠を付けることが出来ました。