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

旅モバ

旅、モバイル、サーバ関連(Linux,FreeBSD)、クラウド・Webサービス、その他PCの話題など。

PocketのWebインターフェースをGoogle Chromeでちょっと使いやすくする

「後で読む」サービスのPocketのWebインターフェースは、どんなに解像度が高くても1列3行のサムネイル(ブックマーク)しか表示されません。これではちょっと使いづらいので、解像度に合わせて1行当たりの表示列数を3行固定→可変にして、見やすさ・使いやすさをちょっと向上させる方法をご紹介します。ブラウザはGoogle Chromeを利用します。

f:id:tabimoba:20140611015940p:plain

1.ブラウザのウインドウ内を右クリックして、「要素の検証」をクリックします。

f:id:tabimoba:20140611015943p:plain

2.デベロッパツールがブラウザの下部に表示されます。

f:id:tabimoba:20140611022012p:plain

3.デベロッパツールの左半分(Elements)より、赤枠の箇所をクリックします。

f:id:tabimoba:20140611015946p:plain

4.デベロッパツールの右半分(Styles)より、.wrapperのwidthのチェックを外します。

f:id:tabimoba:20140611015949p:plain

5.1行あたりに表示されるサムネイルが増え、見やすくなりました。

f:id:tabimoba:20140611015955p:plain

なお、一連の操作を都度行うのは面倒だとと思いますので、Stylishのような、ページごとにカスタムスタイル(CSS)を管理・適用可能な機能拡張を導入することをお勧めします。