裏・狂欲。: tumblr  囀・狂欲。: twitter

2010年08月06日

2010年08月15日 04時00分頃追記。

 さらに追記。グッチャグチャになった感があるから目次を作ります。

  • 初めての人はこのまま読み進めて下さい。
  • ブラウザはFirefoxでアドオンのStylish入れてるって人は「Stylishを使った消し方」へ。
  • 初稿(2010年08月06日 20時00分)で設定して「トップページ以外消えねぇぞゴルァ」って人は「追記」へ。
  • Google ChromeとSleipnirの人は「他のブラウザ」へ。

twitterのおすすめユーザーがウザい

 先日から"twitter"に追加された機能「Twitter / おすすめユーザー」、トップページのサイドバーに2件表示されてて「全てを見る」から一覧のページに飛べる。話の種にざっと見てみると、自分がフォローしている人達がフォローしてる人、なんかがリストされるみたいだけど…。前にフォローしてて今はリムーブした有名人なんかが並んでる。自分のフォロー/リムーブ履歴は反映されてないのか。

01

 「あなたが興味を持ちそうなユーザー」と書いてあるが、"7月末の時点"は
「フォローすべきユーザー」と書いてあった。やっぱり評判悪かったんだな。

 私はtwitterをMacでもiPhoneでもクライアントアプリケーション(なんだかんだで両方ともTweetDeckから使ってるから全然迷惑してないけど、いつも見てる「頭ん中」さんにこんな記事が。

先日から一部のユーザーには出てたみたいだけど
今日あたりから対象ユーザーが増えたのか全員になったのか
Twitter のサイドバーに "Who to follow" というのが出るようになった。
日本語設定なら「おすすめユーザー」ですか。

どうやら自分がフォローしてる人から多くフォローされてる人を
「あなたもフォローしてはどうか」と提案する機能みたいなんだけど、
「どんなのが出てるのかな」と一回見てはみるものの
もう要らない。

でもこの欄を消すためのボタンがないので
このままではサイドバーに知らない人のアイコンが出続けることになる。

というわけでこの欄が表示されないようにする方法を。

Twitterのサイドバーに出るWho to follow (おすすめユーザー) を消す方法 - 頭ん中 から2010年8月6日に引用

 リンク先を読むとすぐにわかるが、単純にリストの非表示ボタンを押していくだけ。

02  class=

 誰でもすぐに出来るし環境を選ばないし、万人向けの簡単なやり方だろうが、3日くらいで復活してしまうようだから、完全に消してしまう方法を。

Firefox限定

 タイトルにも書いたがFirefox限定。まだまだIEやSafariしか使ってないって人は多いだろう。同じような事がIEやSafariでも出来るかもしれないし、GoogleのChromeなら多分出来るだろう。調べるの面倒だからそっちは勝手に調べて下さい。ココで書くやり方が応用出来るはず。

Stylishのインストール

 まずはFirefoxのAdd-on「Stylish」をインストール。FirefoxのAdd-onがなんだかわからないって人はググって。単純に言えば機能を追加する仕組み。

Stylishとは

 「Stylish」が何をする為の物かってーと、CSS(スタイルシート)をそのページ毎、ドメイン毎など、好きなようにユーザー側で指定できる仕組み。

 HTMLとCSSの関係がわからないって人はググってもらうしか無いけど、ざっくりと言えばHTMLのスタイル(文字修飾や配置)を別の書類に分けて書いて管理しましょう、って事。よっぽど古いサイトならともかく、今日日のWebサイトはHTML + CSSで書かれてる事が殆ど。

 StylishはそのサイトのCSSで気に入らない所、使いづらい所をユーザー(自分)側でなんとかしてしまおう、という少しだけ高度な物だ。わからない人もコレから書く通りにやれば出来る。コレを機に少しは勉強する気になってくれると自分のブログをイジったりとかスッゲー楽しい事が出来る様になる。2・3日真剣に向き合えば基礎は理解できるよ。

インストール

 "Firefox"で「Stylish」のページにアクセス。

03
※現在のバージョンは1.0.11(2010年9月11日)

 "Firefoxへ追加"をクリックすると

05

こんな感じの流れでインストールされる。再起動を促されるから素直にFirefoxを再起動。で、準備完了。

Stylishを使った消し方

 まずは「http://twitter.com/」にアクセス。

06

 アソコにある「おすすめユーザー」のソースを見ると

<div id="recommended_users">

ってのが作ってる要素とわかる。理解できなくてもOK。

 Firefoxウインドウの右下に注目。

07

 Stylishのアイコンがある。アレを「クリック」。右クリックでもなくダブルクリックでもなく。すると上から順番に

  1. スタイルの管理...
  2. すべてのスタイルを停止する
  3. このサイト用のスタイルを探す
  4. 新しいスタイルを書く  ►

と並ぶから、「新しいスタイルを書く  ►」にカーソルを合わせる。すると

08-03

  1. この URL 専用...
  2. twitter.com 専用...
  3. 白紙のスタイル

と出るから「twitter.com 専用...」にカーソルを合わせてクリック。こんなウインドウが開く。

09-02

 「名前 / タグ」は空欄になってるから適当な名前を。私は「おすすめユーザーを非表示 / twitter」と入れた。タグは入れなくてもOK。で、何もイジらずに下のテキストボックス中の最後にあるカッコ「{}」の中に以下のテキストを追加。元々入ってるテキストを消さないように。

#recommended_users{
display:none;
}

