こんにちは！テツです！
ブログを運営している方はTwitterをしているという方が多いのではないでしょうか。
私もその一人でTwitterを活用して、ブログの記事の宣伝や日々の積み上げなどをツイートしています。
ブログをカスタマイズ、デザインするうえで自身のTwitterのタイムラインをサイドバーに埋め込みたいと考えている人がいると思います。
そこで、この記事では「ブログのサイドバーにTwitterのタイムラインを簡単に埋め込む方法」を紹介します。
この記事で分かること
- 埋め込みコードの作成方法
- ブログのサイドバーにコードを埋め込む方法
Twitterのタイムラインの埋め込みコード作成方法
コードの作成方法を画像付きで説明しています。
まずは以下のURLをクリックしてください。
そして、自身の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分ほどだと思うので、素敵なブログを作るためにぜひやってみてください。
ではでは
コメント