投稿タグをハッシュタグに!TwitterボタンをWPタグでカスタム

ブログ投稿タグをハッシュタグにしてツイートするボタンタグ

ハッシュタグをツイッターで使うメリットは大きい

Twitter、Facebook、Google+、インスタグラムなどのソーシャルでシェアされたブログ投稿についているハッシュタグを見たことがある方も多いと思います。
twitter's tweet hashtag example

特にツイッターは流れの速いフローメディア(:常に情報が流れ続けるメディア)なので、見逃したツイートをチェックする際にハッシュタグを活用しているユーザーさんも多いです。

ですから、ブログ記事に気づいてもらえる確率を少しでもアップさせるためにも、ブログをシェアするツイートには積極的にハッシュタグを含めたいところです。

投稿タグをハッシュタグにしてブログをツイートするには?

ハッシュタグをツイートに付ける方法としては、

  • 記事をシェアをする際に投稿に直接つける
  • プラグイン等で投稿記事を書いた際に付けるハッシュタグを設定する

といった方法があります。

ですが、投稿の際につける方法だと、どなたかがブログ記事を読んでツイートして下さった時にハッシュタグをお願いするというわけには・・・なかなかいかないですよね?

プラグインを入れる方法については、いろいろ調べてみました。

投稿タグ → ハッシュタグに対応しているプラグインに「WP to Twitter」や「Tweetily」があります。

過去記事のツイートも出来て、良いじゃない?と思ったのですが、うまく動かないという記事もちらほら・・今回は見送りましたが、また精査してみようと思います。

Publicize With Hashtags」というプラグインはJetPackのパブリサイズを利用したプラグインで、ツイッターだけでなく、他のかなり多くのソーシャルの投稿にもハッシュタグをつけられます。

ただ、JetPackのパブリサイズを使用するとなると、少々ページ読み込み速度を落とす懸念があります。

上記のような事から、プラグインではなくWordPressテンプレートタグで何とかできないものかと調べてみました。

結果、WordPress → Twitterの場合なら、

ブログ記事につけたタグを自動的にリスト表示する、WordPressテンプレートタグ を ツイッターボタンタグに追加する

ことで、自動で投稿記事につけたタグ → ハッシュタグの投稿が出来ることが判明。

ということで、この先は、そのタグと追加方法について書いています。

まず、「ブログ記事につけたタグを自動的にリスト表示する、WordPressテンプレートタグ」をみていきましょう。

ブログ記事につけたタグを自動的にリスト表示する、WordPressテンプレートタグ:get the tags

以下のページの

WordPress Codex日本語版・テンプレートタグ/get the tags

https://wpdocs.osdn.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC

このページの”使い方”の例にある、タグがほぼそのまま使えます。

ハッシュタグが複数の場合カンマ区切りにする必要があるので、その部分だけ変更すると以下のようになります。

<?php $posttags = get_the_tags(); if ( $posttags ) { foreach ( $posttags as $tag ) { echo $tag->name . ','; 
  }
}
?>

これをツイートボタンタグに適正にはめ込んでいけばOK、というわけです。

では、はめ込みコードを見ていきましょう。

純正ツイッターボタンコード

Twitterボタンのページでツイートボタンを取得すると、ボタンコードの部分は以下のようになります。

<a href="https://twitter.com/share" 
class="twitter-share-button"{count} 
data-url="http://example.com/"
data-via="ユーザー名" 
data-hashtags="ハッシュタグ">Tweet</a>

これをWordPressでハッシュタグを投稿のタグでツイートするのであれば

<a href="https://twitter.com/share" 
class="twitter-share-button"{count} 
data-url="<?php the_permalink(); ?>"
data-text="<?php the_title(); ?>"
data-via="ユーザー名" 
data-hashtags="<?php
$posttags = get_the_tags();
if ( $posttags ) {
 foreach ( $posttags as $tag ) {
 echo $tag->name . ','; 
 }
}
?>">Tweet</a>

とし、ユーザー名を変更していただければOKです。
※念のため、コピペ前には必ず旧タグをテキストなどにコピペしておき一時的にバックアップしておく事をお勧めします。

オリジナルツイッターボタンコード

オリジナルツイッターボタンの場合、ボタンタグにもいろいろあるようですが、よく見かけるコードが以下のものになります。

<a href="http://twitter.com/intent/tweet?text=ツイートしたいテキスト&url=ツイートしたURL&via=ユーザーアカウント" onClick="window.open(encodeURI(decodeURI(this.href)), 'tweetwindow', 'width=550, height=450, personalbar=0, toolbar=0, scrollbars=1, resizable=1' ); return false;">

    `ココにボタン画像URLや、ウェブフォントなどを入れます`

</a>

これにハッシュタグを加えるには、例えば

&hashtags=ハッシュタグ
→ #ハッシュタグ と表示される
&hashtags=WordPress,ツイッター,ソーシャルボタン
→ #WordPress #ツイッター #ソーシャルボタン と表示される

という感じで追加すれば良いので、

&hashtags=<?php $posttags = get_the_tags(); if ( $posttags ) { foreach ( $posttags as $tag ) { echo $tag->name . ','; 
  }
}
?>

をユーザーアカウントの後に追加すればOKです。

したがって、

<a href="http://twitter.com/intent/tweet?text=<?php the_title(); ?> &url=<?php the_permalink(); ?>&via=ユーザーアカウント&hashtags=<?php $posttags = get_the_tags(); if ( $posttags ) { foreach ( $posttags as $tag ) { echo $tag->name . ','; 
  }
}
?>"
onClick="window.open(encodeURI(decodeURI(this.href)), 'tweetwindow', 'width=550, height=450, personalbar=0, toolbar=0, scrollbars=1, resizable=1' ); return false;">

    `ココにボタン画像URLや、ウェブフォントなどを入れます`

</a>

とし、ユーザーアカウントを変更していただければOKです。
※念のため、コピペ前には必ず旧タグをテキストなどにコピペしておき一時的にバックアップしておく事をお勧めします。

ではでは、今日はこの辺で。

「投稿タグをハッシュタグに!TwitterボタンをWPタグでカスタム」の巻でした。

お役に立ちましたら、ツイートなどしていただけるとハッピーです(^^)

Published:2016/01/19

Written by

投稿タグをハッシュタグに!TwitterボタンをWPタグでカスタム」への1件のフィードバック

コメントを残す