Twitterのシェアボタンからツイート後フォローを促す画面を表示させる設定方法まとめ

例えば、Yahoo!ニュースのTwitterシェアボタンから、こんな感じでツイートボタンを押したとします。

Yahoo!ニュースからツイート

すると、こんな感じで表示されます。

Yahoo!のツイート後のフォローボタン

このように、おすすめユーザーが表示され、フォローを促す画面が表示されます。

この機能、フォロワー増加を目論むには結構いい機能だと思います。

とりあえず、ツイートする人の目に触れる機会が多くなり、ツイートした人の中の100人に1人くらいは.もしかしたらフォローしてくれる可能性もあるかもしれません。

少なくとも、フォローボタンが全く目に触れない場合よりは、フォロー率は高くなるのではないかと思います。

この「フォローを促す画面」は、前々から気になっていたのですが、昨日ようやく詳しく調べてみたので、いろいろな設定方法を紹介したいと思います。

photo by Nan Palmero

スポンサーリンク
レクタングル(大)広告

Twitter純正のツイートボタンの場合

以下で純正のツイートボタンを使って「フォローを促す画面」を表示させる方法を紹介します。

以下の動作サンプルは、既に@MrYhiraをフォローしている場合は、フォロー画面は表示されません。

通常のボタン

純正の縦型ツイートボタンは通常はこんな感じです。

ソースコードはこんな感じです。

フォローを促すボタン

これを、ツイート後にフォロー画面を表示させるようにすると以下のようになります。

 

コードが多くてわかりづらいので、変更した箇所だけのみを書くとaタグの属性に以下のように追加しただけです。

以下のように属性を追加します。@は不要です。

data-related="アカウントID"

このように設定することで、以下のように表示されます。

フォローを促す画面が表示される]

フォロー画面に説明文を挿入する

フォローを促す画面にユーザーの説明を入れると以下のようになります。

わかりやすくaタグ属性の追加部分だけを書くと、以下のようになります。

以下のように属性を追加します。

data-related="アカウントID:説明文"

アカウントIDと説明文の間は:(コロン)で区切ります。

上記のように設定する事で以下のように表示されます。

フォロー説明文が表示される

複数ユーザーのフォローを促す

冒頭のYahoo!フォロー画面に2つ出ていたように、複数のフォローボタンを表示させると以下のようになります。

追加部分は以下のようになります。

以下のように、,(カンマ)で区切って複数ユーザーを指定します。

data-related="ユーザーID1,ユーザーID2,…"

上記のように設定を行うと、以下のように表示されます。

複数のTwitter IDを指定した場合

複数ユーザー+説明文を表示させる

複数のアカウントを表示させ、それぞれに説明文をつけると以下のようになります。

追加部分は以下のようになります。

以下のように、:(コロン)で説明文を書き、,(カンマ)でユーザー同士を区切ります。

data-related="ユーザーID1:説明文1,ユーザーID2:説明文2,…"

上記の設定で、以下のように複数ユーザーを設定しながら、説明文も表示できます。複数ユーザーと説明文入りのフォローを促す画面

ユーザーが独自に作成したシェアリンクの場合

当サイトの場合は、Aタグを利用して、以下のような独自リンクでツイートボタンを実装しています。

2015-07-21_12h15_22

通常のリンク

通常リンクで、ツイートリンクを作成するには以下のように作成します。

ツイート

ソースコードは以下のようになります。

フォローを促すリンク

ツイート後にフォローを促す用にすると以下のようになります。

ツイート

追加したコードだけを書くと、aのhref属性のURLパラメーターに以下を追加しただけです。

URLに以下のようなパラメータを設定して追加してください。

&related=ユーザーID

すると、Twitter独自ボタンの時と同様に、ツイート後に以下のように表示されます。

フォローを促す画面が表示される]

フォロー画面に説明文を挿入する

説明文を挿入すると以下のようになります。

ツイート

追加したパラメーター部分は、以下のようになります。

パラメーターで指定する場合も、:(コロン)のあとに説明文を書きます。

&related=ユーザーID:説明文

ツイート後には、以下のように表示されます。

フォロー説明文が表示される

複数ユーザーのフォローを促す

複数ユーザーのフォローを促す場合は、以下のようになります。

ツイート

追加したパラメーター部分は以下になります。

以下のようにユーザーIDを,(カンマ)で区切って複数並べればOKです。

&related=ユーザーID1,ユーザーID2,…

ツイート後は、以下のように表示されます。

複数のTwitter IDを指定した場合

複数ユーザー+説明文を表示させる

複数ユーザーと、説明文を同時に表示させると以下のようになります。

ツイート

パラメーター部分のみにすると、以下のようになります。

以下のように、:(コロン)で説明文を書き、,(カンマ)でユーザー同士を区切ったパラメーターを追加します。

&related=ユーザーID1:説明文1,ユーザーID2:説明文2,…

このように書いてツイートすることで、ツイート後、以下のように表示されます。

複数ユーザーと説明文入りのフォローを促す画面

まとめ

冒頭でも書きましたが、このフォローを促す機能は、フォロワー増加にある程度有効ではないかと思います。

広告でも、なんでもそうなんですが、とにかく人の目に触れないことには、アクションを起こそうとはなかなか思ってくれません。

例え、アクションを起こしてくれなかったとしても、同じサイトページを何度かツイートするうちに、いつの間にかアバターが頭に入っていて、「またこの人か。これだけツイートしているなら、フォローしても良いかも」と思ってもらえる可能性もなきにしもあらずです。

僕も昨日から、当サイトでこれらを試してみたのですが、通常は1日平均、1~2人増加するフォロワーが、今日は昨日の夜から半日で6人増えました。

サンプル期間が、まだ一日だけなので、たまたまなだけかもしれません。けれど、僕としてはそれなりに効果があると思っています。効果がなかったら、Yahoo!とか、その他の大手サイトは採用していないと思うので。