這個外掛並未在最新的 3 個 WordPress 主要版本上進行測試。開發者可能不再對這個外掛進行維護或提供技術支援,並可能會與更新版本的 WordPress 產生使用上的相容性問題。

Live CSS Preview

外掛說明

This plugin adds a textarea to the new Customize page that allows theme editors to write, preview & implement css code in real time.

安裝方式

  1. Upload the live-css-preview folder to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress

常見問題集

Will the css be applied to my live site if I hit “Save & Publish”?

Yes. The plugin is designed to not only show a preview of your css changes, but to save those changes to the options table and implement them on the front-end as well. It is also useful as a developer tool so you might want to take the changes you’ve made out of the Live CSS Preview box and paste them into your theme’s style.css file.

Will the Live CSS Preview allow me to write @media-queries?

Yes, in fact that is excactly what it was originally designed for!

My css doesn’t seem to have any effect. How do I override my themes default css?

The Live CSS Preview plugin adds a new class to the body tag called livecss for exactly this situation. Most of time you’ll want to avoid this, but when necessary you can add .livecss or body.livecss to the beginning of your css declaration and in most cases it will do the trick.

For example, when trying to change the background color of the body tag in Twenty Eleven, the following won’t work:

body { background-color:red; }

Adding the livecss class will override the themes specicifity and force the change:

body.livecss { background-color:red; } /* This will work */

NOTE: If you deactivate or delete the plugin, the livecss class will no longer be available to code you’ve added to your style.css file. To maintain this feature beyond the life of the plugin, just add the following code to your functions.php file:

function my_body_class_override( $classes ){    
    $classes[] = 'livecss';
    return $classes;        
} add_filter( 'body_class', 'my_body_class_override' );

使用者評論

There are no reviews for this plugin.

參與者及開發者

以下人員參與了開源軟體〈Live CSS Preview〉的開發相關工作。

參與者

將 Live CSS Preview 外掛本地化為台灣繁體中文版

對開發相關資訊感興趣?

任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