How to Add Custom Styles to WordPress Visual Editor



The WordPress visual editor comes with basic formatting options. Sometimes you may need custom styles of your own to add css buttons, content blocks, taglines, ect. In this video, we will show you how to add custom styles to the WordPress visual editor.

If you liked this video, then please Like and consider subscribing to our channel for more WordPress videos.

Text version of this tutorial:
http://www.wpbeginner.com/wp-tutorials/how-to-add-custom-styles-to-wordpress-visual-editor/

Check us out on Facebook:
https://www.facebook.com/wpbeginner

Follow us on Twitter:

Join our circle on Google+:
https://plus.google.com/+wpbeginner/

Checkout our website for more WordPress Tutorials
http://www.wpbeginner.com/

Summary of this Tutorial:

Start by installing and activating the TinyMCE Advanced Professional Formats and Styles plugin.

Then go to Settings, TinyMCE prof. Styles to configure the plugin.

You want to pick the directory to create the stylesheet it will use.

It will then allow you to create a new style option, you can create things like buttons and fill out the information for it.

Once finished save the settings and when you create a new post click on the format drop down to add the style you created.

Related Links:

TinyMCE Advanced Professional Formats and Styles

TinyMCE and TinyMCE Advanced Professsional Formats and Styles



source

5 thoughts on “How to Add Custom Styles to WordPress Visual Editor”

  1. WP plugin repository says "This plugin hasn’t been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress."
    Has anyone tested it with WP 4.4.2?

Leave a Reply

Your email address will not be published. Required fields are marked *