おすすめ記事ピックアップ
前記事(Blogger HTMLの編集画面が新しくなった2013年4月その1利点と残念 http://www.furimuke.com/2013/04/blogger-html201341.html)で、Blogger HTMLの編集画面が新しくなって、見やすくなったけど、コードが探しづらくなったよ。ちくしょーという記事を書きました。
探しづらいコードをどうやって探すのかコツを紹介します。もしかしたら、もっと良い方法があるのかもしれません。あったら誰か教えてください。
まずBloggerのレイアウト用のCSSコードをいじることで、レイアウトを変更できます。あたりまえ体操です。例えば、右上の赤丸部分のレイアウトを変更するとします。
ブラウザーはチョロメです。右クリックで「要所を検証」します。
ずばっと、使われているCSSコード部分が右側に表示されます。さすがチョロメ。
ブラウザー上で数値を変更すれば、見た目ですぐに変更を確認できます。これはブラウザー上だけですので、本当の変更はできません。参考としての変更です。でCSSを変更して、調度良い設定を見つけたとします。
パディングの部分を変更して、上のスペースを無意味に増やしました。
赤線部分が対応のCSS部分です。今までなら、これをHTML編集画面で検索すれば、OKだったのですが、改良で、検索が不自由になりましたので、困ったものです。とりあえず右側の赤四角部分に、CSSの行数が表示されています。
その行数を元に、HTML編集画面を探します。少し実際は下のほうにあったりします。422行ですが、440行ぐらいに、対象のCSSがありました。
まあCSSの部分なら行数から探せば、検索できなくても、だいたい見つけることができます。不便ですけでも。
探しづらいコードをどうやって探すのかコツを紹介します。もしかしたら、もっと良い方法があるのかもしれません。あったら誰か教えてください。
まずBloggerのレイアウト用のCSSコードをいじることで、レイアウトを変更できます。あたりまえ体操です。例えば、右上の赤丸部分のレイアウトを変更するとします。
ブラウザーはチョロメです。右クリックで「要所を検証」します。
ずばっと、使われているCSSコード部分が右側に表示されます。さすがチョロメ。
ブラウザー上で数値を変更すれば、見た目ですぐに変更を確認できます。これはブラウザー上だけですので、本当の変更はできません。参考としての変更です。でCSSを変更して、調度良い設定を見つけたとします。
パディングの部分を変更して、上のスペースを無意味に増やしました。
赤線部分が対応のCSS部分です。今までなら、これをHTML編集画面で検索すれば、OKだったのですが、改良で、検索が不自由になりましたので、困ったものです。とりあえず右側の赤四角部分に、CSSの行数が表示されています。
その行数を元に、HTML編集画面を探します。少し実際は下のほうにあったりします。422行ですが、440行ぐらいに、対象のCSSがありました。
まあCSSの部分なら行数から探せば、検索できなくても、だいたい見つけることができます。不便ですけでも。