今回は、WordPressを使って記事を執筆する方が必ず利用しているQuickTagを紹介します。
QuickTagを利用すると、HTMLのタグを1クリックで追加することができるようになります。
QuickTagを使いこなしている人と、使いこなせていない人では記事の執筆にかかる工数が大きく変わってきます。
今回の記事でQuickTagの基礎を学び、記事執筆の工数を短くしていきましょう。
- QuickTagの使い方
プログラミング学習でこのような経験はありませんか?
- 目標に向けて何を学べば良いかわからない
- 調べても解決策が見つからない
- 現場レベルのスキルが身につくのか不安
これらの悩みは、学習環境を整えることで全て解決することができます。
ZeroPlus Gateでは、30日間無料で最適な学習環境を提供しています。
- なんでも相談できる専属メンター
- いつでも技術相談ができるプロ講師
- 元IT企業CTO監修のカリキュラム
条件なしでこのレベルの環境を無料で提供しているのはZeroPlus Gateだけです。
ただし、無料サービスの提供には参加者の数に制限があります。
少しでも興味がある方は、以下のリンクからサービスの詳細をご覧ください。
QuickTagとは
QuickTagとはビジュアルエディタとテキストエディタで使用することができる機能です。
ボタン一つでHTMLのタグを出力することができます。
ビジュアルエディタのQuickTag
テキストエディタのQuickTag
標準で設定されているQuickTag
プラグインやfunctions.phpを修正することにより、QuickTagにタグを追加したり削除することも可能です。
今回は、デフォルトで設定されているQuickTagを紹介していきます。
b
出力されるタグ: <strong></strong>
表示: 太字になります。
i
出力されるタグ: <em></em>
表示: 強勢する(アクセントを付ける)
link
出力されるタグ:<a href=""></a>
表示: リンクが設定できます。こちらはZseroPlusMediaへのリンクです。
b-quote
出力されるタグ:<blockquote></blockquote>
表示:
引用文を挿入します。
del
出力されるタグ:<del datetime="削除時間"></del>
表示:削除された部分に使用します。
ins
出力されるタグ:<ins datetime="追加時間"></ins>
表示:追加した要素であることを意味します。
img
出力されるタグ:<img src="">
表示:画像が出力されます。
ul
出力されるタグ:<ul></ul>
表示:順序のない箇条書きであることを意味します。
ol
出力されるタグ:<ol></ol>
表示:順序のある箇条書きであることを意味します。
li
出力されるタグ:<li></li>
表示:リストを出力します。
code
出力されるタグ:<code></code>
表示:プログラムのソースコードを出力します。
more
出力されるタグ:<!--more-->
表示:WordPressに設定されている続きを読む機能を埋め込みます。
HTML5になってからの変更点
上記に解説したタグでHTML5になってからの変更点をご紹介します。
<em>タグ
<em>タグは、強意(意味を強める)を表す要素でした。また斜体を表す際に使用さることが多くありました。 HTML5では強勢する(アクセントを付ける)箇所を表す要素となり、これまでとは意味が変更されています。
<del>タグ
<del>タグはHTML5になってから仕様が多少変わり、<del></del>の間に<p> タグを挿入しても良くなりました。
<ins>タグ
<ins>タグは<del>タグ同様、<ins></ins>の間に<p> タグを挿入しても良くなりました。
これらの変更点はHTML5になってからブロックレベル要素の概念がなくなったことが理由と考えられます。
ただし、以下のように、段落などの境界を跨いで<ins>を使うことは非推奨となっています。
<!-- 以下のマークアップは非推奨です -->
<ins datetime="">
</p>段落1<p>
段落2
</ins>
<!-- 以下のマークアップが推奨されています -->
<ins datetime="">
</p>段落1<p>
</ins>
<ins datetime="">
段落2
</ins>
以上でQuickTagの紹介を終了します。
今回はデフォルトで設定されているQuickTagを紹介しました。
実際はこれら以外のタグも記事の中でたくさん使用しています。
こちらの記事ではオリジナルのQuickTagを設定する方法を紹介しています。
また、使用しないQuickTagを非表示にする方法なども紹介しているので、1クリックで普段使用しているタグを出力したいと思っている方はぜひ参考にしてみてください。
プログラミング学習でこのような経験はありませんか?
- 目標に向けて何を学べば良いかわからない
- 調べても解決策が見つからない
- 現場レベルのスキルが身につくのか不安
これらの悩みは、学習環境を整えることで全て解決することができます。
ZeroPlus Gateでは、30日間無料で最適な学習環境を提供しています。
- なんでも相談できる専属メンター
- いつでも技術相談ができるプロ講師
- 元IT企業CTO監修のカリキュラム
条件なしでこのレベルの環境を無料で提供しているのはZeroPlus Gateだけです。
ただし、無料サービスの提供には参加者の数に制限があります。
少しでも興味がある方は、以下のリンクからサービスの詳細をご覧ください。