ブログのサイドバーにTwitterのタイムラインを簡単に埋め込む方法

ブログ

こんにちは!テツです!

ブログを運営している方はTwitterをしているという方が多いのではないでしょうか。

私もその一人でTwitterを活用して、ブログの記事の宣伝や日々の積み上げなどをツイートしています。

 

ブログをカスタマイズ、デザインするうえで自身のTwitterのタイムラインをサイドバーに埋め込みたいと考えている人がいると思います。

そこで、この記事では「ブログのサイドバーにTwitterのタイムラインを簡単に埋め込む方法」を紹介します。

この記事で分かること

  • 埋め込みコードの作成方法
  • ブログのサイドバーにコードを埋め込む方法
スポンサーリンク

Twitterのタイムラインの埋め込みコード作成方法

コードの作成方法を画像付きで説明しています。

 

まずは以下のURLをクリックしてください。

Twitter Publish

そして、自身のTwitterアカウントのURLをコピペし、エンターキーを押してください。

※自身のプロフィール画面のURLをコピーしてください。

 

次に、画面の左の「Embedded Timeline」をクリックします。

 

すると、以下のような表示が出てきます。

 

青く表示されている「set customization options」をクリックすると、タイムラインの設定をすることができます。

  • 高さ(Height)と幅(Width)を設定できます。(自由に設定できますが、私は高さを600、幅を350に設定しています。)
  • デザインはLightまたはDarkから選べます。(お好みでどうぞ。)
  • 言語はJapaneseを選択してください。

以上、設定し終えたら「Update」をクリックします。

 

すると、コードが生成されるので、これを各ブログのサイドバーに貼り付ければ作業完了です。

ここより先では、私がブログ運営しているWordPressはてなブログについてその後の設定方法を説明します。

WordPressのサイドバーにTwitterのタイムラインを表示

まずはWordPressでの表示方法です。

WordPressのダッシュボードから「外観」→「ウイジェット」と進みます。

そして、「カスタムHTML」を選択し、「サイドバーウイジェット」を選択し、ウイジェットを追加を押します。

そして、先ほど作成したコードを貼り付ければ、作業完了です。

サイドバーのどの位置に表示させるかはご自由に決めてください。

 

はてなブログのサイドバーにTwitterのタイムラインを表示

続いて、はてなブログでの表示方法です。

ダッシュボードから「デザイン」→「カスタマイズ」→「サイドバー」と進み、モジュールを追加をクリックします。

そして、「HTML」を選択し、タイトル下の欄に先ほど作成したコードを貼り付け、「適用」→「設定を保存する」をクリックすれば、作業完了です。

タイトルはTwitterなどとつければ良いでしょう。

サイドバーのどの位置に表示させるかはご自由に決めてください。

 

今回はTwitterのタイムラインをブログ内のサイドバーに表示する方法を紹介しました。

とても簡単にでき、作業時間は3分ほどだと思うので、素敵なブログを作るためにぜひやってみてください。

ではでは

コメント

タイトルとURLをコピーしました