WordPressテーマ「CUBEY (tcd023)」
 

【賢威6.0/6.1】テンプレート装飾タグ一覧と使い方

賢威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タグを使う場合は、1段落全部に装飾をする場合です。

例文:賢威はとてもわかりやすいWordPressテンプレートだなぁ!

上記例文の1段落全てを青文字に変更する場合は、以下のように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アイコン

管理人マナ画像右

 

私がAdd Quick Tagに登録している賢威のタグは、太文字と赤文字・太赤字、黄色蛍光アーカーのspanです。他には見出しタグと、自分で組んだボックススタイルや吹き出しタグくらいです。

装飾を沢山しすぎても文章としては見にくくなってしまうので、使い過ぎに注意すると良いと思います。


Pocket

WordPressテーマ「CUBEY (tcd023)」 
 

Sponsored Link

WordPressテーマ「BlogPress (TCD010)」

コメントを残す

このページの先頭へ