AIを活用したアメブロ集客支援サービスはこちらへ >

アメブロにボタンを設置する方法【4ステップ】

この記事ではアメブロにボタンを設置する方法【4ステップ】を解説していきます。

アメブロでボタンを設置することで通常のURLの設置よりクリック率を高めることができます。他のページに飛ばしたい場合や顧客リスト獲得のためのLPへ誘導する際に活用することができますので、ぜひ4ステップを理解して実践してみることをおすすめします。

 

 

1ステップ:ボタンのデザインを選択する

アメブロをブログを書いている人の中には、訪問者を商品やサービスの申し込みページなどへ誘導するためにテキストリンクを積極的に活用している方も多いかと思います。

ですが、テキストリンクよりもデザインされたボタンリンクの方がクリックされやすい傾向があります。

 

アメブロでボタンを設置する方法は非常にシンプルで、まずはデザインを選択する必要があります。

インターネット上には、アメブロに設置できるボタンを公開している方も多いため、自身のアメブロのイメージやボタンを設置する目的などに合ったデザインを選びましょう。

 

2ステップ:HTMLコードをコピーする

設置したいボタンのデザインを決定したら、次はHTMLコードをコピーするステップに移ります。

ボタンデザインを公開してくれている方のブログを閲覧していると、各デザインに下に「
<div class=”」などから始める文字列が表示されているはずです。

 

これはボタンを表すHTMLコードなのですが、アメブロの記事内にボタンを設置するにはこの文字列が必要です。

この文字列を記事の任意の位置に貼り付けることで設置することができるので、ここでは好みのボタンの下に表示されているHTMLコードを全てコピーしましょう。なお、HTMLコードの意味が分からないという場合でも問題なく設置することが可能です。

 

3ステップ:アメブロの任意の位置に貼り付ける

設置したいボタンのHTMLコードをコピーしたら、次はアメブロの記事作成画面を開き、画面下に表示されている「HTML表示」をクリックしましょう。

そして、コピーしておいた文字列を貼り付けたら、「HTML表示」の隣にある「通常表示」をクリックしてください。すると、記事内に選択したボタンが設置されているはずです。

 

ただし、この段階ではボタンを押してもリンク先に飛ぶことはできないので、次にリンク先のURLを設定します。リンク先のURLを設定するには、まずボタン内の文字列を選択した状態で、画面左上の「リンクマーク」をクリックしましょう。

編集画面が開いたら、リンク先のURLを貼り付けて「リンクを挿入」をクリックすれば作業完了で、ボタンを押すことでリンク先へと飛ぶことができるようになります。

 

4ステップ:ボタンの文字を変更する

上記の3ステップを手順通りに行えば、任意のリンク先に飛べるボタンを設置することができますが、ボタン内に書かれている文字が設置目的に合わない場合は以下の作業を行ってください。

ボタンの文字を変えたい場合は、「HTML表示」に切り替えてHTMLコードに手を加える必要があります。

 

HTMLコードを見てみると、ボタンに書かれている内容と同じ日本語部分があるはずなので、その部分を希望する文字へと変更すれば作業は完了です。

なお、文字数が多すぎると上手く表示されない可能性があるので注意が必要です。基本的には10文字程度であれば問題なく表示されるかと思いますが、ボタン内の文字はできるだけシンプルな文言にすることをおすすめします。

 

まとめ

アメブロにボタンを設置する方法【4ステップ】についてお伝えしてきましたが、いかがでしたか?

アメブロでボタンを設置することができれば、他のサイトやLPへのクリック率が高まり、コンバージョンに繋げることができます。ボタンの種類やデザインは様々ありますので、ブログ全体の雰囲気に合ったものを選択すると良いでしょう。