[`yahoo` not found]
Pocket

images ワードプレスのサイドバーにツイッターを表示させる方法を解説します。
専門用語では、twitter タイムラインの『埋め込み』と言います。
このキーワードで検索すると設定方法が出てきます。

ツイッターからタイムライン用のHTMLコードを取得する方法


ツイッターアカウントのプロフィール画面から、画面右上の
「プロフィールと設定」をクリック、

g1wd74mvvjf0iuz1475232837_1475232921
さらに「設定」を開きます。

bandicam-2016-09-30-19-43-58-095

ユーザー情報の画面が表示されたら、
画面左下のメニューから「ウィジェット」を開きます。

bandicam-2016-09-30-19-45-52-114

画面右上「新規作成」ボタンを押し、「プロフィール」開きます。

bandicam-2016-09-30-20-06-33-090
「何を埋め込むしたいと思いますか?」と表示されます。

この画面が表示されたら、
あなたのツイッターの「プロフィール」画面のURLを
ブラウザの一番上からコピペして、
「Enter a Twitter URL 」と記載された欄に書き込みます。

bandicam-2016-10-01-01-38-10-026

赤枠のURLをコピーして、「何を埋め込むしたいと思いますか?」画面の
「Enter a Twitter URL 」と記載された欄に貼り付けます。

0bkcuskwt71o_ly1475279556_1475279613
以下の様に貼り付けたら、画面を下に移動します。

bandicam-2016-10-01-08-59-09-079
「ここにあなたの表示オプションがあります。」の画面では、
「埋め込みタイムライン」をクリックします。

bandicam-2016-10-01-09-02-37-638
画面下の方にタイムライン用のHTMLコードが作成されました。
「コードのコピー」をクリックして、HTMLコードをコピーします。

agw3n6gvyinvm3d1475283823_1475284143

「コピーされました!」と表示されます。

bandicam-2016-10-01-09-17-03-978

ワードプレスのウィジェットにタイムライン用のHTMLコードを埋め込む方法


ダッシュボードメニューバーから、「外観」⇒「ウィジェット」

bandicam-2016-09-30-19-19-34-145

「ウィジェット」の画面左側の項目の中から「テキスト」をクリック。

bandicam-2016-09-30-19-20-20-320

サブコンテンツが表示されたら、「ウィジェットを追加」をクリック。

bandicam-2016-09-30-19-20-33-848
画面右側、サブコンテンツ(サイドバー)にテキストの項目が表示されますので、
開きます。

bandicam-2016-10-01-00-02-00-193
「タイトル」にTwitterと記入。さらに、「内容」の部分に、
先ほど取得したタイムライン用のHTMLコード貼り付けて、「保存」を
クリックします。

bandicam-2016-10-01-02-00-50-533

これでサイドバーにツイッタータイムラインが設置されました。

bandicam-2016-10-01-02-02-49-217
しかしこれだと、ツイートを繰り返すたびに全部表示されるために、
以下の画像の様にタイムラインの表示がどんどん縦長になってしまいます。
画像を見ると画面限界まで表示されています。



そこで先ほどのウィジェットの設定画面を開いて、
タイムラインのピクセル(サイズ)を設定するタグを追加記入します。
最小幅180ピクセル、最大幅520ピクセルまで設定出来ます。

width=は”横幅”
height=”縦幅”を示します。

width=”300″
height=”520″で入力します。

以下の画像のようにコードを書き換えます。



ウィジェットの編集画面は以下のようになります。



内容を保存すると画面に反映されます。



埋め込んだツイッターのタイムラインが適切な長さになりました。
これでタイムラインの画面を上下に移動させて読めるようになりました。
設置作業はこれで完了です。

ツイッターの書き込みは頻繁に更新されるものなので、
タイムラインが表示されることにより、
サイトが更新されているという感じがします。

このようにしてツイッターから閲覧者を誘導し、
検索エンジン以外からの閲覧者も増やしていきましょう。

※ワードプレスもツイッターも細かい設定方法は頻繁に新しくなるので、
設定方法を解説した記事はすぐに古くなってしまいます。
常に、新しい情報を取り入れるようにしましょう。

[`yahoo` not found]
Pocket