CSS Plugins for your WordPress site – Code visually

Have you ever wanted to edit your WordPress site on the frontend and see the changes live automatically. There are tons of Custom CSS plugin that you can download for free from wordpress.org. If you want to generate a custom style sheet, then here is a list of CSS plugins that I highly recommend.


SiteOrigin CSS Editor

Check the video tutorial to see how it works

Site Origin CSS is not only free but it’s also amazingly powerful. It’s the only plugin that does not used the the Customize function.After installing and activating the plugin, go to Appearance > Custom CSS to access the plugin’s stylesheet. On that page, you will see a text editor that does not include a live preview.

To access the live preview, click on either of the two buttons that appear on the right, just above the text box. The button with the eye icon will open up an easy-to-use visual CSS editor that non-technical designers will appreciate. The icon with the expanding arrows is a stripped-down version of the visual editor that requires you to manually write CSS rules.

The visual CSS editor provides a set of controls that make it easy to adjust a wide variety of text, decoration, and layout options without needing to know very much CSS syntax. Of all the CSS editors on this list, the visual editor mode of the SiteOrigin CSS plugin is the most user-friendly for non-technical WordPress users.

Jetpack also has a CSS editor.

he Custom CSS Editor allows you to customize the appearance of your theme without the need to create a child theme or worry about theme updates overwriting your customizations.

Adding Custom CSS
First, activate the Custom CSS module on the Jetpack dashboard, and then you can access the CSS editor via Appearance → Edit CSS.

If this is your first visit to the CSS Editor (or you have not yet added any custom CSS code), you will see a placeholder message in the editing window. Please review the message, as it contains some important information about the upgrade. The message says:

Welcome to Custom CSS!

CSS (Cascading Style Sheets) is a kind of code that tells the browser how to render a web page. You may delete these comments and get started with your customizations.


We're not around right now. But you can send us an email and we'll get back to you, asap.

Copyright 2016 Coolwebdesigns2go

Log in with your credentials

Forgot your details?