好き♡を仕事にして私らしく輝く！
自宅教室・サロン講師・ハンドメイド販売
はじめてのママ起業を
おしゃれに可愛くプロデュース♡
アメブロカスタマイズ・想いを伝えるSNS
お稽古サロン「JouJouette」主宰
豊田 純子
はじめましての方へ
プロフィール
アメブロで記事を書いていて
メニューやらアクセスやらいろいろ載せてたら
なんかごちゃごちゃしてきた…
なんて場合には囲み枠や枠線を使うと
情報がすっきりとまとまるので見やすくなります！
アメブロの記事に囲み枠や枠線を入れる
HTML編集の基本的なやり方を
いちばん分かりやすく紹介するよ！！
囲み枠の設置手順
①使う囲み枠や枠線のデザインを決めます。
ネットで検索すると色々でてくるけど
大人可愛いデザインはこちら
②選んだデザインのHTMLコードをコピーする
使いたいデザインを決めたら
なんやら英語がバーっと書いている（HTMLコード）
の中身をすべてコピーします。
③記事の作成画面でHTML画面にする
いつもブログを書く手順で
[ブログを書く]画面下の[HTML表示]に切替えます。
④HTML画面に②でコピーしたコードを貼付ける
②でコピーしたHTMLコードを貼付けます。
⑤貼付けたら[通常表示]に戻します。
⑥枠の中に文字を入力する
最後に囲み枠の中身を書きます。
改行する場合は「ENTER」を押します。
以上で完成です！！
しっかりとプレビューを見て
思ったとおりのデザインになっているか確認しながらやってくださいね！！
お配りしているコードをそのままコピーするだけでも使えるけれど
あなたのブログや世界観にあったイメージで作りたい場合は
色を変えたり、形を変えたりしてあなたらしさを作ってみてくださいね
【カラーの参考ページ】
WEB色見本カラーコード
設置の際の注意点
HTMLコードは１文字でも消えたり、
増えたりするだけでもきちんと表示されなくなります！！
間違いを防止するには
HTML編集画面に貼り付けたら
すぐに「通常表示」に戻しましょう！！
そして文字の入力は「通常表示」画面で行なってください！
もしデザインがきちんと表示されない場合は
HTMLコードのコピーして貼付けをもう一度試してみてくださいね。
アメブロ囲み枠や枠設置のまとめ
囲み枠で目立たたり、
文章の区切りで枠線を入れると
読者の「読みやすい」＋「要点を理解しやすい」などのメリットがあります。
自分でカスタマイズして好きな色にしたり、
自分の教室やサロンのテーマカラーに合わせて作成もできるので
読者に印象を残すためにもおすすめです。
色が人に与える印象
もしこの記事があなたの参考になったら
ぜひいいね＆フォローをお願いします
それでは、皆さまにとって素敵な１日となりますように
最後までお読みいただきありがとうございました
旧アカウントからリニューアル♡
＼1,000人以上が受け取ってます／
SNSで世界観をつくる8つのプレゼント
↓ ↓ ↓ ↓ ↓
LINE公式
画像をクリックして登録♡
LINE画面が表示されない方は
@joujounetでID検索
(@も含めて検索してください)
Service
アメブロカスタマイズ／ライティング添削
ヘッダー／バナー／HP制作／インスタテンプレ作成
Instagramコンサル／Canva／LINEリッチメニュー
デュプロマ・テキスト・講座資料の作成
Lステップ代行構築／LINE運用アドバイス
SNSマーケティングをもとに幅広く
女性に響くデザインで
あなたらしさを叶えます♡
ハンドメイドやエステサロン
カフェ&レストラン・英語教室
アロマ・ネイル・婚活塾など
全国各地からご依頼・コンサルで一人一人
寄り添ったサポートを心がけています♡
＼３人のママでも理想の働き方を手に入れた方法✨／
＼インスタはこちら♡Follow Me✨／
LINE公式マーケティングやデザイン作りのヒントを発信♡
心ときめく食器とお花が作れるポーセラーツ＆フラワーインテリア
JouJouetteの教室ブログはこちら♡
ジュジュネット