Twitterのフォローボタンを簡単にサイトに設置する方法
どうも、こんにちは。
Webデザイナーのなお(@ENOWL_Nao)です。
今回は簡単にTwitterのフォローボタンを作成してページに埋め込む方法をご紹介したいと思います。
↓こんな感じのボタンを設定することができます。
試しにフォローしてみてください。笑
HTMLとかCSSなど難しいことは分からない…。という方でも
簡単に記事内に埋め込むことができるので、フォロワーを増やしたいと思っている方にオススメです。
では、やっていきましょう!
Twitterのフォローボタンの作成
まずは下のURLからフォローボタンを作成していきたいと思います。
リンク先に飛ぶと下のようなページにいくと思うので、ちょっと下にスクロールしてください。

すると3つ選択する画面があります。
一番右側の「Twitter Buttions」を選択してください。

どのボタンを作成するかを選択する画面が表示されます。
右から二番目の「Follow Button」を選択してください。

次に赤枠にTwitter URLを入力してください。
入力が完了したら青枠の「Preview」をクリックしてください。

すると画面が切り替わってボタンが作成されました。

これでボタンが作成できました。
ここから記事へ設置する作業に入るのですが、ボタンを少しカスタマイズすることができます。
なので、ここでカスタマイズについて説明してから次の章で記事への設置方法について説明したいと思います。
ボタンのカスタマイズ
では、カスタマイズについてご紹介します。
ちょっと分かりづらいかもしれませんが、赤枠の「set customization options.」クリックしてください。

クリックすると画面が切り替わります。
それぞれ説明したいと思います。

チェックを入れるとアカウント名を非表示にできます。


チェックを入れるとボタンを少し大きくできます。
ちなみに記事冒頭のフォローボタンは「チェックあり」です。


これは基本的に「Automatic」でいいかと思います。
自動で言語を判断して変更してくれるみたいです。


カスタマイズが完了したら青矢印の「Update」ボタンをクリックしてください。
先程の画面に戻ります。
ボタンを日本語にしてボタンのサイズも大きくしてみました。

WordPressの記事への設置
ここからは実際に記事へ配置する方法をご紹介します。
「Copy Code」をクリックしてください。


↑こんな画面が出て、コードがコピーされます。
次にWordPressの記事制作画面に移動してください。
ブロックから「カスタムHTML」を選択してください。

赤枠部分(HTMLを入力…)に先程コピーしたコードを貼り付けてください。

貼り付けると下のような感じになります。

記事を保存して確認してみてください。
↓埋め込めたかと思います。
まとめ
Twitterのフォローボタンを記事に埋め込む方法でした。
記事の冒頭の挨拶部分などで入れたりするとフォローしてくれるかもしれませんね。
簡単に埋め込みができますので、ぜひ試してみてください。
ここまで読んでいただきありがとうございました!


