ホームページ制作やブログ制作に役に立つ!facebookとtwitterのボタンの設置方法!-twitter編-

こんにちは!
パクちゃんです!

ホームページ制作やブログ制作に役に立つ!facebooktwitterのボタンの設置方法!
今回はTwitter編です。

ボタンの設置方法はfacebookより Twitterの方が簡単なので
説明通りにすればすぐできると思います!


⇒facebook編はこちらへ

Twitter

> Twitterボタン
上記のリンクをクリックすると Twitter開発者向けのサイトに飛び、
「ツイート」ボタンを作ることができます。

まず、サイトに行くと下記の画面が表示されます。

f:id:fteam:20130118110713p:plain


Twitterのボタンは全部で4種類がありますが、各ボタンの左側にあるラジオボタンをクリックすると、下に設定できる画面が表示されます。それぞれクリックし設定すれば右側のTwitterボタンの下に自動的にHTMLのコードが表示されます。そのコードを使って自分のサイトやブログに入れれば設定ができるようになっています。

これからはそれぞれのボタンの特徴について説明します。
*各ボタンをクリックすると画面の下に詳細が表示されます。


①リンクを共有する(良く使うタイプ)
  ➜指定したサイトについてつぶやくためのボタンです。

f:id:fteam:20130118110746p:plain

              ↓
 

f:id:fteam:20130118111028p:plain



■URLを共有
◎ページのURLを使う→ボタンを設置したページのURLを自動挿入します。
◎http://が書かれているところには→自分が任意でURLを設定できます。。

■ツイート内テキスト
◎ページのタイトルを使う→ページのタイトルを表示します。
◎下の「サイトを見る」と書かれているところには自分でタイトル文章を設定することができます。

■数を表示
 ツイート数表示の有無を設定できるチェックボタンです。チェックを外すとツイーと数が表示される吹き出しが無くなります。

■ユーザー
ここにユーザー名を入力するとボタンをクリックした時に「@入力したユーザー名さんから」という形で表示されます。

■推奨
推奨アカウントの指定します。

■ハッシュタグ
 ボタンをクリックしたら表示される、メッセージボックスのURLの後にハッシュタグを挿入できます。
 *ハッシュタグとは?
 →Twitterの用語で、「#」の後ろに検索のために使う「文字列」のタグのことです。例えばHTML5について話題になったとしましょう。その際にツイーと文章の内に#HTML5と書きます。そうすることによりTwitterで「#HTML5」と検索したらHTML5に関するツイートが表示されます。ハッシュタグを付けることにより自分と同じ興味を持つ人のツイートを確認し、意見を共有できるようになります。

■ボタン
 チェックをするとボタンの大きさが大きくなります。

■カスタマイズされたTwitterからのオプトアウト
 カスタマイズされたおすすめユーザーを表示します。
*詳しくは公式サイトで ➪ カスタマイズされたTwitterからのオプトアウト
https://support.twitter.com/articles/20169942-#

■言語設定
 ボタン内の言語を設定することができます。

----------------------------------------------------------------------------------------------------------------------

②フォロー
  ➜簡単にほかのユーザーとフォローができるボタンです。

 

f:id:fteam:20130118111136p:plain

              ↓

f:id:fteam:20130118111153p:plain



■ユーザー
ここにユーザー名を入力するとボタンをクリックした時に「@入力したユーザー名さんから」という形で表示されます。

■ユーザー名を表示
 チェックを外すとボタン内の文章が「フォローする」のみになります。

 f:id:fteam:20130118111324p:plain
 
■ボタン
 チェックをするとボタンの大きさが大きくなります。

■カスタマイズされたTwitterからのオプトアウト
 カスタマイズされたおすすめユーザーを表示します。
*詳しくは公式サイトで ➪ カスタマイズされたTwitterからのオプトアウト
https://support.twitter.com/articles/20169942-#

■言語設定
 ボタン内の言語を設定することができます。


----------------------------------------------------------------------------------------------------------------------

③ハッシュタグ
 ➜ハッシュタグをつぶやくボタンです。

f:id:fteam:20130118111520p:plain

              ↓

f:id:fteam:20130118111540p:plain


 
*内容は他のボタンと同じなので前の説明を参考して設定してください。

----------------------------------------------------------------------------------------------------------------------


④@ツイート
 ➜特定のユーザにつぶやく際に使うボタンです。
 

f:id:fteam:20130118111551p:plain

              ↓

f:id:fteam:20130118111558p:plain

 


*内容は他のボタンと同じなので前の説明を参考して設定してください。


⇒facebook編はこちらへ