【WordPress初心者】(2017年12月更新)SimplicityでTwitterフォローボタンのリンクを設定する方法

★記事が気に入ってくれたらシェア♪

ワードプレス+SimplicityでのTwitterのフォローボタンにリンクを貼る方法です。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ページが表示されることを確認しましょう。

スポンサーリンク
グーグルアドセンス広告(PC用)
グーグルアドセンス広告(PC用)

★記事が気に入ってくれたらシェア♪

★フォローはこちら