SNS

Twitterフォローボタンをブログやホームページに設置する方法

2016-04-21

Twitter

 

ブログやホームページに表示されているTwitterのボタン。これを作りたい。

Twitterには公式ボタンがあります。

 

作り方のページは英語表示ですが簡単に作ることが出来ますので、

今回は実際に作る過程をまとめました。

 

twitter公式のボタンが簡単に作れる

 

twitter公式のボタン作成は、こちらでつくります。
twitterボタン

Twitterボタンページ

 

入力欄にTwitterのURLを入力して、矢印をクリックします。

Twitterurl

 

画面右の「Twitter Buttons」をクリックします。
タイムラインを設置したい場合は左の「Embedded Timeline」で作れますよ。

Twitterボタン

 

フォローボタンは左、メンションボタンは右になります。

Twittercord

 

ボタンのタイプを選択すると、コードが表示されるので「Copy Code」をクリックしてコピーし、自分のサイトなどに貼り付けます。

 

ボタンのカスタマイズ

ちょっとボタンが細いなぁ・・・という方はカスタマイズして見ましょう。

「set customization options」という文字をクリックします。

 

Twitterカスタマイズ

 

チェックを入れていくとプレビュー画面で確認しながら作れます。

Would you like to simplify the button text?

ボタンにユーザー名を表示されたくない時はチェックを入れます。

How would you like the button displayed?  

ボタンを大きくしたい時はチェックを入れます。

What language would you like to display this in?

言語設定です。「Automatic」を選ぶとページを見ている人の環境に合わせて表示されます。

 

「Opt-out...」のチェック項目は、twitterで表示される「おすすめユーザー」に自分のアカウントが表示されるか、されないか

(おすすめユーザーは「フォローしてないけど見たことがあるページ」のアカウントが表示されます。

 

そこに表示させるかの選択です)公式を見ると「ユーザーの興味関心」に合わせてのカスタマイズということなんですが、私はチェックをつけておりません。
最後に「Update」をクリックすると、コードが表示される画面に戻ります。

 

フォローボタンだけでなく、自分のブログなどに「自分の呟いたことも表示させたい。」その場合はタイムラインを設置出来ます。

 

Twitterのタイムラインをブログやホームページに表示させる。

 

-SNS
-,