こちらの記事では、ワードプレスのサイドバーにTwitterを表示させる方法を解説します。

 

少し前まではプラグインを使わなければできなかったのですが、現在はプラグインを使わずに設定ができるようになりました!

 

TwitterをWordPressのサイドバーにプラグイン無しで埋め込む方法を動画で解説!

下準備として

  • Twitterにログインしておいてください。
    (アカウントを複数持っている場合は、WordPressに埋め込みたいアカウントでログイン)

 

WordPressの画面で設定をする以外に

TwitterをWordPressのサイドバーにプラグイン無しで埋め込む方法を画像で解説!

ツイッターにログインしておく

  • Twitterにログインしておいてください。

アカウントを複数持っている場合は、WordPressに埋め込みたいアカウントでログインしておいてください。

Twitter Publishでコードを取得

Twitter Publishにアクセス

What would you like to embed?と表示されています。

Twitterをワードプレスのサイドバーにプラグイン無しで埋め込む方法

環境によっては日本語で「何を埋め込みたいですか?」と表示されることもあります。

 

下記の状況に応じて操作を行ってください

状況 操作
自分のTwitterアカウントが自動で表示されている URLが正しいか念のため確認
自動で表示されていない 先ほどログインしておいたツイッターの画面から自分のURLをコピーしてきてペースト 

 

「エンター」キーを押下

Here are your display optionsと表示されています。

Twitterをワードプレスのサイドバーにプラグイン無しで埋め込む方法

日本語で「表示オプションは次のとおりです」と表示されることもあります。

 

下記2通りから選ぶことができるので、埋め込みたい方をクリック

左側 右側
Twitterのタイムラインが埋め込まれる
(こちらがオススメです)
Twitterの”フェイス部分”が埋め込まれる

 

当記事では、左側(オススメ)をクリックしたという前提で解説を進めます。

Twitterをワードプレスのサイドバーにプラグイン無しで埋め込む方法

「set customization options」をクリック

日本語で「カスタマイズオプションを設定する。」と表示されることもあります。

 

Twitterをワードプレスのサイドバーにプラグイン無しで埋め込む方法

「Height」に好きな数値を入力。

 

この数値はサイドバーに表示させる時の高さですが、おすすめの数値は600〜800ぐらいです。

私は、あまり長いとバランスが良くないように思えたので600にしています。

色々試してみてくださいね。

 

「Update」をクリック

日本語で「更新」と表示されることもあります。

 

Twitterをワードプレスのサイドバーにプラグイン無しで埋め込む方法

「Copy Code」をクリック

日本語で「コードをコピーする」と表示されることもあります。

 

これで、コードが取得(コピー)できました!

続いて、WordPressのサイドバーにTwitterを設置していきます。

ワードプレスに貼り付け

WordPressのダッシュボードの

「外観」をポイント
 ↓
「ウィジェット」をクリック

 

画面左下の方にある「テキスト」というボックスを右側へドラッグ&ドロップ

 

右側へドラッグ&ドロップすることで、ブログのサイドバーにその項目を表示させることができます。

WordPressのウィジェットは、左側にある項目のボックスを右側へ移動させることで「サイドバーに表示させる」と認識するためです。
逆にサイドバーから消したい項目があれば、右側にある項目を左へドラッグ&ドロップすることで表示させないようにできます。

 

サイドバー内の表示位置は上下にドラッグすることで好きな位置に設置することができます。

 

 

ウィジェット内での上下位置がそのままサイドバーでの上下位置になります。

 

Twitterをワードプレスのサイドバーにプラグイン無しで埋め込む方法

タイトル欄にTwitterやツイッターなどと入力

「テキスト」タブをクリック

Twitterをワードプレスのサイドバーにプラグイン無しで埋め込む方法

先ほど取得(コピー)してきたコードをペースト

「保存」をクリック

 

これで、プラグインを使わずにWordPressのサイドバーにTwitterを埋め込むことが出来ました!

コメントを付けたい場合

もし、このような感じ↓にコメントを入れたい場合は…

Twitterをワードプレスのサイドバーにプラグイン無しで表示させる方法

 

ビジュアルタブをクリックし…Twitterをワードプレスのサイドバーにプラグイン無しで表示させる方法

入れたいコメントを入力

 

保存をクリック

 

これでサイドバーにコメント付きでTwitterを埋め込むことができました!

プレビューで確認してみてくださいね。

さいごに

ワードプレスのサイドバーにTwitterを表示させるのはプラグインを使わなくても簡単にできましたね。

 

手順は

  1. Twitterにログインしておく
  2. Twitter publishでコードを取得
  3. コードをWordPressのウィジェットに貼り付け

です!

 

WordPressに導入するプラグインは1つでも少ないに越したことはないので、この方法で設定するのはとてもオススメです!

 

関連記事

WordPressサイドバーにプロフィール&画像を簡単に設置する方法!

YouTubeチャンネル登録ボタンをWordPressサイドバーに埋め込む方法!