【WordPress】ツイートボタンを押すと自分へのメンションが付くように設定してみました

青い鳥
Twitterの鳥っぽい?ガーナの青い鳥。
こちらのブログ、まだほとんどアクセスがありませんので、今のうちに土台を整えておこうと日々あれこれ試しております。
今日はツイートボタンの改善。絶賛愛読中の「Web論」からまたまた真似をさせていただきました。でろりんさん、ありがとうございます。

ツイートしてもらったときに、記事・URLに加えて@付きの自分のアカウントを入れる

ブログの記事を読んで面白かったとか、後で参照したいとかっていうときに、Twitterでつぶやいておくっていうのは良くある事だと思います。ただ、自分でタイトルやURLをコピーして、Twitterのソフトを開いて(あるいはブラウザでTwitterのページを開いて)コピーしてつぶやくというのはかなりの手間。 そんなときにツイートボタンがあれば簡単に記事についてつぶやくことができてとっても便利です。

このブログのテーマであるSTINGER3には、標準で各種SNSにシェアできるボタンが表示される設定になっています。まさにいたれりつくせり。 この中のTwitterボタン、クリックすると記事タイトルとURLが自動で入ってつぶやける設定になっています。 しかし、でろりんさんのこちらの記事を読んだら、これは「@自分のTwitteアカウント」も絶対入れるべきだと思ってしまいました。

ブログのツイートボタンは自分への@付きで設置すると過去記事の言及に気付けて改めてバズらせるきっかけにもなるよって話 | Web論

 

 

でろりんさんによれば、「もうずっと昔に書いた記事が突然ツイートされた際に「その題材が今話題になっている可能性」が隠れていたりします。」とのこと。そうしたときに自分へのメンションが付いていれば簡単に気がつけます。 私のブログはまだ過去記事の蓄積がないのですが、いずれ時間が経ったときに効いてくる(はず)。いずれでろりんさんのように「かなーり昔に書いた記事の反応が分かる」という気分を味わえたらいいですね。

やりかた

さてではどうやってツイートボタンに自分の@を入れることができるのでしょうか?

上記の記事にツイートボタンの記述方法が紹介されていますので、アカウント部分だけ変えてWordPressの記事のどこかに貼ればよいのだそうです。 しかし、私がテーマとして使っているSTINGER3では、すでにTwitterを始めとするSNSボタンが標準でついています。ですので、このSNSボタンを編集する必要がありそうです。

正直、CSSもHTMLもほとんど分からないので、体当たりでやってみます。

まずでろりんさんが紹介してくれている次の記述を自分向けに手を加えます。私の場合、自分のツイッターアカウントのtommasteroflifeを一番最後の行に書きます。@はいらないそう。 それからボタンは英語のままがよかったので、最後の</a>の前は英語でTwitterにしておきました。カタカナで表示させたい場合はツイートって書いておけばいいと思います。

1 <a href="https://twitter.com/share" class="twitter-share-button" data-url="<?php the_permalink(); ?>" data-text="<?php the_title(); ?>" data-count="vertical" data-lang="en" data-via=“tommasteroflife”>Twitter</a>
これをコピーしておきます。 次にWordPressのダッシュボードの「外観」から「テーマ編集」を選択。STINGER3を使っていると、出てきた画面の右側の下の方、スタイルってかいてあるすぐ上の二つがSNSボタンの編集。 まず一つ目のsns.phpを選びましょう。 そしてさっきコピーしたので、ここの部分を置き換えてしまいます。こんな感じ。 メンション
data-viaあたり以外にももともと書いてあったのと若干違う所もあるのですが、支障がなさそうだったので良しとしました。 STINGER3には、個別記事の下部に表示されるSNSボタン以外に、どの画面を表示しても必ず表示されているSNSボタンがあります。こちらの方がおそらくsns02.phpの方。 ということで、sns02.phpを選択して、上記と同じような場所に、コピーしたものをはっていきます。こちらはなぜか二カ所にあるので、二カ所とも変えておきます。(なんでかはよく分かりません・・・。)

結果

自分のサイトを表示してみてます。そして個別記事の下のTweetボタンを押してみます。 メンション2ということで、無事にツイートの中に@メンションを入れることができました。

でろりんさん、ありがとうございました!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です