[WordPress] ツイートボタンの設置方法

WordPressの記事にTwitterのツイートボタンを設置します。
今回は記事のタイトルの直下に設置することにしました。

/wp-content/themes/twentytwelve/content.php を開き、

<a href=”http://twitter.com/share” data-count=”horizontal” data-via=”****” data-text=”<?php the_title(); ?>” data-url=”<?php the_permalink() ?>” data-lang=”en”>Tweet</a><script type=”text/javascript” src=”http://platform.twitter.com/widgets.js”></script>

を</header>タグ直前に追加する。

ここでのポイントとして、WordPressの関数を呼ぶことで記事のタイトル(the_title)と記事のリンク(the_permalink)を動的にコードに埋め込んでいます。

****は、あなたのTwitter IDを入れましょう。Twitter公式サイトにもありますが、オプションを変えるとあなたの好みに応じてカスタマイズできます。
表示される言語も選択できるようになっていて、「Tweet」がよければ data-lang=”en”を、「ツイート」がよければdata-lang=”ja”にすれば変更できます。

これだけだと記事のタイトルとの余白が無いので、

/wp-content/themes/twentytwelve/style.css を開き、

iframe.twitter-share-button {
margin-top: 10px;
}

を追加すると、ボタンの上に余白が入って見やすくなりました。