このSEOブログはwordpressに賢威8というテンプレート(SEOに強いテンプレート)を着せて運用しています。

他サイトでも賢威8を使うことが多いので賢威8の装飾について備忘録としてまとめます。

装飾

賢威8の装飾でどんなことができるのかこのページでもいろいろ試しています。
このページでできていることは賢威8の装飾で実現可能です。

役立つサイト(HTMLエスケープツール)(h3)

下線・マーカー(h1)

下線・マーカー

文字に黄色の背景色をつけることができます。

文字にオレンジ色の背景色をつけることができます。

文字にピンク色の背景色をつけることができます。

文字に青色の背景色をつけることができます。

文字にライム色の背景色をつけることができます。

文字に灰色の背景色をつけることができます。


<p>文字に<span class="line-yellow">黄色の背景色</span>をつけることができます。</p>
<p>文字に<span class="line-orange">オレンジ色の背景色</span>をつけることができます。</p>
<p>文字に<span class="line-pink">ピンク色の背景色</span>をつけることができます。</p>
<p>文字に<span class="line-blue">青色の背景色</span>をつけることができます。</p>
<p>文字に<span class="line-lime">ライム色の背景色</span>をつけることができます。</p>
<p>文字に<span class="line-gray">灰色の背景色</span>をつけることができます。</p>

アイコン(h2)

アイコン

電話アイコン。いろいろ探したけど無かった。あるとすればこれかな?というので見つけた。
ポイント
注意
別ウインドウ
矢印上
矢印右
矢印下
矢印左
ダウンロード
PDF
ZIP
メール
ショッピングカート
虫眼鏡
ホーム
フォルダ
時計
カレンダー
ビル
マップ
NEW
初心者マーク

<span class="icon_tel red"></span> 電話アイコン。いろいろ探したけど無かった。あるとすればこれかな?というので見つけた。
<span class="icon_point red"></span> ポイント
<span class="icon_caution red"></span> 注意
<span class="icon_blank red"></span> 別ウインドウ
<span class="icon_arrow_up red"></span> 矢印上
<span class="icon_arrow_right red"></span> 矢印右
<span class="icon_arrow_down red"></span>  矢印下
<span class="icon_arrow_left red"></span> 矢印左
<span class="icon_download red"></span> ダウンロード
<span class="icon_pdf red"></span> PDF
<span class="icon_zip red"></span> ZIP
<span class="icon_mail red"></span> メール
<span class="icon_cart red"></span> ショッピングカート
<span class="icon_search red"></span> 虫眼鏡
<span class="icon_home red"></span> ホーム
<span class="icon_folder red"></span> フォルダ
<span class="icon_time red"></span> 時計
<span class="icon_calendar red"></span> カレンダー
<span class="icon_building red"></span> ビル
<span class="icon_map red"></span> マップ
<span class="icon_new red"></span> NEW
<span class="icon_beginner red"></span> 初心者マーク

チェック(h2)

下線・マーカー
  • チェックリストの項目が入ります。チェックリストの項目が入ります。
  • チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。
  • チェックリストの項目が入ります。チェックリストの項目が入ります。
  • チェックリストの項目が入ります。チェックリストの項目が入ります。
  • チェックリストの項目が入ります。チェックリストの項目が入ります。


<ul class="check-list">
	<li>チェックリストの項目が入ります。チェックリストの項目が入ります。</li>
	<li>チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。チェックリストの項目が入ります。</li>
	<li>チェックリストの項目が入ります。チェックリストの項目が入ります。</li>
	<li>チェックリストの項目が入ります。チェックリストの項目が入ります。</li>
	<li>チェックリストの項目が入ります。チェックリストの項目が入ります。</li>
</ul>

装飾BOX(h2)

青斜線の装飾ボックスです。ここにテキストが入ります。

黒色背景の装飾ボックスです。ここにテキストが入ります。

灰色背景の装飾ボックスです。ここにテキストが入ります。

黒色背景の装飾ボックスです。ここにテキストが入ります。

テキストが入ります。

テキストが入ります。

テキストが入ります。

テキストが入ります。

タイトルが入ります。

テキストが入ります。

タイトルが入ります。

テキストが入ります。