【超簡単】Twitterフォローしてもらうボタンをブログに設置する方法
色んな人のブログやウェブサイトでツイッターをフォローしてもらえるボタンを見かけませんか?
コレ。
↓ ↓ ↓
Follow @KazuOneyあ、これいいな!と思っていても、どうやって作るのか分からない…。そんな時でも最近はネットで検索すると色んな情報を得る事ができますね。
オフィシャルサイトへ設置するために作ってみたのですが、パッと見てTwitterあるんだ!と伝わるのがとてもいいなと思います。手順はすごく簡単だったのでご紹介しますね。
活動をブログやウェブサイトを運営していると、多くの人に情報が伝わったらいいな、Twitterのフォロワーが増えたらいいな!と思いますよね。
フォローボタンを設置したい!と思われる方は、以下にボタンの造り方~設置までをご紹介します。是非参考にしてくださいね。
Twitterフォローしてもらうボタンの設置方法
フォローしてもらうボタンの
設置方法
ワードプレスのテーマやプラグインでもツイッターをフォローするのボタンはありますが、このボタンは記事内にも設置できるので、より読者にTwitterあるよ!って情報を伝えるためには有効かなと思います。
では以下、手順とカスタマイズ方法を解説します。
フォローしてもらうボタン設置の手順
まずは Twitter Publish にアクセスします。英語のサイトですがシンプルなのでビビる必要はありません。
Twitter Publish
https://publish.twitter.com/
①自分のツイッターURLを入力する
アクセスしたらこのような画面に。ここに自分のツイッターのURLを入力します。
上の図は、かずねぇのツイッターURLです。①で示した https://twitter.com/●●●←この部分に自分のアカウントを入力します。
②Twitter Buttons
次の画面では②で示した Twitter Buttons の方を選択します。
③Follow Button
その次は Follow Button の方を選択します。
ここまでが最初の設定です。選ぶだけなので簡単ですね。
ここまでの設定で出来るのがこのボタンです。
↓ ↓ ↓
Follow @Oney_yenOこのボタン、ちょっと細くて指がカサカサしてたりするとタップし難いんですよねぇ…。
すこし大きくしたり表示を変えたりすることもできます。
では次はボタンをカスタマイズしていきます。
④set customization options
ここからは、ボタンの見た目をどうするかを設定するところです。
画面右上の set customization options をクリックします。
⑤名前を表示しない場合
名前を表示したくない場合は Hide Username のチェックボックスに✔マークを入れます。
↓ ↓ ↓
Follow @Oney_yenOシンプルなボタンになりましたね。
⑥ボタンを少し大きく表示したい場合
ボタンを少し大きく表示したい場合は、Large Button にチェック✔を入れます。
↓ ↓ ↓
Follow @KazuOney少し縦幅が広りました!タップしやすくなりますね。
⑦表示言語を指定する
環境でAutomaticでは日本語で表示されない場合は Japaneseを選択します。
⑧表示言語
基本的には表示されている言語が自動で選択されるようです。日本語に表示されない環境の場合は、Japanese に指定します。写真では英語のボタンですが、サイトに貼るとこのように日本語に変換されるのでAutomaticで大丈夫です。
⑨コードをコピーします
矢印で示したCopy Codeをクリックします。
⑩画面を閉じます
×をクリックして画面を閉じます。
自分のサイトにコードを貼る
コピーしたコードをサイトに貼ったら出来上がり!
色々作ってみました。
↓ ↓ ↓
Follow @KazuOney
Follow @Oney_yenO
Follow @Oney_yenO
Follow @Oney_yenO
押すなよ…絶対押すなよ!
…ほんとは押してほしい(笑)最近はすっかりツイッター民です。このブログの事や色々つぶやいています。良かったらフォローしてね♪
ツイッターのフォローしてもらうボタンの造り方と設置方法をご紹介しました。
関連書籍
これからSNSを活用したい大人の方に。