アメブロの記事から、なかなかお申し込みが入らないのですが…
お申し込みフォームへのリンクは、ボタンにしてますか?
いいえ、画像を作るのって難しそうで。
まだ、告知ページ(ランディングページ)をお持ちでない方だと、アメブロの告知記事からお申し込みフォームへのリンクを貼ることになりますよね。
「お申し込みはこちら」と書かれたテキストにリンクを貼っても、なかなかお申し込みが入らない、ってことありませんか?
もちろん、お申し込みが入らない理由には様々ありますが、もしかしたらお客様が申し込み先を見つけられていないという単純なことが原因かもしれません!
お申し込みフォームへのリンクは、目立つようにボタンにしましょう。それだけでお申し込み率がアップすることも少なくないんです。
ボタンは、画像で作ってもいいのですが、HTML&CSSでの作成も簡単です。
コピペで使ってもらえるものを用意したので、ぜひ使ってみてください!
お申し込みボタンの使い方
- 通常の編集画面で、ボタンを入れたい部分にあらかじめ目印のテキストを入れておく(例:ボタン)
- 下記のうち、使いたいボタンの下にある、枠内のアルファベットを<p>から</p>まで全てコピー
- ブログ記事編集画面で「HTML編集」を選ぶ(スマホアプリの場合は一旦「入力完了」してから右下の「HTML編集」をタップ)
- 先ほど入れた任意のテキスト部分の前後<p>から</p>までを選択し、コピーしたものを上書き
- 「リンク先URL」と書かれた部分を書き換え
- 通常編集画面に戻って確認
<p><a href=”リンク先URL” style=”display: block; width: 200px; height: 50px; line-height: 50px; color: #fff; text-decoration: none; text-align: center; background-color: #F69896; border-radius: 25px; -webkit-transition: all 0.5s; transition: all 0.5s”>お申し込み</a></p>
<p><a href=”リンク先URL” style=”display: block; width: 250px; height: 50px; line-height: 50px; color: #fff; text-decoration: none; text-align: center; background-color: #E48B63; border-radius: 25px; -webkit-transition: all 0.5s; transition: all 0.5s”>お申し込みはこちら</a></p>
<p><a href=”リンク先URL” style=”display: block; width: 300px; height: 50px; line-height: 50px; color: #fff; text-decoration: none; text-align: center; background-color: #585EAA; border-radius: 25px; -webkit-transition: all 0.5s; transition: all 0.5s”>お申し込みはこちらからどうぞ</a></p>
<p><a href=”リンク先URL” style=”display: block; width: 200px; height: 50px; line-height: 50px; color: #fff; text-decoration: none; text-align: center; background-color: #A0B37D; border-radius: 10px; -webkit-transition: all 0.5s; transition: all 0.5s”>お申し込み</a></p>
<p><a href=”リンク先URL” style=”display: block; width: 250px; height: 50px; line-height: 50px; color: #fff; text-decoration: none; text-align: center; background-color: #B37D8F; border-radius: 10px; -webkit-transition: all 0.5s; transition: all 0.5s”>お申し込みはこちら</a></p>
<p><a href=”リンク先URL” style=”display: block; width: 300px; height: 50px; line-height: 50px; color: #fff; text-decoration: none; text-align: center; background-color: #E7BB5E; border-radius: 10px; -webkit-transition: all 0.5s; transition: all 0.5s”>お申し込みはこちらからどうぞ</a></p>
青字で書いた色のコードは、任意の色に変更することも可能です。
こちらのページで色を選んで、そこに書かれている「#」から始まる数字やアルファベットの組み合わせで上書きすればOKです!
いつでも投げ銭大歓迎♬