WordPress にツイートボタンを設置する方法をメモしておきます。
WordPressへTwitterのツイートボタンを設置する方法
単純にタグを貼るだけなので簡単です。
こちらのページでタグは取得できます。
> Twitter社について/素材/Twitterボタン
取得したボタンのタグはこんな感じです。
<a href="https://twitter.com/share" class="twitter-share-button" data-lang="ja">ツイート</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
日本語で、サイズは大です。
ツイートボタンのツイート数の吹き出しを右横から上に表示させる方法
ぼくが前に見た時はツイートボタンの設定を行う際に、デザインを何種類か選ぶ事ができ、その中に以下のようなツイート数の吹き出しが上に表示されるボタンがありましたが、現在はデフォルトでは選べないようですね。
↑
このデザインにしたい
でもクライアントさんが上に表示されているボタンがいいと仰ってたので、レイアウトを変えてみました。
<a href="https://twitter.com/share" data-via="ユーザーID" data-lang="ja" data-size="large" data-count="vertical">ツイート</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
【 data-count=”vertical” 】を追記すれば、ツイート数の吹き出しが上に表示されるようになります。後はツイートボタンを表示させたい場所に、上記のコードをコピペすれば OK です。
では WordPress の数ある PHP テンプレートの中の、どこに書けばいいのか?? Twenty Eleven に関してということになりますが、だいたい以下の4つのファイルに書き込めばいいと思います。
- content-page.php
- content-single.php
- content.php
- comments.php
多くの場合、記事の最初か記事の最後、もしくはその両方に表示させたいと思っているかと思いますので、どこに表示させるかで設置位置が変わってきます。
詳しくはこちらの記事にまとめましたので、ご覧ください。
コメントを残す