WordPressのログイン時のツールバー

WordPress

WordPressのトップページ(index.php)で公式ツイートボタンのURLを各記事別になるようにする設定方法

ちょっとした備忘録です。WordPressのトップページで公式ツイートボタンをプラグインなどを使わないで表示させる場合、どのボタンを押しても全部がトップページのURLになってしまいます。普通に記事単体のページにつけた公式ツイートボタンはちゃんとその記事のURLを反映してくれるので、トップページの場合、各記事のパーマリンクの設定がされてないのが原因みたいですね。

[ads_center]

各記事別のURLを反映させる

ということで、ツイートボタンを表示させるコードをfunctions.phpに書いている場合のやり方です。

// Twitter
function twitter_button() {
    echo '<li><a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-text="RT @ユーザー名 :';
    the_title();
    echo '" data-url="';
    the_permalink();
    echo '" data-lang="en">Tweet</a></li>';
}

フッターなどに以下も記述しておきます。

<script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>

あとはボタンを表示させたい場所に以下を追加すればOKです。

<?php twitter_button(); ?>

で、重要なポイントとしてはtwitter_button内にあるdata-urlです。これにthe_permalink()を設定しておかないとトップページの場合、各記事URLが反映されません。ツイッター公式サイトからコードを取得してもデフォルトでは入ってなかったので追加しておく必要があります。

これで、トップページからの各記事のボタンをクリックしてツイートする場合でも、ちゃんとその記事URLを挿入してくれるようになります。

参考サイト

関連記事

  1. WordPress

    WordPressで「この記事の所要時間」という読了時間を表示させてくれるプラグイン「estimat…

    とても便利なWordPressのプラグインを発見したので備忘録です。よ…

  2. WordPressの自動バックグラウンド更新

    WordPress

    WordPressで複数のウィジェットを表示させるやり方

    WordPressのウィジェットってとても便利ですよね。ドラッグ&ドロ…

  3. WordPress

    WordPressでウィジェットのアーカイブを一発でドロップダウンにする超簡単な方法

    知らなかったですこれ。前からずっとアーカイブをドロップダウンにできない…

  4. WordPress

    WordPressでコメント欄などに表示されるアバター「Gravatar」に登録してみる

    毎回、今更感全開の記事ですが時間が少しあったのでGravatarに登録…

  5. WordPressにPocketボタンを設置

    WordPress

    WordPressにPocketボタンを設置するやり方

    そういえばPocketのボタンをまだ設置していなかったので、このたび設…

コメント

    • kiyocom
    • 2012年 7月 01日

    はじめまして、こんにちは。
    ツイートボタンの挿入方法を検索しており、貴殿のサイトに辿り着きました。

    記事中に記載されている様にツイッター公式サイトからコードを取得しました。

    <a href=”https://twitter.com/share” rel=”nofollow”>ツイート</a>
    !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”);

    各記事へのURLを挿入して表示させるには上記のどこにthe_permalink()を記載すれば良いのか教えて頂けないでしょうか?
    何卒、宜しくお願いいたします。

    • kiyocomさん、はじめまして!
      コメントありがとうございます。

      トップページにボタンを置いて各記事のURLを対応させたい場合は<a>タグの属性に data-url をつける必要があります。
      なので、この data-url に the_permalink() をつければOKかと思います。

      <a href=https://twitter.com/share” rel=”nofollow” data-url=”<?php the_permalink(); ?>”>

  1. この記事へのトラックバックはありません。

最近の記事

  1. mill オイルヒーター
  2. Anker PowerWave 10 Pad & Stand セット

アーカイブ

PAGE TOP