Twitterのフォローボタンを自分のサイトに簡単に設置する方法

こんにちは!CODE CLUB965のKです!

今回は、Twitterのフォローボタンを簡単に設置する方法について書こうと思います。

ちなみにフォローボタンを設置すると、

こんな感じで表示することができます。

Twitterフォローボタンのコードを生成する

まずはフォローボタンのコードを生成します。

Twitter Publishというサイトでコードを生成することができます。
英語のサイトですが、特に難しくないので心配無用です。

順番に説明します。

  1. Twitter Publishのサイトに移動し、フォローボタンを設置したいTwitterアカウントのURLを貼ります。
    ※ TwitterのURLはプロフィール画面のURL

2. 「→」ボタンをクリックし、オプションの「Twitter Buttons」を選択する
 ※ ちなみに左側はTwitterのタイムラインのコード生成です

3. 「Follow Button」を選択する

選択すると以下の画像のようにコードが生成されます。
これで問題なければ、「Copy Code」でコードをコピーしてサイトに貼り付ければOKです。

ただ、思っていたのとちょっと違うと思った場合は、カスタマイズすることもできます。

カスタマイズ方法

カスタマイズしたい場合は、画像の枠で囲んでいる「set customization options」をクリックします。

カスタマイズできる項目が表示されますので、自分の好みに合わせてオプションを選択します。

カスタマイズ項目ですが、上から

ユーザー名の表示、非表示
アイコンの大きさ
ボタンに表示する言語の選択
 ※ 日本語で「フォローする」と表示したければ「Japanese」を選択します

あとは「Update」をクリックするれば、新しくコードが生成されます。

あとは同じく、コードを自分のサイトに貼り付ければ完成です。
簡単にできるのでいいですね!

ぜひ、Twitterと自分のサイトを連携したい場合は活用してみて下さい!

それでは、また!

Follow me!