囲み枠・情報の表示

重要な部分を枠で囲んで表示させることで目立つようになり、見やすいページができ上がります。

下記の手順でタグをコピペして試してみてください。

ブログを書く画面→HTMLタグを表示→コピペ

１・文章を枠で囲む方法(お店ブログ用　記事上の表示）

メニュー＆料金/アクセス/ご予約/電話をかける

コピペ↓

電話をかけるタグ→<a href="tel:0904557****" target="_blank">電話をかける</a>

青の部分にあなたの電話番号を書いて、この電話をかけるタグを/ご予約/のつぎに、コピペしてください。

２・文章を枠で囲む方法

◆屋号・社名

住所（場所）　神奈川県横浜市○○

アクセス

営業時間　10時～17時まで

定休日　日曜日

ご予約・お問い合わせ　090-＊＊＊＊

メニュー・料金

お客様の声

ご予約・お問い合わせ

コピペ↓

<div style="BORDER-BOTTOM: rgb(255,102,153) 1px dotted; BORDER-LEFT: rgb(255,102,153) 1px dotted; PADDING-BOTTOM: 5px; MARGIN: 0px; PADDING-LEFT: 10px; PADDING-RIGHT: 10px; BACKGROUND: #fffafa; COLOR: rgb(51,51,51); FONT-SIZE: 14px; BORDER-TOP: rgb(255,102,153) 1px dotted; FONT-WEIGHT: normal; BORDER-RIGHT: rgb(255,102,153) 1px dotted; TEXT-DECORATION: none; PADDING-TOP: 5px">◆屋号・社名
住所（場所）　神奈川県横浜市○○
アクセス
営業時間　10時～17時まで
定休日　日曜日
ご予約・お問い合わせ　090-＊＊＊＊
<hr style="BORDER-BOTTOM: #ffc399 1px dashed; BORDER-LEFT: #ffc399 1px dashed; BORDER-TOP: #ffc399 1px dashed; BORDER-RIGHT: #ffc399 1px dashed" />
メニュー・料金
お客様の声
ご予約・お問い合わせ
</div>

赤のRGBカラーチャートを変更すると色が変わります。

RGBカラーチャートはこちらです。

枠内の文章にリンクを貼る場合は通常のリンクの貼り方と同じです。

今回は「囲み枠」についてお伝えしました。

テストブログ

ブログの説明を入力します。

囲み枠・情報の表示