スタイルシートのカスタマイズに便利なアドオン「Firebug」がお勧め

Firebug
ワードプレスやサイト作成していると、デフォルトだと見出しタグが気に入らなかったりフォントや行間をカスタマイズしたくなりますよね。

ワードプレスのテーマによっては、スタイルシートに説明書きされていないものもあるので、探り当てるのに時間がかかります。

そこでスタイルシートをカスタマイズする時、「どこ弄ればいいんだーー?」と迷わず、さらにその場でテスト編集&プレビューできてしまう便利なアドオンをご紹介します。

Firebugっていうアドオン

その便利なアドオンは「Firebug」といいます。Firefoxの専用アドオンですので、使うにはFirefoxのインストールが必要です。

Firefoxインストール後にFirebugをインストールします。

→Firebugのインストールはこちら

Firebug
アドオンをインストールすると、右上に虫のマークが出ます。こいつをクリックすると、
 
 
firebug3

画面したにソースコードが表示されます。

そして左上の矢印ボックスをクリックした後に、カスタマイズしたい部分を選択します。今回はH3見出し部分を選択。

すると右側部分に、選択した部分に関連するスタイルのコードが表示されます。
 
 
firebug4

Firebugが凄いのは、スタイル部分をテスト編集出来てしまうこと。
編集したい行をクリックして、数値やタグを書くと、
 
 
Firebugスタイル編集

編集したスタイルがそのままブラウザに反映されます。マージンの調整、サイト全体の色・構図の編集に使えますね。

スタイルが決まったらワードプレスのテーマを1回書き換えるだけ!Firebug最高に便利!開発者様ありがとう!

こういう便利なものがあるなら、誰かもっと早く教えて欲しかった。スタイルの箇所を探して、保存して、プレビューして・・・と今までどれだけ時間をかけたことか。

今後はテーマ入れ替える時の「うー、面倒くさいな」というストレスが軽くなりそうです。

【幸呼来】時間短縮って幸せ

今まで10の時間がかかっていたものが7になるとか、ちょっとでも短縮出来ると幸せ気分になります。

空いた時間を他の勉強や自己投資に使えるなぁ。と思いながら、なんだかんだで休憩時間が増えることが多かったりします。

でもこれでいいんです。何もしない時間も大切なのだから。

Pocket
LINEで送る

<スポンサーリンク>
◆いいね!で更新情報のお知らせが届きます◆

このページの先頭へ