説明
This plugin adds a textarea to the Customize page that allows theme editors to write, preview, and implement CSS code in real time.
It also includes a frontend CSS editor window with live preview capability.
インストール
- Upload the
live-css-previewfolder to the/wp-content/plugins/directory. - Activate the plugin through the ‘Plugins’ menu in WordPress.
FAQ
-
Will the CSS be applied to my live site if I hit “Save & Publish”?
-
Yes. Your changes are saved to the database and applied immediately to the frontend.
-
Will the Live CSS Preview allow me to write @media queries?
-
Absolutely — this is one of its primary features.
-
My CSS doesn’t seem to apply. How can I override the theme’s CSS?
-
The plugin adds a
livecssclass to the<body>element.
Use it to increase specificity when needed:body.livecss { background-color: red; } -
2.1.6
-
whitespace error removed which may conflict with other plugins
-
2.1.7
-
Hardening security (sanitization + escaping)
Cleaning up uninstall logic
Stabilizing CSS injection / preview behavior -
2.2.2
-
New behavior, complete rework.
Front-end Live CSS editor now:
-Loads CSS directly from Appearance Customize Additional CSS
-Saves directly back to Additional CSS
-Applies changes instantly on the front endMigration
-Automatically migrates existing Live CSS data into Additional CSS on update
-Ensures no CSS is lost during upgradeImprovements
-Added Minify, Format, and Reset tools in the editor
-Improved compatibility with themes and plugins (including complex layouts)
-Hardened CSS and JS to prevent conflicts (Bootstrap, Toolset, etc.)
-Ensures editor appears above all site elements (z-index handling)Performance
-CSS now outputs only once using native WordPress methods
-Reduced duplicate rendering and improved front-end efficiencyCleanup
-Removed redundant Customizer editor (uses native Additional CSS instead)
-Simplified architecture for long-term stability -
2.2.3
-
-Fixed ACE autocomplete suggestions stacking below the Live CSS panel (z-index)
-Fixed Format tool inserting a space after colons in selectors (e.g. a:hover was changed to a: hover); spacing is now applied only to property/value lines
-Removed unused legacy Customizer control PHP file
-Removed duplicate root js/ and css/ folders (only assets/js and assets/css are loaded)
評価
このプラグインにはレビューがありません。
