「フッターにTwitterを埋め込み出来ないかな？」
「簡単にフォロー出来るようなフォローボタンがあったらいいのに･･･」
この記事を読んでいるあなたは、上記のように思っているのではないのでしょうか。
今回は、フッターにTwitterを埋め込む方法についてお伝えしたいと思います。
完成したらブログの見栄えも変わってきますよ(^○^)
Twitterをフッターに埋め込む方法とは
それでは早速、Twitterをフッターに埋め込む方法について解説していきます。
今回はテストサイトを使って解説していきたいと思います。
10分もあれば出来るので、是非やってみて下さいね☆
step
1Twitterのパブリッシュサイトにアクセスする
上記のリンクにアクセルします。
すると、下の画像の画面になります。
step
2ブログに載せたいTwitterのアカウントURLをコピーして入れる
step
3矢印を押して次の画面にする
step
4左側を今回は使うので左側を選択
step
5パブリックサイト選択後は以下の画面になる
step
6選択後は以下の画面になるのでCopy Codeを選択する
step
7ワードプレス画面に移動して外観からウィジェットを選択
step
8Twitterのタイムラインを埋め込むエリアを決定する
今回はサイドバーフッターに埋め込むのでフッター用右ウェジットを選択
注意ポイント
当サイトのテーマはWINGを使用しての画像説明です。
使用するテーマによっては変わってくるので注意して下さい。
step
9好みで表示エリアを決定したらウェジット内にあるテキストを選択
テキスト画面を選択したままカーソル移動をして、フッター右用ウィジェット（3列目）にテキストウィジェットを入れる
それかテキストの矢印からTwitterのタイムラインを埋め込みたいウィジェットを選択して、ウィジェット追加をする
step
10フッター右用にテキストを入れた後は以下のようになる
step
11移動したテキストを開いてテキストタブを開く
注意ポイント
HTMLコードなのでビジュアルタブの状態でHTMLコードを貼り付けても変わらないので注意すること！
step
12step 6でコピーしたコピーコードをテキスト内に貼り付けて保存する
このままの状態だとTweet画像がかなり長くなるので長さを調節したほうが見栄え良く見えます。
高さの調節方法も解説しますね☆
高さ調節とフォローボタンの追加方法
step
1「set customization options」を選択して高さを調節する
step
2高さのみ変更する
高さを変えるだけでも見栄えは良くなるので高さの変更だけで十分かと思います。
step
3任意の高さを入力
当ブログは高さを「480」に変更しています。
入力後は「Update」をクリックして下さい。
step
4変更したコードをコピーする
step
5完成
フォローボタンを追加するには
フォローボタンの追加方法についてもお伝えします。
あなたのサイトを訪れた訪問者があなたを簡単にフォロー出来るようになりますので、やって損はないです！
step
1フォローボタンを追加するには画像の右側を選択
step
2右側の画面を選択したら以下の画面になるので、フォローボタンを追加するために左側を選択する
ポイント
右側にあるボタンは「メンションボタン」といって、前もって決めていたTwitterアカウント宛にTweetを送信できるようにするボタンです！
step
3外観→ウィジェットよりテキスト内にコピーしたコードを貼り付ける
同じテキスト内に貼り付けることも可能だが、今回はあえてウィジェットの中にテキストウィジェットをもう一つ追加して画像のようにする。
step
4コピーしたコードを貼り付けして保存ボタンを押して終了
step
5完成！
赤丸の部分にフォローボタンが設置できました！
フッターの見栄えもだいぶ変わったかと思います。
もしよければ、参考にしてみて下さいね♪