読者です 読者をやめる 読者になる 読者になる

フル墨攻

「少しまとまった思いつき」を書きます

こころ穏やかにはてブ生活を送るための方法

Hatena WebService

要はリンクを消すという話。

概要

FirefoxChrome拡張機能を使っていらんリンクを消しましょう*1

最近ちらほらと「はてブにフィルタ機能はよ」みたいなコメントを見かけたので「そこは自分でやればいいよね?」という解説。

目的

  • 某ブロガーの記事はまったく読まないので目にはいらないようにしたい
  • 某サイトの記事はすべて読む価値がないので消したい
  • あのはてなidのアイコン見たくない
  • 増田とか読まないから消えて

などのように
はてブの気に入らない記事をとにかく目にはいらないようにしたい
という人向け。
まぁたしかに「ホントにゴミだな」というサイトはあるので、そういうところを踏んで時間を無駄にしないようにするという考え方もある。時間は大事。

ついでに言えば、「ある特定idのはてなスターを消したい」というフィルタも可能。

できること

リンクのURLに含まれる特定の文字列を指定して、そのリンクを非表示にする。
リンクに含まれる文字列を指定して非表示にするのは不可。
Greasemonkeyならたしか可能。最近使ってなくてわからないのでググレカスでお願いします。

Greasemonkey :: Add-ons for Firefox
Greasemonkey用スクリプト 指定したURLのリンク文字列にユーザー指定の文字列を追加する - 寝込み屋蔵
Greasemonkey Script - はてなハイクまとめWiki

方法

モバイル環境ではてブアプリを使ってるひとはブラウザに乗り換えましょう。

FirefoxChromeがなにかわからないひとはググレカスでお願いします。

Chrome ブラウザ
Firefox ヘルプ
モバイル版 Firefox をインストールするには | Android 版 Firefox ヘルプ

設定

Firefox+Stylishの場合
  1. Firefoxを起動
  2. 右上にあるメニューから「拡張」を選び、拡張の画面へ
  3. 右上の検索ボックスから”Stylish”で検索。f:id:wetfootdog:20140724175816p:plain
  4. インストール→再起動。f:id:wetfootdog:20140724175836p:plainf:id:wetfootdog:20140724180426p:plain
  5. メニューバーにStylishのアイコンが追加されたことを確認
  6. たとえば「はてブTOPページ」などを開く
  7. Stylishのアイコンをclick→"新しいスタイルを書く"→"このURL専用…"
  8. 適当にタイトルをつける
  9. 一番下のボックス内をすべて消して、以下をコピペ("q.hatena"を含むリンクを非表示にする)
@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("b.hatena.ne.jp") {

 [href*='q.hatena']  {display: none !important;}
}

リンクに含まれる文字を指定して、そのリンクを非表示にする、ということです。
なので、URLに含まれる文字列ならidでもいいし、ドメインなどでもいい。

複数の文字列を追加したい場合は以下のようにします。

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

@-moz-document url("http://b.hatena.ne.jp/") {

[href*='q.hatena'], [href*='anond.hatelabo']  {display: none !important;}
}

'q.hatena'に'anond.hatelabo'が追加されています。

関連:
■ファイアーフォックス(Firefox)でユーザースタイルシートを使ってみよう――メールとウェブのお役立ちメモ

Chrome+Stylebotの場合
  1. Chromeを起動
  2. ここからインストール→Chrome ウェブストア - Stylebot
  3. あるいは以下。機能拡張ストアにアクセス→Chrome ウェブストア - 拡張機能
  4. 左上の検索ボックスから"Stylebot"を検索
  5. インストールする。再起動不要
  6. 右click→Stylebot→Style Element
  7. 設定パネルの左下にある"Edit CSS"ボタンをclick
  8. 以下をコピペ("q.hatena"を含むリンクを非表示にする)
 [href*='q.hatena']  {display: none !important;}
ブックマーク画面でidを指定してスターを消す方法。
 [href*='ここにid']  {display: none !important;}

ただし、こうすると特定idのスター消えるけど、そのidのアイコン・idも消えてコメントだけになります。
あと注意して文字列を指定しないと、関係ないリンクを誤爆して消してしまう可能性もあります(スターに限りませんが)。自分でいろいろやってみてください。

ブックマークは特定idの非表示機能があるんで、必要ないかも*2
StylebotにはGlobal Stylesheetの設定があるので、そこに上記のような記述をすればあらゆるページから特定idを含むリンクを消すことも可能です。

要素(広告、コメント欄など)そのものを消したい!

PC
Firefoxadblock
Chromeadblock、Stylebotなど
モバイル
Firefoxadblockなど

インストール後に消したいものの上で右click or アイコンをclick。
あとはググレカスでお願いします。

メモ: Chrome拡張「Stylebot」でユーザCSSを編集する - 虎塚
Adblock Plusのフィルタの使い方まとめ - Today is a gift
Adblock - Mozilla Firefox まとめサイト
Stylish で特定の要素を消す - CSS による要素の指定 | すぐに忘れる脳みそのためのメモ

そのほか

みたいなときにも、Stylebotを使ってbody要素のwidthを800とか1000にしておくと見やすくなったりします*3

蛇足

ネットで広告消すと
「泥棒だ!」
みたいにいきり立つひとがいるけど、ほぼ100%clickしねえよみたいなムダ広告は消してもいいんじゃないですかね。

*1:はてブのヘビーユーザーあたりだと既知の話だと思うけど、今回は初級〜中級者向け解説なので。

*2:それでスターが消えるかどうかは調べてないので不明。

*3:あとmarginも調整するとか。