はてなブログのデザインCSSの編集画面は、ウィンドウが狭く文字も小さく使いづらかったのですが、Google Chromeの拡張機能を使って、大きく見やすくしたいと思います。
というか、Chromeの拡張(ユーザースタイルシート)でWebサイトやブログのデザインを変えたり、広告を非表示にしてきたのに、なぜ、こういう発想ができなかったのでしょう?
はてなブログのデザインCSSの編集画面を大きくする
- Google ChromeにWebサイトの見た目を変更するChrome拡張機能のUser JavaScript and CSSをChrome Web Storeからインストールします。
- User JavaScript and CSSの拡張アイコンをクリックして「Add new」ボタンをクリックまたは拡張アイコンを右クリック、オプションを選択して「Add new site」ボタンをクリックします。
- User JavaScript and CSSの入力画面の上にあるURL入力欄に、「blog.hatena.ne.jp」と入力します。
- User JavaScript and CSSの入力画面の右にあるCSS入力欄に、ただいま村 - はてなブログのデザイン設定のダイアログボックスを大きくするという記事のCSSコードをそっくりそのまま貼り付けます。
- User JavaScript and CSSの入力画面の右上にある「Save」ボタンをクリックします。
- はてなブログの管理画面(blog.hatena.ne.jp)を更新し、デザイン→カスタマイズ→デザインCSSを確認して、ウィンドウと文字が大きくなっていれば完成です。