プラグインなしで超簡単!WordPressのサイドバーにTwitterを埋め込む方法!
「本サイトのコンテンツには、商品プロモーションが含まれています」

ブログを見ていると、サイドバーにTwitterのタイムラインを埋め込んでいるものをよく見かけませんか?

 

ブログとTwitter連携すれば、ブログからTwitterの流入も見込めるし、私もやりたい!そう思いチャレンジしてみました。

 

難しい設定が必要なのかな?と思いましたが、プラグインなしたったの3ステップで超簡単にできました。

 

WordPressで作成したブログのサイドバーに、Twitterのタイムライを埋め込みたい方必見です!

 

ただ設定画面は英語がたくさん出てくるので、英語が苦手な人はちょっと難しいかもしれません。

 

でもこの記事通りにやれば、誰でも簡単にブログのサイドバーにTwitterのタイムラインを埋め込むことができますよ。それではやり方を詳しく説明しますね!

ステップ1 自分のTwitterのURLを表示する

まずは自分のTwitterURLを表示させます

 

パソコンでTwitterにログインし、自分のプロフィールを開きます。すると自分のTwitterのURLを確認することができます。

ページはそのまま開いておきましょう。

ステップ2 Twitter Publishでコードを取得する

Twitter Publishで埋め込みコードを取得します。

 

Twitter Publish にアクセスします。

↓ここをクリック

自分のTwitterとは別ウインドウを開きましょう!

Twitter Publishを開くと、上の画像の画面が出てきます。What would you like embed?(何を埋め込みたいですか?)の下の欄に、ステップ1で開いた自分のTwitterのURLをコピペします。

 

Enterを押します。

Here are your diplay options(表示オプションは次の通りです)と表示されます。

 

タイムラインを埋め込むので、左側のEmbedded Timelineを選択します。

set customization optionsをクリックします。

Height(px)に好きな数値を入力

サイドバーに表示する高さ(Heights)なので、600〜800の間がおすすめです。

デザインは、「Light」「Dark」を選べます。お好きな方をどうぞ。

「Language」は「Japanese」を選択。

「Update」をクリックします。

「Copy Code」をクリックしてコードをコピーします。

 

これで、Twitterの埋め込みコードをコピー(取得)できました!

 

次に、コピーしたコードをWordPressに設置します。

スポンサーリンク

ステップ3 コードをWordPressに設置する

WordPressの管理画面を開きます。

ダッシュボードの「外観」のなかの「ウィジェット」をクリックします。

利用できるウィジェットが並んでいます。下の方にスクロールしていきます。

テキストをクリック。

メインサイドバーを選択して、ウィジェットを追加をクリックします。

「メインサイドバー」に「テキスト」のウイジェットが追加されました。

 

「テキスト」のウイジェットはドラッグ&ドロップで好きな位置に移動できます。

 

もう少しです!頑張りましょう!

 

テキストをクリックします。

「タイトル」〇〇のTwitterなど入れます。

「テキスト」のタブを選択。

ステップ2でコピーした、Twitterの埋め込みコードを貼り付けます

完了をクリック。

 

これで、WordPressのサイドバーにTwitterを埋め込むことができました!

 

ページをプレビューしてみてください。ちゃんと埋め込まれているはずです。お疲れ様でした!

まとめ

使っているWordPressのテーマによって、ウィジェットの表示も変わってくると思いますが、基本的な操作は同じです。

初心者にもおすすめ。WordPressのテーマはこちら。このサイトも「DIVER」を使用しています。

詳しくは公式サイトをチェックしてくださいね!ブログで稼ぎたい!と思う方にもおすすめです!

↓ここをクリック

アフィリエイター収益最大化!最新SEO対策済み!wordpressテーマ「Diver」

 

WordPressのサイドバーにTwitterを表示させるのは、プラグインも使わず簡単にできました!

もう一度手順をおさらいします。

 

1 自分のTwitterのURLをコピー

2 Twitter Publishで埋め込みコードを作成

3 ウィジェットに埋め込みコードを貼り付け

 

以上3ステップで簡単にできますよ!ぜひチャレンジしてみてくださいね。

おすすめの記事