17

 追加したのは3行だけ。#recommended_users要素を非表示、と設定した。テキストボックスの中が以下の様になってればOK。

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("twitter.com") {

#recommended_users{
display:none;
}

}

「保存」をクリック。

結果を確認

12

 うん、非表示になった。右下のStylishアイコンにも変化が。

13

 いま仕事してるぜ、と言わんばかりに派手なアイコンになっている。コレをクリックすると

15

このユーザースタイルシートが仕事してるんだぜ、と「おすすめユーザーを非表示」の左にチェックが入っている。ココでクリックするとこのCSSをOFFに出来る。もう一度クリックするとONね。

まとめ

 もともとFirefoxでStylishを使ってる人なら既に設定済みだったり、やってなくても30秒で終わる事なのだが、インストールから説明したら結構長くなってしまった。

やってる事は

  1. Firefoxに
  2. Stylishをインストール
  3. twitter.comへ行き
  4. ユーザーCSSを設定

の4つだけ。すっげー簡単。このやり方を理解すると色んなコトが便利に使えるようになる。StylishのユーザーCSSはアチコチで色んな人が公開してるからググって探してみると良い。

 「頭ん中」さんからタイトルを丸パクりしてしまった。申し訳ない。適切過ぎるので変えようが無かったです。ごめんなさい。

追記

2010年08月07日 18時30分頃追記。

 このネタの元記事である「頭ん中」の「マスナガ (msng)」さんから"ツッコミ"いただいて気付きました。申し訳ない、ありがとうございます。

 言い訳に過ぎないですが、私は普段ブラウザからtwitter.comに行くことが殆ど無いから気付かなかったけど、「おすすめユーザー」ってのはトップページだけじゃなくアチコチで表示されてるのね。

などなど。他にもあるかも。だったら私が最初に書いたやり方だとダメで、訂正の必要がある。具体的には「ココ」、ユーザースタイルシートを適応させる範囲指定が間違ってる。既に本文中の記事は訂正してあるけど、初稿を読んでくれた人達向けに訂正方法を書きます。本当にごめんなさい。ココを見て直してください。

訂正方法

まずはFirefoxで「http://twitter.com/」」に行く。行かなくても直せるけど結果をすぐに確認するため。そしたらStylishのアイコンをクリック。一番上の「スタイルの管理...」を選択。クリックね。

