ワードプレス＋SimplicityでのTwitterのフォローボタンにリンクを貼る方法です。Twitterフォローボタンは最初から用意してあるのですが、私はリンクの貼り方がわからなかったのでご紹介します。
どんなことができるようになるの？
Twitterフォローボタンを表示させ、ボタンをクリックすると、指定アカウントのTwitterページが表示できます。
Twitterフォローボタン用ソースコードをTwitter公式サイトから取得する。
公式サイトの画面を下へスクロールしてTwitterBottonsをクリックします。
FollowButtonをクリックします。
アカウント入力画面で@から始まるアカウント名を入力してPreviewボタンをクリックします。
アカウントが正しく検索されるとThat’s all we need, unless you’d like to set customization options.という文字の下にソースコードが表示されます。
CopyCodeボタンをクリックします。
これでソースコード取得は完了です。
テキストエディタでTwitterフォローボタン用ソースコードの一部をコピーする。
テキストエディタなどにソースコードを貼り付けて、Twitterフォローボタン用ソースコードの一部をコピーします。
サンプルとして私のTwitterアカウント用のソースコードを以下に示します。赤字の部分がコピー対象です。
<a href=”https://twitter.com/fly_sky_high_99?ref_src=twsrc%5Etfw” class=”twitter-follow-button” data-show-count=”false”>Follow @fly_sky_high_99</a><script async src=”https://platform.twitter.com/widgets.js” charset=”utf-8″></script>
ワードプレスでTwitterフォローボタン用ソースコードを設定する。
ワードプレスの画面に戻ります。
ワードプレスのメニューで、外観→カスタマイズ→SNSまで開き、以下を探してください。
twitter.com/XXXXXXX
TwitterページURLのXXXXXXX部分を入力してください。＠は不要です。
さきほどコピーした文字を貼り付けます。
fly_sky_high_99?ref_src=twsrc%5Etfw
全フォローボタンの表示全てのフォローボタンの表示を切り替えます。にチェックが入っていることを確認してください。
公開ボタンをクリックします。
これで完了です。実際のサイトでTwitterフォローボタンが表示され、ボタンをクリックするとTwitterページが表示されることを確認しましょう。