忍者ブログ

ツイートボタン(1) デベロッパーズサイト

Date:

ツイッターボタンの追加方法です。

以前、ツイッターボタンの追加の方法を紹介したのを覚えているでしょうか?
あの方法でも、全然問題ないのですが、
記事のURLが長いので、短縮URLとか作れるように改造できないかなーなんて
調べていたら、Twitterの公式サイトに埋込み式のサービスが既にあることを発見!!
わざわざ、自分で作らなくっても、こういうのがあるのはありがたいですね~

http://twitter.com/about/resources/tweetbutton

ここで必要情報を入力すると、コードを自動生成してくれます。
これをテンプレート内の任意の場所に貼るだけ。。。
短縮URLも、タイトルの埋込みも、Twitterアカウントの埋込みも
ぜーーんぶ、やってくれます!



さて、、、
忍者ブログに特化した小技を紹介。
自動生成されたコードに、忍者ブログのタグを埋め込んでみよぅ!

デフォルトのままで、テンプレートに保存するとちょっとかゆいところに手が届かない。
トップページなど複数の記事がまとまっているページでツイートボタンを押されると、
まとまっているページのURLがそのままツイートされてしまう。
どのページでツイートボタンをクリックしても、
その記事そのもののURLがツイートされるのが望ましいですよね?
(ちょっとわかりにくい???^^;)

↓↓↓こちらが、忍者ブログのテンプレートに貼り付けるコードの例。
<a href="http://twitter.com/share" class="twitter-share-button"
data-url="http://<!--g_user_id--><!--$entry_link-->" ←リンク先
data-text="<!--$entry_title-->" ← タイトル表示
data-count="none" ← ツイートボタンを押した数を表示
data-related="[ツイッターのアカウント]" ← おすすめユーザ
data-lang="ja"> ← 言語
Tweet</a>

これを上から順に追っていきます。
リンク先の部分。ここがツイートボタンを押したときにリンク先として表示されるURLになる。
Z.e.R.Oの場合、http://<!--g_user_id--><!--$entry_link--> としておく

タイトル表示の部分には、ツイートしたときにいっしょに表示してくれるテキストになる
ここでは、記事のタイトルをテキストにしたいので、<!--$entry_title-->としておく

おすすめユーザってところに、ツイッターのアカウントを入れておくと
ツイートボタンを押したあとに、おすすめユーザですからフォローしてみませんか?
みたいなダイアログが表示されることになる。

参考に自動生成されたコードをちょっといぢってみてください~。



こちらのサイトも参考になります。
FC2ブログの各記事に「ツイートボタン」を設置する方法

忍者ブログの場合は、
<%topentry_title>のかわりに → <!--$entry_title-->
<%topentry_link>のかわりに → http://<!--g_user_id--><!--$entry_link-->
を入力します~。


サイト内関連記事:
ツイートボタン(1) デベロッパーズサイト
ツイートボタン(2) パラメーター
PR

Category: | Date:2010/10/31


忍者ブログ [PR]