[WordPress] 出先からでもサクッとCSSを変更出来るJetpackの「CSS編集」が便利

prasmっていうブログだよ

[WordPress] 出先からでもサクッとCSSを変更出来るJetpackの「CSS編集」が便利

たまに自宅とは違う環境で自分のブログやサイトを見て、意図とは違う見た目に愕然とすることがあります。

大抵はOSやブラウザのCSSの解釈のズレなんですけどね。

自分の環境だと発生しない問題に気がつけてラッキーなのですが、さて、自宅に戻るまで問題のある見た目のままというのは、落ち着かないもの。ですよね?ですよね?

そこで、出先でもサクッとCSSを編集しちゃう便利な方法をおしらせ。

テーマのCSSは家に帰ってから書き換え

当然WordPressなので、ブラウザからテーマのCSSを書き換えることも出来るんですが、この辺は自宅のローカルにあるCSSで作業したいので、今回は書き換えません。

かわりに便利プラグインJetpackの「CSS編集」機能を使います。

Custom CSS — Jetpack for WordPress

2014-01-23_2002

スポンサーリンク

Sassも使える気の利いた機能

さて、やり方です。Jetpackをインストールしていればデフォルトで使える状態だと思いますが、念のため。

ダッシュボードのJetpackの設定の中の

2014-01-23_2002

この部分でオンオフ切り替えられます。

「CSS編集」を実行するのは「外観 > CSS編集」から。

2014-01-23_1959

この部分にCSSを書いて保存すれば、とりあえず修正作業は終わりです。

2014-01-23_2008

とにかく便利すぎる「CSS編集」機能

あまり使うことのなかったJetpackのこの機能ですが、ちょっと高性能すぎて笑ってしまいました。

  1. Sassが使える
  2. バージョン管理できる

Sassが使える。もちろんLESSも。

2014-01-23_2007

バージョン管理できる

右側の設定部分の下、見慣れたタイムスタンプですね。

2014-01-23_2008

ここから元に戻すこともできます。

2014-01-23_2009

2014-01-23_2008_001

ミスった!と思っても、一瞬で元通り。賢い奴ですね。まったく。

テーマのCSSをカスタムする勉強に最適!

使わないのがもったいなくなるほどの高機能。これは凄いですね。

テーマのCSSを弄ってカスタマイズしてみたい初心者の方は、この機能を使って練習してみるのがいいかもしれません。元のテーマのCSSは変更されませんので、間違えた!と思っても、消せば元通りです。

LESSやSassの勉強にもいいかもしれませんね。

とはいえ、変更は本番のWordPressに反映されてしまいますので慎重にどうぞ。

サクッとやれるから嬉しい

いかがでしたでしょうか?

いままであまり使うことのなかった機能ですが、いざ使ってみたら便利すぎました。

同様に出先からサクッと作業したい方には、おすすめですよ。

それでは。

参考:WordPress › Jetpack by WordPress.com « WordPress Plugins

おまけ。

アイキャッチ用にjetpackの人描いたのでおすそわけ。

次回の記事は
「人生を変えるための数十万円に関して」
読みのがしなくッ!

一緒に読んで欲しい記事

おすすめ商品