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

ChromeでTweetDeckのCSSをいじる

Twitter

tweetdeck cssとかで検索すると出てくるには出てくるんですがあまり最新っぽいのは出てきませんね。

というわけで適当にいじりました。

今のところこんな感じです。

f:id:eai04191:20141223115004p:plain

f:id:eai04191:20141226165144p:plain

モザイクのせいで宇治松千夜ちゃんのお顔が隠れてしまってるのが嘆かわしい。

いじったところ

  • 上のHomeとか書いてあるバー
    • 高さを縮めた
    • スクリーンネームが隠れないように文字を指定px以上で切り捨て
    • 中央揃え
  • タイムライン
    • 幅をだいぶ縮めた
    • 背景画像追加
    • 背景画像に従い背景透過

いじり方

僕はWindowsChrome拡張機能のTweetDeckを使用してるのでそれで書きます。 LinuxとかMacの人は適当に読み替えてください。

なんでChrome拡張機能版かというと画像を右クリックしてググれるのが便利だからです。

  1. C:\Users\ユーザー名\AppData\Local\Google\Chrome\User Data\Default\Extensions\hbdpomandigafcibbmofojjchbcdagbl\バージョン\web\templates\default.htmlを適当なエディッタで開く。

  2. 18行目あたりに<link rel="stylesheet" href="CSSへのパス">を追加する。

  3. 自分好みにCSSをいじる。

CSSを直接いじらない理由は既存のとごっちゃになるのは割とめんどくさいのと、バージョンが更新されたときに全部初期化されてしまうからです。(実際消えた。)

web版を使っている人はStylishとか使えばできると思います。

Stylish - Chrome ウェブストア

Stylish :: Add-ons for Firefox

ちなみにCSSのパスをhttp://mizle.net/tweetdeck_eai04191.cssにすると前述したスクショのCSSを読み込めます。適当なのでバグだらけですが、何かあれば参考にしてください。

f:id:eai04191:20141223120403p:plain

バグの例

14/12/26追記

コメントにて「この拡張機能は破損している可能性があります。」と出ていじれない場合があるという報告をいただきました。

私の場合は出たことがないので情報募集中です。

14/12/27追記

kb10uyが成功したみたいです。

manifest.jsonの変更例。うつっていないところは変更しなくていいらしいです。

f:id:eai04191:20141227122736p:plain

パッケージ化~はChromeデベロッパーモードにするとできます。

f:id:eai04191:20141227123012p:plain

15/01/04追記

現在はBetterTweetDeck共存するために拡張機能版ではなくweb+BetterTweetDeck+Stylishにしています。

Chromeでweb版をアプリっぽく動かすのはほたさんのブログが役に立ちました。

ておくれブログ: Linux環境のChromium/ChromeでTweetDeckを直接起動するランチャーを作成する

これでURLバーやタブバーなどが表示されなくなります。