ホームページにTwitterタイムラインを設置する方法
ホームページ
2016.01.25
自信のタイムラインを埋め込むことができるのをご存知でしょうか?
今回はホームページ上にタイムラインを設置する方法をご紹介します。
ウィジェットの作成
Twitterのタイムラインをホームページ上に設置するには、
Twitterが提供するウィジェットというものを作成する必要があります。
まずTwitterにログインし、アイコン画像をクリックしましょう。
メニューが出てくるので「設定」をクリックします。
設定画面が表示されます。
左のメニューの下から二番目の「ウィジェット」をクリックします。
ウィジェット作成画面が表示されます。
ウィジェットは大きく分けて5パターンあります。
1.ユーザータイムライン
タイムラインを表示します。
ユーザー名にはデフォルトで自分のユーザー名が入力されていますが、
Aさんのタイムラインを埋め込みたい場合、Aさんのユーザー名を設定すればサイトに埋め込むことができます。
2.いいね
いいねしたツイートを表示します。
3.リスト
自身が設定したリストを表示します。
事前にリストを作成しておく必要があります。
4.検索
ハッシュタグに一致するツイートが表示されます。
5.コレクション
コレクションに設定したツイートが表示されます。
事前にコレクション設定が必要になります。
今回はユーザータイムラインの設定を行います。
ユーザータイムラインの設定
左に設定メニュー、右にプレビューされる形になっています。
設定項目は下記の通り。
1.ユーザー名
どのユーザーのタイムラインを表示するか設定します。
デフォルトでは自身のユーザー名が入っていますが、
別のユーザのタイムラインを表示することも可能です。
2.オプション
・@ツイートを除外する
リツイートをタイムラインに含めるかどうかの設定です。
チェックを入れるとタイムラインに表示されません。
・画像を自動的に開く
チェックが入っている場合、タイムライン上に画像が表示されます。
チェックなしの場合「画像を表示」というリンクに置き換わります。
3.高さ
ホームページにタイムラインを設置した時の高さです。
デフォルトでは600ピクセルになっています。
4.テーマ
タイムラインの見た目を変更できます。
明るい・暗いの2パターンしかありません。
5.リンクの色
リンクの色を変更できます。
初期値は青です。
特に設定が必要なければ、「ウィジェットを作成」ボタンをクリックしましょう。
ウィジェット作成ボタンをクリックすると、プレビューの下にサイトに設置する為のHTMLタグが表示されます。
まるっとコピペしましょう。
タイムラインをホームページに埋め込む
ホームページへの設置は非常に簡単です。
先程まるっとコピペしたHTMLをホームページに貼り付けましょう。
左記のようにサイト上に設置することが可能となります。
注意点
作成したウィジェットは、設定のウィジェットに一覧として表示されます。
後から設定内容の変更や、削除が可能となっています。
ホームページ上に埋め込んでいるウィジェットを削除してしまうと、ホームページ上からタイムラインが消えてしまいますので注意してください。
WEB制作会社でコーダーを務める。
あなたにおススメの記事
このカテゴリの新着記事
- ALL
- PCトラブル
- ネットトラブル
- パソコンスキル
- ホームページ
-
No.1
PCトラブル
2015.09.29
-
No.2
PCトラブル
2016.02.03
-
No.3
PCトラブル
2015.08.21
-
No.4
PCトラブル
2015.09.29
-
No.5
ホームページ
2015.12.03
-
No.1
PCトラブル
2015.09.29
-
No.2
PCトラブル
2016.02.03
-
No.3
PCトラブル
2015.08.21
-
No.4
PCトラブル
2015.09.29
-
No.5
PCトラブル
2015.09.29
-
No.1
ネットトラブル
2015.10.03
-
No.2
ネットトラブル
2015.10.03
-
No.3
ネットトラブル
2015.10.03
-
No.4
ネットトラブル
2015.10.03
-
No.5
ネットトラブル
2015.10.03
-
No.1
ホームページ
2015.12.03
-
No.2
ホームページ
2015.12.01
-
No.3
ホームページ
2016.01.17
-
No.4
ホームページ
2015.12.06
-
No.5
ホームページ
2016.01.11
- ALL
- PCトラブル
- ネットトラブル
- パソコンスキル
- ホームページ
-
No.1
ホームページ
2015.10.05
★ 0
コメント(1)
-
No.2
ホームページ
2015.10.05
★ 0
コメント(1)
-
No.3
PCトラブル
2015.09.29
★ 1
コメント(1)
-
No.4
PCトラブル
2016.10.11
★ 0
コメント(0)
-
No.5
PCトラブル
2016.10.11
★ 0
コメント(0)
-
No.1
PCトラブル
2015.09.29
★ 1
コメント(1)
-
No.2
PCトラブル
2016.10.11
★ 0
コメント(0)
-
No.3
PCトラブル
2016.10.11
★ 0
コメント(0)
-
No.4
PCトラブル
2016.10.01
★ 0
コメント(0)
-
No.5
PCトラブル
2016.10.01
★ 0
コメント(0)
-
No.1
ネットトラブル
2015.10.03
★ 0
コメント(0)
-
No.2
ネットトラブル
2015.10.03
★ 0
コメント(0)
-
No.3
ネットトラブル
2015.10.03
★ 0
コメント(0)
-
No.4
ネットトラブル
2015.10.03
★ 0
コメント(0)
-
No.5
ネットトラブル
2015.10.03
★ 0
コメント(0)
-
No.1
ホームページ
2015.10.05
★ 0
コメント(1)
-
No.2
ホームページ
2015.10.05
★ 0
コメント(1)
-
No.3
ホームページ
2016.03.20
★ 0
コメント(0)
-
No.4
ホームページ
2016.02.20
★ 0
コメント(0)
-
No.5
ホームページ
2016.02.12
★ 0
コメント(0)
この記事へのコメント
コメント(0)
※利用規約に違反するコメントを確認された場合はご報告ください