Google +1ボタンをWordPressに追加する

Google +1が一般ユーザも使えるようになりましたね。

使い方は簡単、以下のようなコードをサイトに埋め込むだけです。

<script type="text/javascript" src="http://apis.google.com/js/plusone.js">// <![CDATA[
{lang: 'ja'}
// ]]></script>

ただ、これだとブログのトップページに設置した場合、トップページが+1されてしまいます。
各記事を+1したいですよね。

記事一覧と記事詳細の両方に表示するには、以下のようにしましょう。
(ファイル名などはテーマによって変わります)

  • wp-content/themes/default/header.php
<!-- headタグの終了直前(本当はどこでもいい)に以下を追加する -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">// <![CDATA[
  {lang: 'ja'}
// ]]></script>
<!-- ここまで -->
  • wp-content/themes/default/single.php
<!-- 好きな場所に以下を追加する -->
  • wp-content/themes/default/index.php
<!--?php while (have_posts()) : the_post(); ?-->
<div>id="post-<!--?php the_ID(); ?-->">
<h2></h2>
<small><!--?php the_time(__('F jS, Y', 'kubrick')) ?--> <!-- by <?php the_author() ?> --></small>

<!-- 以下を追加する -->
<!-- while~endwhileの間、the_permalink() よりも後にすること -->

<!-- ここまで -->
<div class="entry"></div>
<!-- 省略 -->

</div>
<!--?php endwhile; ?-->
デザインも頼めるシステム開発会社をお探しならBPS株式会社までどうぞ 開発エンジニア積極採用中です! Ruby on Rails の開発なら実績豊富なBPS

この記事の著者

baba

ゆとりプログラマー。 高校時代から趣味でプログラミングを初め、そのままコードを書き続けて現在に至る。慶應義塾大学環境情報学部(SFC)卒業。BPS設立初期に在学中から参加している最古参メンバーの一人。Ruby on Rails、PHP、Androidアプリ、Windows/Macアプリ、超縦書の開発などを気まぐれにやる。軽度の資格マニアで、情報処理技術者試験(16区分17回 + 情報処理安全確保支援士試験)、技術士(情報工学部門)、Ruby Programmer Gold、AWSソリューションアーキテクト(アソシエイト)、日商簿記2級、漢検準1級などを保有。

babaの書いた記事

夏のTechRachoフェア2019

週刊Railsウォッチ

インフラ

ActiveSupport探訪シリーズ