ワードプレスでサイドバーにTwitterを表示させる方法

どうもこんにちは、生クリームです。

人様のブログを見ていると、サイドバーにTwitterが表示されているのを見たことはありませんか？

ブログを始めてしばらくは、人のブログを見ていると「こんなことできるのか」とか、「こういったサイトいいな」とか思うこともあると思います。私の場合は自分の「ブログにTwitter表示したいな・・」でした。

ちなみにブログにツイッターを提携させるメリットは、アクセスアップにつなげるメリットともう一つあって、最終的にはSEOにも影響して来ます。
誰も来ないブログよりも、人に見てもらえるブログの方が自分のモチベーションのためにもなりますし、難しい設定でもないので簡単に登録することができます。

なのでこのページでは、ブログにTwitterを提携する手順を紹介していきますので、ぜひ設定してみてください。

ブログにTwitterを提携する手順は2つ！

それでは早速、自分のブログにTwitterを提携する手順を紹介していきます！

難しいことはないので、ぜひ見ながらやってみてくださいね。

自分のブログとTwitterを提携する手順は

の2つになります。簡単なので、設定もすぐに終わりますよ。

それでは設定していきましょう。

TwitterのURLの確認

まずは自分のTwitterアカウントでログインし、TwitterのURLを確認しておきます。後々使うことになるので、メモ帳などにコピーしておいても構いません。

Twitterのウィジェット作成

続いて、Twitterのウィジェットを作成してきます。

Twitterの自分のアイコンをクリックし、設定とプライバシーを開きます。

Twitter管理画面が左側に開きます。管理画面の下の方に、「ウィジェット」という項目があるのでそれを開きます。

ウィジェットを開くと、上のような画面になるので赤枠部分の新規作成をクリックします。

メニューの小窓が表示されるので、「プロフィール」を選択します。

ツイッターURLの貼り付け

Twitterの専用画面が表示されるので、先ほど確認した自分のTwitterのURLをここに貼り付けしましょう。

自分のURLを貼り付けたら、「⇒マーク」をクリックします。

カスタマイズ設定

左のタイムライン(Embedded Timeline)を選択し、赤枠部分をクリックします。

赤枠部分が、ブログへのTwitter埋め込み時の高さの設定です。400ぐらいからお好きなサイズを入力しましょう。

ちなみに横幅(Width)は入力しなくても問題ありません。

Updateで設定を保存

入力し終えたら「Update」をクリックしましょう。

元の専用入力画面に戻ります。

Twitterのコードをブログに埋め込もう！埋め込み用HTMLコードのコピー

先ほどのカスタマイズオプションの下にHTMLコードが表示されていると思います。

その右側にある「Copy code」をクリック。

上のような画面が表示されたら、埋め込み用コードがコピーされました。

次は、このコードを使ってワードプレスの設定をしていきます。

ワードプレスウィジェットの設定

ワードプレスの管理画面を開き、外観⇒ウィジェットへアクセスしましょう。

利用できるウィジェットの中からテキストをドラッグ&ドロップでサイドバーエリアへ移動します。

サイドバーウィジェットのエリアへテキストを移動したら、先ほどコピーしたTwitter埋め込みコードを貼り付けます。赤枠部分へ貼り付けです。

タイトルには、「Twitter」と入力しておきましょう。あとで、どのテキストがTwitterのコードテキストかわかるようになりますので。

入力し終えたら、保存⇒完了をクリックします。

これで、Twitterでツイートしたものが埋め込み表示されているはずです。

自分のブログを確認してみましょう！

このようになっていれば設定は完了です。

ウィジェットの編集をする時、レンタルサーバーロリポップを使っているという人は完了にならないで読み込みのまま止まってしまうことがあります。

原因は、ロリポップのWAF設定かもしれません。

こちらの記事で紹介しているので参考にしてみてください。

アドセンスの広告がいつまで経っても貼れない時に確認すること

2018.05.30

アドセンスの広告がいつまで経っても貼れない！ WordPressでグーグルアドセンスの審査に合格したものの、肝心の広告が貼れなかったら慌ててしまいます。ただでさえやり方があやふや...

まとめ

自分のブログにTwitterを表示させる方法について紹介してきました。

Twitterの埋め込む設定方法は、

たったこれだけです。

Twitterのブログへの埋め込み設定はこのように凄く簡単です。まだ設定していない人はこの機会に設定してみてください。

これでまた一つ、自分のブログを知ってもらうキッカケになるかもしれません。

ちなみに、ワードプレス側のウィジェット内で、テキストの位置を変更することで好きな場所へ埋め込むことが可能です。お好きな場所へ埋め込んでみましょう。

今回はこれにて終了です。お疲れ様でした(*'▽')

ブログで記事を書く時、装飾するのが好きでタグの入力が面倒！

そんな時は、プラグイン「TinyMCE Advanced」を導入すると簡単に解決します。

記事を書くのが楽しくなると思いますよ！

TinyMCE Advanced導入！WordPressを無料ブログのように使いやすくする！

2018.02.18

無料ブログで記事を書く時って、文字の色を変更したり文字サイズを変更したり簡単にできますよね。 それなのにWordPressだと、ある程度のHTMLの知識が必要になってきます。 ...