オカンTECH

全国のオカンのITリテラシーを底上げだ!

f:id:beaber:20211122011912p:plain
 音楽聞き放題の無料体験もう試した?

はてなブログにTwitterフォローボタンを設置してフォロワー数を表示する方法

 


f:id:beaber:20210628164354p:plain













はてなブログからTwitterアカウントにリンクを貼れるけどフォロワー数を表示することはできるのかしら?

f:id:beaber:20210628164402p:plain







貼り付けるHTMLコードの一部を変えるだけで簡単に表示できるよ

 

このページでは「はてなブログにTwitterのフォローボタン(フォロワー数を表示)を埋め込む方法」を中心に紹介。

フォロワー数を表示しない通常のフォローボタンの埋め込み方と合わせて紹介します。

 

 

教えるのはこんな人
 

f:id:beaber:20211128071130p:plain

おかぺー(@DemoOkan)

 

この記事をおすすめしたい人
  • ブログからTwitterに集客したい
  • Twitterのフォロワー数を目立たせたい
  • フォロワー数非表示版のフォローボタンしか使えない

 

f:id:beaber:20211117154746p:plain

 

はじめに

このブログのコンセプトはオカンに伝わるITブログです。

 

そのため、専門用語など難しい言葉は最大限排除して紹介していきます。それでも分からない表現があれば、問合せフォームかTwitterよりご質問ください。

 

f:id:beaber:20210628164407p:plain







Twitter、コメント欄で感想などいただけると泣いて喜びます!

完成イメージ

 

「はてなブログにTwitterのフォローボタン(フォロワー数を表示)を埋め込む」

 

今回は以下のようなボタンを表示させていきます。

 

 

Twitterフォローボタンの埋め込み手順

まずはデフォルト設定で埋め込む

※この先の手順はパソコンで操作してください。

STEP
Twitter Publishにログイン

Twitter Publishにアクセスする。

https://publish.twitter.com/#

STEP
プロフィールURLを入力
自分のTwitterのプロフィールURLを入力し「→」を押す。
例:https://twitter.com/★ユーザーIDに変更★

f:id:beaber:20211210001821p:plain

STEP
Twitter Buttonsを選択
右側の「Twitter Buttons」を選択する。

f:id:beaber:20211210002105p:plain

STEP
Follow Buttonを選択
左側の「Follow Button」を押す。

f:id:beaber:20211210002246p:plain

STEP
コードをコピー
「Copy Code」を押し、埋め込み用コードをコピーする。

f:id:beaber:20211210002401p:plain

STEP
HTML編集ページを表示
はてなブログの記事編集を開き「HTML編集」を押す。

f:id:beaber:20211114065050p:plain



STEP
コードの貼り付け
先ほどコピーした埋め込み用コードを張り付ける。

f:id:beaber:20211210211944p:plain

STEP
表示確認
プレビューを押し、フォローボタンが表示されていることを確認する。
手順終了です。お疲れさまでした。

f:id:beaber:20211210211958p:plain

 

フォロワー数を表示するためのひと手間

デフォルトの設定では「@〇〇さんをフォロー」というフォローボタンのみが表示されます。このコードのオプションを書き換えてフォロー数を表示させます。

 

STEP
オプション書き換え後のコードを貼る
HTML編集モードに切り替え、以下のようにコードを書き換える。
<a href="https://twitter.com/DemoOkan?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-show-count="false">
 ↓
<a href="https://twitter.com/DemoOkan?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-show-count="true">

f:id:beaber:20211210212438p:plain

STEP
表示確認
プレビューを確認するとフォロー数が表示されています。以上で終了です。お疲れさまでした。

f:id:beaber:20211210212451p:plain

 

 

フォロワー数は権威性になる!?

f:id:beaber:20211210011333p:plain

Googleの評価の指針に有名な「E-A-T」(Expertise(専門性)、Authoritativeness(権威性)、 Trustworthiness(信頼性))があります。

 

このうち、権威性は「誰が言っているのか」を重視しています。

この権威性を測るために、GoogleがSNSのフォロー関係(たとえばインフルエンサーからフォローされているかどうか)を見ている。という噂があります。

 

もし、本当にSNSの中にまでGoogleが踏み込んでいる場合、フォロワー数は権威性の一つになると考えられます。

 

この他、以下の記事で「E-A-T」について複数の仮説を立てていて大変参考になります。

 

oreno-yuigon.hatenablog.com

 

 

まとめ

はてなブログの記事にTwitterのフォローボタンを埋め込むには、Twitter Publish(公式のHTMLコード)を利用します。

さらに、オプションを一部変更することでフォロー数を表示することができます。

 

せっかくSNS運営をしているなら、ブログとSNSで相互にリンクを張って相乗効果を狙いましょう。

 

SNSの他、ブログ運営を始めてから試したこと、実際に収益につながったものは以下の記事で紹介しています。

 

www.okan-tech.com

 

最後までありがとうございました。

オカンTECH

全国のオカンのITリテラシーを向上だ!

プライバシーポリシー
広告関係のお問合せはこちら

©️ 2021 オカンTECH Powered by Hatena Blog