頑張らない!でも諦めない!必死にならずにええかげん

Twitter™でブログに設置する検索ウィジェットを作成する

      2014/11/22

Twitter™で検索ウィジェットを作成しウィジェットで表示すると、
指定したハッシュタグやキーワードを含むツイートを、
ウィジェットに表示することができるようになります。

はじめに

Twitterを利用したウィジェットでは様々な種類のウィジェットを利用することができます。
この検索ウィジェットもその一つです。

公式ハッシュタグによる検索や関連するキーワードなどを指定して、
Twitterを検索してウィジェットで表示できます。

Twitterで作成可能なウィジェットの種類と実際の表示を以下でご紹介しています。
Twitter™で作成が可能なウィジェットの例

検索ウィジェットの作成

検索ウィジェットの作成にはまずTwitterにログインします。
ログインして右上の歯車アイコンからプルダウンを表示し[設定]をクリックします。

01_Twitter設定の選択

Twitter設定の選択

設定メニューが表示されたらサイドバーから[ウィジェット]をクリックします。

02_ウィジェット選択

ウィジェット選択

ウィジェットが表示されたら[新規作成]をクリックします。

03_ウィジェットの新規作成

ウィジェットの新規作成

「ユーザーウィジェットを作成する」が表示されたら、
上部のタブよりタイムラインソースで[検索]をクリックします。

01_検索タイプタイムライン選択

検索タイプタイムライン選択

「検索クエリ」に対しては検索するキーワードを指定します。
キーワードを入力すると、プレビューエリアに検索結果が表示されます。

02_検索クエリの指定

検索クエリの指定

「トップツイートのみを表示する」にチェックを付与すると、
ツイートがトップツイートのみに限定されて表示されます。

トップツイートの検索基準については以下で説明されています。

トップツイートはどのように選ばれるの?

他のユーザーの注目を集めているツイートを見つけ出す独自のアルゴリズムを利用しています。トップツイートは自動的に更新され、このアルゴリズムに基づいて広くリツイートされたツイートが選び出されます。手動でトップツイートを選択しているわけではございませんことご理解ください。

(抜粋引用)Twitterヘルプセンター | トップツイートに関して

「セーフサーチ」では不適切なコンテンツや冒涜的なコンテンツを除いて検索されます。
細かな判定条件については以下を参考にされてください。
Twitterヘルプセンター | Media settings and best practices

画像つきのツイートの表示で画像が省略表示されるようになります。
(カスタムタイムラインウィジェットの設定画面を引用)

06_画像を自動的に開くを解除

画像を自動的に開くを解除

「高さ」を変更すると設置したウィジェットの表示サイズを変更することができます。
サイトのスペースなどに合わせて変更するといいでしょう。

テーマでは「明るい」または「暗い」を選択することができます。
[暗い]を選択した場合には、以下のように黒基調のウィジェットになります。
(カスタムタイムラインウィジェットの設定画面を引用)

07_テーマ変更

テーマ変更

「リンクの色」ではフィールドにカーソルを合わせるとカラーピッカーが表示されます。
表示されたカラーピッカーをクリックし、好みの色を表示し、
フィールドに表示されている色コードをコピーしフィールドに貼り付けます。
最後に[完了]をクリックします。
(カスタムタイムラインウィジェットの設定画面を引用)

08_リンク色の変更

リンク色の変更

リンクの色を変更するとタイムラインに表示されたリンクの色が指定した色に変更されます。
(カスタムタイムラインウィジェットの設定画面を引用)

09_リンク色の変更表示

リンク色の変更表示

[ウィジェットを作成]をクリックするとウィジェットが作成されます。

03_ウィジェットを作成クリック

ウィジェットを作成クリック

ウィジェットが作成されると、ウィジェットをサイトやブログに設置する為のタグが表示されます。

このタグをサイトに貼り付けてウィジェットを設置します。

04_作成されたウィジェットコード

作成されたウィジェットコード

プロモーション(btm)

Google or AdMax Promotion (it)

さいごに

こうしてカスタマイズした独自の検索ウィジェットとして設置することができます。


twitterおよび、twitterロゴは、トゥイッター インコーポレイテッドの登録商標です。
登録番号は以下の通りです。
第5188811号、第5469003号
ツイッター、およびツイッターロゴはトゥイッター インコーポレイテッドの登録商標(商願2012-70641)です。

*本ページ内に記載されされた各社ブランド、サービス名、商標、登録商標については、
各社ブランドのロゴや商標等に関する帰属についてをご確認ください


最後までお読みいただきありがとうございました。

アイキャッチ画像に利用させて頂いております、各社ブランドのロゴやシンボルに関しては、
各社ブランドのロゴや商標等に関する帰属についてをご確認頂けますようお願い致します。

AdMax Promotion

ブログ記事のご紹介
すべて展開 | すべて省略

Rakuten Promotion

ページ
すべて展開 | すべて省略

 - twitter

Comment

  1. […] グに設置する検索ウィジェットを作成する | ええかげんブログ(本店)続きを読む → […]

  2. […] グに設置する検索ウィジェットを作成する | ええかげんブログ(本店)続きを読む → […]

  関連記事

eye_twitter
(iPhone)Twitter™のPC版サイトをiPhone®で表示する方法

Google or AdMax Promotion(cel) 禁断の機能がau公 …

eye_twitter
Twitter™DeveloperアカウントにサインインしてCustomTimelinesベータ機能にアクセスは申請制なのか

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_twitter
【対応手順】安全のため、あなたのTwitterアカウントはロックされました。

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_twitter
(Android)Twitter™のPC版サイトをAndroid™で表示する方法

Google or AdMax Promotion(cel) 禁断の機能がau公 …

eye_twitter
Twitter™で作成が可能なウィジェットの例

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_twitter
WordPressサイドバーにTwitter™タイムライン(timeline)ウィジェットを表示する

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_twitter
自分以外のユーザーのTwitter™タイムラインをウィジェットで表示する

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_twitter
(PC)Twitter™のアプリ連携を取り消す為の操作方法

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_twitter
(iPhone+Chrome)Twitter™のアプリ連携を取り消す(解除)方法

Google or AdMax Promotion(cel) 禁断の機能がau公 …

eye_twitter
Twitter™でブログに設置するリストウィジェットを作成する

Google or AdMax Promotion(it) 禁断の機能がau公式 …