【賢威6.0/6.1】テンプレート装飾タグ一覧と使い方
賢威6.0/6.1テンプレートの装飾タグの一覧リストです。
テキストエリアにコピー＆ペーストするだけで使用できますが、よく使う装飾タグはWordPressプラグイン「Add Quick Tag」に登録しておく方が楽です。
→AddQuickTagで繰り返し使うタグを設定しておくと効率が良く便利
なお、賢威4.0や5.0で使えていたものが、賢威6.0/6.1だと使えないものもありますので注意しましょう。
装飾タグの＜p＞タグと＜span＞タグを使い分ける必要があります
文字装飾を行う場合、pタグとspanタグを使い分ける必要があります。
pタグの場合
pタグを使う場合は、１段落全部に装飾をする場合です。
例文：賢威はとてもわかりやすいWordPressテンプレートだなぁ！
上記例文の１段落全てを青文字に変更する場合は、以下のようにpタグを使います。
<p class="blue">賢威はとてもわかりやすいWordPressテンプレートだなぁ！</p>
↓
賢威はとてもわかりやすいWordPressテンプレートだなぁ！
spanタグの場合
では1段落全部ではなく、段落中の一部分だけに装飾をしたい場合。この時にspanタグを使います。
賢威はとてもわかりやすいWordPress<span class="blue">テンプレート</span>だなぁ！
↓
賢威はとてもわかりやすいWordPressテンプレートだなぁ！
文字装飾をするときはこのようにpタグとspanタグの使い分けを行いましょう。
装飾タグの複数使用も可能
例えば、赤字＋太字＋特大文字にしたい場合があったとします。このような時は、装飾タグを複数使うことで可能です。
<p class="red b big2">賢威6.1WordPressテンプレート</p>
↓
賢威6.1WordPressテンプレート
pかspanで指定して、使いたいタグを半角スペース空けて並べるだけでOKです。
では以下、賢威6.0/6.1で使用出来る装飾リスト一覧です。
装飾タグ一覧
| 賢威6.0/6.1 文字の色を変更する | |
|---|---|
| <p class="red">○○○</p> | 文字色赤 |
| <p class="blue">○○○</p> | 文字色青 |
| <p class="green">○○○</p> | 文字色緑 |
| <p class="yellow">○○○</p> | 文字色黄 |
| <p class="navy">○○○</p> | 文字色紺 |
| <p class="orange">○○○</p> | 文字色橙 |
| <p class="pink">○○○</p> | 文字色ピンク |
| <p class="purple">○○○</p> | 文字色紫 |
| <p class="olive">○○○</p> | 文字色黄土色 |
| <p class="lime">○○○</p> | 文字色黄緑 |
| <p class="aqua">○○○</p> | 文字色水色 |
| <p class="black">○○○</p> | 文字色黒 |
| <p class="gray">○○○</p> | 文字色灰 |
| <p class="white">○○○</p> | 文字色白 |
| 賢威6.0/6.1文字に蛍光色の背景を指定する | |
| <p class="box-yellow">○○○</p> | ハイライト黄色 |
| <p class="box-aqua">○○○</p> | ハイライト水色 |
| <p class="box-gray">○○○</p> | ハイライト灰色 |
| <p class="box-red">○○○</p> | ハイライト赤色 |
| 賢威6.0/6.1文字の大きさを変更する | |
| <p class="small">○○○</p> | 小サイズ |
| <p class="big">○○○</p> | 大サイズ |
| <p class="big2">○○○</p> | 特大サイズ |
| <p class="b">○○○</p> | 文字の太字 |
| <p class="underline">○○○</p> | 文字の下線 |
| <p class="del">○○○</p> | 文字の取り消し線 |
| 文字の位置を変更する | |
| <p class="al-c">○○○</p> | 文字中央寄せ |
| <p class="al-r">○○○</p> | 文字右寄せ |
| <p class="al-l">○○○</p> | 文字左寄せ |
| 賢威6.0/6.1 連続改行の設定 | |
| <p class=（〇には数字） | 連続改行タグ |
| 賢威6.0/6.1文字にアイコンを指定する | |
| <p class="caution1">○○○</p> | 白チェックアイコン |
| <p class="caution2">○○○<p/> | 赤チェックアイコン |
| <p class="caution3">○○○<p/> | 白ポイントアイコン |
| <p class="caution4">○○○<p/> | 赤ポイントアイコン |
| <p class="caution5">○○○<p/> | チェックアイコン |
| <p class="caution6">○○○<p/> | ポイントアイコン |
| <p class="caution7">○○○<p/> | 白注意アイコン |
| <p class="caution8">○○○<p/> | 赤注意アイコン |
| <p class="wakaba">○○○<p/> | 初心者アイコン画像 |
| <p class="mail">○○○<p/> | メールアイコン |
| <p class="pdf">○○○<p/> | PDFアイコン |
| <p class="zip">○○○<p/> | ZIPアイコン |
| <p class="rss">○○○<p/> | RSSアイコン |
| <p class="rss-mini">○○○<p/> | 小さいRSSアイコン |
| <p class="mail-back">○○○<p/> | 後ろにメールアイコン |
| <p class="pdf-back">○○○<p/> | 後ろにPDFアイコン |
| <p class="zip-back">○○○<p/> | 後ろにZIPアイコン |
| <p class="rss-back">○○○<p/> | 後ろにRSSアイコン |
装飾を沢山しすぎても文章としては見にくくなってしまうので、使い過ぎに注意すると良いと思います。
タグ：AddQuickTag, pタグ, spanタグ, 装飾
