マーカーの引き方もわかったので、次は枠で囲む方法を知りたい！と調べていたらはてなブログに「定型文貼りつけ機能」という便利な機能がある事を発見しました。
早速やり方を記録したいと思います♪
編集サイドバーに「定型文貼りつけ」を表示させる
- 記事を編集（スマホの場合はPC画面に切り替える）
- 右端の編集サイドバーの一番下の➕（追加ボタン）をクリック
- 「定型文貼りつけ」をスライドしてオンにする
編集サイドバーに定型文貼りつけのアイコンが出るようになりました✨
囲み枠の作成方法
こちらの枠を作る場合
<div style="padding: .5em 1em; margin: 2em 0; border: double 5px #3f87ce; border-radius: 10px; background: #ffffff;"> <p style=" margin: 0; padding: 0;">内容</p></div><p></p>
- 作りたい枠のコードをコピーする
- 編集サイドバーの定型文貼りつけアイコンをクリック
- 「定型文を作成する」をクリック
- 枠の名前を入力
- コピーしたコードを貼りつける
- 保存をクリック
記事で定型文を使う方法
- 「みたままモード」にする
- 定型文貼りつけアイコンをクリック
- 使いたい定型文をクリック
- 下にある「選択した定型文を貼りつけ」をクリック
定型文で作った枠が表示されました✨
最後に
憧れの囲み枠が簡単に作れるようになりました♪
色々なサイトを参考にさせてもらったのですが、最初はコードをコピーしても上手く表示されなかったりと苦戦しました。
（はてなブログのサイトを見ると「定型文を保存した編集モードと異なる編集モードで定型文貼り付けをする場合、文章やHTMLが一部反映されない場合があります。」とありました。それが原因だったのかな？）
その後下記のサイトを参考にさせて頂きようやく枠を作ることが出来るようになりました。
ありがとうございます！！
以上、はてなブログの定型文を使って囲み枠を作る方法でした。
これから色々作って華やかなブログにしていきたいです♪