20

 すると、こんなウインドウが開く。「おすすめユーザーを非表示(自分で決めた名前)」の行をクリックするとボタンが現れるから「編集」をクリック。

21

 こんなウインドウが開く。間違っているのは選択してる部分。

22

@-moz-document url("http://twitter.com/")

アソコを以下の様に上書きする。

23

@-moz-document domain("twitter.com")

最後のカッコ「 { 」を消さないように注意。最終的な全体のソースはこうなる。

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("twitter.com") {

#recommended_users{
display:none;
}

}

コレを全部選択してコピペでもOKです。「保存ボタン」をクリック。「アドオン」ウインドウを閉じる。

改めて動作確認

 さっきリストしたそれぞれのページに行って動作確認してください。

 安易に書いた記事のせいで、お手を煩わせてごめんなさい。お手隙の時にでもStylishの設定を直してください。ツッコミ入れてくれた「マスナガ (msng)」さん、ありがとうございました。

2010年8月15日追記

他のブラウザ

Google Chrome

Twitterの「おすすめユーザー」を非表示にするGreasemonkeyと、Google Chromeでユーザースタイルシートを設定する方法の解説

 「@rikuoさん」のブログ。この記事を紹介していただいた。ありがとうございます。グリモンのスクリプトと"Google Chrome"のStylish設定。ChromeにもStylishがあるんだねぇ。ChromeはMac OS X 10.4では動かないから使ってない。

Sleipnir

フェンリル | ラボ | StyleEditor

 具体的な方法ではなくて、ユーザースタイルシートの設定方法。流れはウチの記事を見て応用してほしい。(via @さおっちさん)

Safari

 Mac版Safariなら「Safari Stand」でページ毎のユーザースタイルが使えるみたいだけど敷居は高いねぇ。私も昔は完全なるSafari派だったんだけど、現在はすっかり使わなくなってしまった。

Internet Explorer

 知らね。調べてもいない。

ScriptかStyleか

 上でリンクした「rikuoさんのページ」にも書いてあったけどGreasemonkeyのJava Scriptでも同じ事は出来るんだよね。ただ、こういう事の基本として「CSSで出来る事はCSSでやる」ってのがあって。Java Scriptってのはどれだけ軽くてもやっぱりScriptで、実行するには負荷がかかる。twitterのおすすめユーザーを消すくらいなら何てことないだろうけど、Greasemonkeyは便利だから色んなScriptを入れていくウチにやっぱり重くなってくる。

 だったら、やっぱりCSSで出来る事はGreasemonkeyじゃなくてStylishにやらせた方が良い。

ユーザースタイルは公開されている

 初稿から書いたけど、ユーザースタイルは沢山公開されている。「userstyles.org」に行けば沢山ある。この記事で書いた様なスタイルもね。だから、「これインストールした後これをインストール」でも済む。ただ、今回の様な事例は自分で書いてもすごく簡単だし、CSSって何?って人でも基礎を学ぶ上でとても役に立つと思うのだ。勿論、私もわかってない事の方が多いけど、それでも自分のブログのCSSをイジったり今回の事くらいだったら特に調べなくても自分の知識だけで出来る。これを機に多くの人が興味を持ってくれたら良いなぁと何を偉そうに…とも思うが、とにかくそういう気持ちもあってコレを書いたつもりだ。

トラックバックURL
この記事へのコメント
おすすめユーザー機能とか激しく要らないです。興味のある人は自分で検索して探せば十分ですよ。どうしてこういう無意味な機能を作るんでしょう。頭に来ます。
Commented by    菜奈    2011年01月21日 19:49
記述内容どうりにしたんですが、なぜかブロックできなくて困ったんですが、FirefoxのAdblockで
||api.twitter.com/1/users/*
をブロック項目に入れると非表示になりました。
誰かの参考までに
Commented by    テュウィ    2012年02月16日 20:27
この記事にコメントする
※必須

※任意・入力しても公開されません

※任意・入力すると名前にリンクが付きます


情報を記憶:

コメント: ※必須