春カラーの写真背景を使ったアメブロの囲み枠とワークショップ

本日の素材：写真ACさま

春のアメブロのための囲み枠ラインナップ

 

セミナーをされる方で、講座情報などをその日の投稿内容と区別して発信するために、アメブロでは上手に囲み枠が使われています。

 

日々、使っている方は結論するところではないでしょうか。

 

→シンプルな囲み枠が一番使いやすい

 

ということに。

 

…んが、しかし！それじゃ物足りない、というちょっとこだわる方向けの囲み枠をニッチなところで発信していこうかな、という趣旨で、春っぽい素材写真を使った囲み枠です。

 

■テーマ「桜」

 

タイトル
ここに本文

 

 

<div align="center"><div style="border: 1px solid #a4a4a4; border-radius: 5px; background: url(http://stat.ameba.jp/user_images/20160411/19/ego-coro/44/34/j/o0500060013617806909.jpg) no-repeat; background-position: bottom right; max-width: 480px; padding: 10px; text-align: left;"><div style="border-left: 5px solid #ff66cc; border-bottom: 1px solid #eeeeee; box-shadow: 0px 2px 2px #cccccc; padding: 0 10px; margin-bottom: 10px;"><span style="color:#FF7FBE;">タイトル</span></div>%TEXT%</div></div>

 

 

■テーマ「キャンディ」

 

タイトル
ここに本文

 

 

<div align="center"><div style="border: 1px solid #a4a4a4; border-radius: 5px; background: url(http://stat.ameba.jp/user_images/20160411/19/ego-coro/17/c8/j/o0500060013617825903.jpg) no-repeat; background-position: bottom right; max-width: 480px; padding: 10px; text-align: left;"><div style="border-left: 5px solid #ff66cc; border-bottom: 1px solid #eeeeee; box-shadow: 0px 2px 2px #cccccc; padding: 0 10px; margin-bottom: 10px;"><span style="color:#FF7FBE;">タイトル</span></div>%TEXT%</div></div>

 

 

 

■テーマ「水彩ドット」

 

タイトル
ここに本文

 

 

<div align="center"><div style="border: 1px solid #a4a4a4; border-radius: 5px; background: url(http://stat.ameba.jp/user_images/20160411/19/ego-coro/bb/2f/j/o0500060013617829445.jpg) no-repeat; background-position: bottom right; max-width: 480px; padding: 10px; text-align: left;"><div style="border-left: 5px solid #ff66cc; border-bottom: 1px solid #eeeeee; box-shadow: 0px 2px 2px #cccccc; padding: 0 10px; margin-bottom: 10px;"><span style="color:#FF7FBE;">タイトル</span></div>%TEXT%</div></div>

 

 

 

■テーマ「モービル」

 

 

タイトル
ここに本文

 

 

<div align="center"><div style="border: 1px solid #a4a4a4; border-radius: 5px; background: url(http://stat.ameba.jp/user_images/20160411/19/ego-coro/ee/8a/j/o0500060013617834545.jpg) no-repeat; background-position: bottom right; max-width: 480px; padding: 10px; text-align: left;"><div style="border-left: 5px solid #69B300; border-bottom: 1px solid #eeeeee; box-shadow: 0px 2px 2px #cccccc; padding: 0 10px; margin-bottom: 10px;"><span style="color:#69B300;">タイトル</span></div>%TEXT%</div></div>

 

【アメケアをお使いの場合】上記のタグをそのまま登録してお使いください。
【アメケアをお使いでない場合】HTML表示側にタグをコピペして、赤字箇所を書き換えてください。上記の例でいうならば、%TEXT%のところに、「ここに本文」が入ります。

 

「ちょっとごちゃごちゃして見づらいんじゃない？」と思われるかもしれません。
長文になってくると、白のグラデーションが敷いてあります。一番見づらいだろう「モービル」でこんな感じになります（↓）

 

 

タイトル

（例文）

セミナー開催のお知らせです。

 

日時：〇月〇日（〇）　XX時～XX時

 

会場：〇〇研修室

 

定員：〇名

 

会費：〇〇〇円

 

 

 

写真素材は写真素材サイト「写真AC」さん（撮影者も写真ACさんのものに限定しています）からダウンロードしました。

利用規約は確認しておりますが、自己責任にてお使いください。

 

 

こういうちょっと扱いづらいように思える囲み枠も、クリック一つで設置できるのがアメケアです！

 

囲み枠しかり、「あの人のブログの、あんなのいいな」がアメケアにはいっぱい詰まっています。
そして、そのどれもが専門知識がない初心者にも使いやすくされているものばかり！

 

今回は新エディタ対応になったアメケアをご紹介しつつ、ブログを整える機能をご紹介します。

 

アメケアで読みやすいブログづくりワークショップ

ブログづくりワークショップのお知らせです

 

◆2016年5月10日（火）

◆10時半～13時半（休憩15分）

◆定員5名　※満席となりました。ありがとうございます。

◆ノートパソコン、電源アダプタ、筆記用具をお持ちください。

 

《会場へのアクセス》

住所　札幌市中央区北2条西2丁目STV北二条ビル1F

会場となるプラット2.2HPのアクセスについてのページはこちら
《地下鉄でお越しの場合》
東西線、東豊線、南北線大通駅31番出口　徒歩3分

東豊線、南北線札幌駅22番出口　徒歩3分

 

《JRでお越しの場合》

JR札幌駅南口より徒歩8分

 

《車でお越しの場合》
近隣の有料駐車場かコインパーキングをご利用ください。

 

お申し込みフォームはこちらから

 

 

囲み枠以外にも、定型文の設置方法や、紹介リンク…アメケアの使えるポイントをできる限りご紹介します。

今朝発行のメールレターにて、すでにお申し込みをいただき、残席4名です。
少人数ですが、一席だけ増席しました。

 

リピート受講も大歓迎です！ブログの見直し、メンテナンスがてら遊びにいらしてください！

 

 

Cocoro+et+Gokoro（こころ・え・ごころ）

北川　直枝