ころん、セミコロン、あやネころん。
今日はWordPressのテーマ「Cocoon」内にあるブロックの「タブボックス」を学習していくよ。
この記事は
って人向きに発信してるよ。一緒に学んで行こう。
タブボックス
できる事
「ラベル」16種類と「枠の色」「背景色」「文字色」各種の基本25色+拡張色6種類から組み合わせて設定できるよ。
ブロックの説明欄には
タブボックス
タブにメッセージ内容を伝えるための文字が書かれているボックスです。
Cocoonブロックのサイドバーの説明より
とありますのでタブの内容に沿った使い方をするといいでしょう。
細かく見ていきましょう。
スタイル設定では「ラベル」として16種類があります。
左上にラベルが付き下記のように英字になります。
- チェック→CHECK
- コメント→COMMENT
- ポイント→POINT
- ティップス→TIPS
- ヒント→HINT
- ピックアップ→PICKUP
- ブックマーク→BOOKMARK
- メモ→MEMO
- ダウンロード→DOWNLOAD
- ブレイク→BREAK
- Amazon→AMAZON
- OK→OK
- NG→NG
- GOOD→GOOD
- BAD→BAD
- プロフィール→PROFILE
ラベルが英字の場合はそのままですが文字の左側にあるアイコンが各種異なっています。
それでは上から見ていきましょう♪
見出しには「ラベルの名前」ボックスの中の文字は「設定した色」を記しているよ
チェック
デフォルト設定
コメント
枠の色/オレンジ
ポイント
背景色/アンバー
ティップス
文字色/緑
ヒント
枠の色/黄色
背景色/淡い黄色
ピックアップ
背景色/キーカラー
文字色/白
ブックマーク
枠の色/赤色
文字色/ピンク
メモ
枠の色/深緑色
背景色/ライム
文字色/ディープオレンジ
ダウンロード
枠の色/青色
背景色/黄緑色
文字色/黒
ブレイク
枠の色/灰色
背景色/天色
文字色/深紫色
Amazon
枠の色/黒
背景色/灰色
文字色/白
OK
枠の色/茶色
背景色/緑色
文字色/ライム
NG
枠の色/赤色
背景色/紺色
文字色/黄色
GOOD
枠の色/ピンク
背景色/淡い赤
文字色/浅葱色
BAD
枠の色/オレンジ
背景色/淡い黄色
文字色/茶色
プロフィール
枠の色/キーカラー
背景色/淡い緑
文字色/キーカラー
全部で16種類いっぱいありましたね。お疲れ様です。
設定してて思ったことは、淡い系の色は文字色や枠の色では使いにくいって事ですかね。
薄くて読めなかったり枠が分からなかったりします。
ただし、ホームページの背景によっては問題ないと思います。
今回は「タブボックス」についてみてきました。
次回は「吹き出し」を予定してるよ。
次回の【Cocoonブロック】シリーズであいましょう。
【Cocoonブロック】シリーズは全部で13種類。
記事No12
コメント