もっと飛躍したい女性起業家のブランディングコンサル/HP・LP制作

アメブロカスタマイズに使える『大人っぽいカラー』の『クリックしたくなるボタン』でアメブロからお申込みしてもらおう!

 
この記事を書いている人 - WRITER -
吉田せいこ/ブランディングコンサル&HP制作
富山県出身、西宮市在住の39歳。3児のママ。大企業で企画、キャンペーン、広告、HP管理、システム、営業など幅広く経験。仕事好きなのに子育てとの両立に限界がきて退職。強み発見、ブランディング、ライティングが得意でコンサルした方は2か月目で月商150万円突破。素敵なサービス・商品を持っている女性起業家をサポートすることが私の役割。女性の自由な活躍でもっと世界がよくなりますように♡

アメブロカスタマイズに使えるおしゃれな大人カラーのボタンをこちらで公開していきます!

こんな感じのボタンです!

 

 

 

数を少しずつ増やしていきますので、楽しみに&ご活用くださいね。

※ご自身のブログにお使いください、このページのシェア、リブログ歓迎です!(コードや記事をそのまま転載・再配布などはモラル上ご遠慮くださいね、お願いします(^-^))
※コードがもし違っている(見本と違う色になった・・・)などあれば修正しますので、教えてください。

 

使い方の動画もアップしました!
(エンディングが、、、ご覧のスポンサーの提供でお送りしました。みたいな感じになってしまいました(笑))

 

 

とってもお得なお知らせ

アメブロカスタマイズを自分でやってみたい!という方のために、初心者の方でもわかるように、プロのノウハウを丸ごとお伝えする動画講座をご用意しました!

 

・ボタンの作り方

・憧れのメニューバーが自分で作れる(しかもコピー&ペーストでサクっとできます!)

・プロも使う、無料で使えるデザインソフトの使い方・素敵なTOP画像の作り方

・そして、お客様に来てもらいやすいブログのテンプレートの作り方まで

全部全部、まるっと動画の中にいれました。

 

・アメブロを使う人のためのALL in ONE の神講座!

・今まで悩んでいたことが、スルっと解決して自分でできた!

 

とお客様の声をいただき、すでに120名以上の方が使ってくださっています★

Benesse社が提携する、世界最大級の動画学習サイト(Udemy)で1度購入したら今後ず~っと繰り返しみていただけます。

 動画講座詳細を見てみる   動画講座を購入する 

 

【動画】アメブロカスタマイズ クリックしたくなる「ボタン」をオシャレな大人カラーで作ろう!

 

作り方を動画で説明しています。動画の中に出てくる「リソースをダウンロードして・・・コードへのリンクのページへ行く」というのは、このページのことを指しているので、このページをご覧の方は、下のコードをそのままコピー&ペーストして使ってくださいね。

 

 

大人っぽいきれいな色を選んでボタンを作っています。

ブログの中で使うクリックした欲しいボタンの色は、「目立つ色」がベスト。   

赤や黄緑色(LINEのような色)は意思決定を促しやすかったり、抵抗なく押しやすい色とも言われています。いろいろ試してみてください。   

 

 

アメブロカスタマイズ ボタンの形について

 

ボタンでも「あなたらしさ」を伝えていきましょう!

・丸いものは優しい雰囲気。(ママ・ベビーちゃん向け、ご自身がふんわり・柔らか系の方はこちらを使ってください)
・角がキリっとしているのはきちんとした感じ。(しっかり系のお仕事の人!頼られたいと思っている人はこちらを使ってください!)
・角に丸みを帯びているのは中間的な感じ。(丸でも、角でもないわ~という方はこちら)

 

こういう細かなところから、読者さんは、「あなた「らしさ」」を読み取って、あなたのことをイメージしています!

普段はそんなこと意識していないかもしれませんが、こういう「カタチ」も意識して使うと、ご自分のブランディングが整っていきますよ。

 

↑こちらは準備中

 

アメブロカスタマイズ ボタンの色・装飾付について

 

・使いやすい大人な上品なカラーを選びました。

・グラデーションボタンも用意します(準備中)

・飾りのついたボタンも用意しました(準備中)

 

 

丸みのあるボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

 

ボタン① ピンク・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ff8080;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン② 大人ラベンダー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#db7093;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン③ アクアマリン・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#66cdaa;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン④ ヒヤシンスブルー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#7a99cf;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑤ ロイヤルブルー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4169e1;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑥ こっくりグレー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#708090;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑦ 菜の花イエロー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ffec47;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑧ サーモンピンク・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#f3a68c;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑨ ゴールド調・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#bfa469;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

ボタン ⑩パンジーネイビー・影あり・丸みのあるボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4d4398;border-radius:25px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

 

 

きりっとしたボタン/アメブロカスタマイズ ボタン オシャレな大人カラー

 

 

ボタン① ピンク・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ff8080;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン② 大人ラベンダー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#db7093;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン③ アクアマリン・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#66cdaa;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン④ ヒヤシンスブルー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#7a99cf;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑤ ロイヤルブルー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4169e1;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑥ こっくりグレー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#708090;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑦ 菜の花イエロー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#ffec47;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑧ サーモンピンク・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#595857; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#f3a68c;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

 

ボタン⑨ ゴールド調・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#bfa469;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

ボタン ⑩パンジーネイビー・影あり・きりっとしたボタン

​お申込はこちらをクリック​

このコードをコピー&ペーストして使う

<a href="​リンク先のアドレス​" style="color:#ffffff; font-weight:bold; text-decoration:none;  line-height:5.0;" target="_blank"><span style="margin:3px; padding:15px 30px;  background:#4d4398;border-radius:0px; box-shadow:3px 3px 3px #999999;">​お申込はこちらをクリック​</span></a>

この記事を書いている人 - WRITER -
吉田せいこ/ブランディングコンサル&HP制作
富山県出身、西宮市在住の39歳。3児のママ。大企業で企画、キャンペーン、広告、HP管理、システム、営業など幅広く経験。仕事好きなのに子育てとの両立に限界がきて退職。強み発見、ブランディング、ライティングが得意でコンサルした方は2か月目で月商150万円突破。素敵なサービス・商品を持っている女性起業家をサポートすることが私の役割。女性の自由な活躍でもっと世界がよくなりますように♡

- Comments -