前回記事で、amecareの公式サイトで公開している囲み枠を簡単に登録して利用する方法をご紹介しました。
これに加え、amecareは、amecareの公式サイト以外で公開されている「非公式の囲み枠」も簡単に登録して記事に貼り付けることができます。
現在、アメブロの記事エディタには気軽に使える囲み枠が用意されていますが、長らくこういったものがなかったこともあって、これまで多くのユーザーによってアメブロで使える様々な囲み枠が考案・公開されてきました。
当記事では、これらの、アメブロ標準でもなくamecareの公式でもない「非公式の囲み枠」を手軽に使えるようにするため、amecareに登録する手順をお伝えします。


アメブロで使える囲み枠
上でも書いた通り、アメブロで使える囲み枠はたくさん公開されていますが、今回は例として、櫻井のりえさんのアメブロの記事で紹介されている囲み枠を使わせてもらいます。

記事タイトルからも想像できる通り多くの囲み枠のタグが紹介されていますが、その中から、「30.タイトル付き・点線の枠(細いバージョン)」という囲み枠を選んでみました。

fieldset
タグとlegend
タグを使った、シンプルなタイトル付きの囲み枠です。
囲み枠のタグをamecareに送る
このようにブログなどで紹介されている囲み枠をamecareに登録するには、下の画像のように、まず、囲み枠のタグ(HTMLタグ)全体を選択します。

そして、選択したタグの位置でマウスを右クリックし、右クリックメニューの中の「amecare」という項目までカーソルを移動、横に出た小さなメニューの「囲み枠に保存」を左クリックして下さい。

この操作によって、タグの内容を囲み枠のタグとしてamecareに送ることができます。
囲み枠のタグをamecareに保存する
前項の操作により、下の画像のように、囲み枠のタグがセットされた状態で、amecareの「囲み枠管理」画面が開きます。

このまま保存しても、タグをそのまま記事エディタに貼り付けることは可能ですが、囲み枠として便利に使うために、少し変更を加えます。
名前を変更する

まず、囲み枠の名前を、初期の「新しい囲み枠」から、わかりやすい名前に変更します。
今回は、「タイトル付き・点線の枠」にしてみました。
本文の位置をamecareに教える

単にタグを貼り付けるだけではなく、既に記事に書いてある文章を囲むなど、便利な囲み枠として動作させるためには、囲み枠の中の本文になる部分をamecareに教える必要があります。
手順は以下の通りです。
- プレビューを参考にしながら、タグ中で本文になる部分全体を選択する
選択範囲を本文に設定
というボタンをクリックする
下の画像のように、プレビューの囲み枠の中身が囲み枠の名前と表示サンプルの文に変われば成功です。

保存する

名前の変更と本文になる部分の設定ができたら、画面の下の方にある「追加」ボタンをクリックして囲み枠を保存します。
「一覧の最後に追加で保存しました。」というメッセージが表示されれば保存は成功です。メッセージは「OK]ボタンを左クリックして閉じてください。

確認する
囲み枠の保存に成功すると、下の画像のように一覧の最後に囲み枠の名前が追加されます。

名前だけではわかりにくい場合は「一覧をプレビューで表示」というチェックボックスにチェックマークを入れると、下の画像のように、囲み枠の名前がその囲み枠で囲まれて表示されますので、わかりやすいと思います。

これで、囲み枠の登録ができましたので、この画面を閉じて登録作業は完了です。
ポップアップウィンドウでも確認
最後に、登録した囲み枠がちゃんと使える状態になっているかも確認しておきます。
amecareのポップアップウィンドウを開いて「囲み枠」のタブをクリックし、登録した囲み枠があるか確認してください。

名前だけは分かりにくい場合は、「プレビュー」というチェックボックスにチェックマークを入れると、ここでも囲み枠の名前がその囲み枠で囲まれて表示されますので分かりやすいと思います。

問題なく表示されれば、確認完了です。
なお、念のため記事に貼り付けできるかの確認もしておけば、なお良いと思います(このステップは、当記事では割愛させていただきます)。
まとめ
以上、アメブロ標準でもなくamecareの公式でもない「非公式の囲み枠」を、amecareに登録する方法を、手順を追ってご紹介しました。
名前を変更する以外は、マウス操作だけで完結する簡単にできる方法なので、よろしければお試し下さい。

