追加cssとかいう便利アイテム!

こんにちは、ジムです。

間違えてコンペで通ってしまった図面や、研究に関する調査とプレゼン作成から現実逃避のついでで久々にこのブログのお手入れをしました。

たまっていたプラグイン更新とか、wordpress本体の更新とか。

そんな作業をしていたら、とある機能が増えていることに気が付きました。

wordpressダッシュボードの外観からカスタマイズを選択。

すると現在のサイトの表示を見つつ外観をカスタマイズできる画面に移行します。

その選択肢の中に「追加CSS」というものが。

本体更新で記事タイトルが大文字化してしまったりしていたので、直すついでに使ってみることにしました。

これが存外便利で驚いたってお話です。

 

さて、このブログで使っているwordpressテーマは

「Twenty Fourteen」です。

もともとの大文字変化への対策は、このテーマのCSSファイル(style.css)内の.entry-titleの中、text-transformをnoneに変えてあげることで対応していました。

この作業が、追加CSSの機能を使うと

追加css内に

.entry-title{
    text-transform:none;
}

って書いてあげるだけ。

リアルタイムで表示を確認できるので、CSSが書ける方であれば自分のサイトを確認しながら好きなようにカスタムすることができます。

この確認しながらってのが結構重要で、別タブを開いたり更新する必要が無いので打ち込むことに集中できます。

CSSを新たに勉強する場合もかなり便利かと。

間違っていれば反映されず、すぐに分かります。

その際もタブ切り替えとかしなくていいのでキーボードから手を離さなくていいのです。

べーんりー!(^-^)

追加CSSは本来読み込まれるCSSファイルの後に読み込まれるため、デフォルトを上書きすることができるんですね。

すぐに反映されるのが面白かったのでずっと気になっていたサイトが左寄りになっていたのを修正したり、背景カラーをジムっぽくしたりしました。

また年末の時間のある時などに少し手を加えて来年に備えたいと思います。

ではではノシ

おすすめ

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください