How To Add A WYSIWYG Editor In The WordPress Text Widget

June 20, 2013 · 3 comments

by Lars

WordPress is bundled with a WYSIWYG visual editor called TinyMCE. It features basic buttons for creating your posts and pages without the need to learn and master HTML markup and coding. This is great and one of the things that make WordPress to easy to use. One area where WordPress lacks an important feature, however, is the support for a WYSIWYG editor in widgets. There is a text widget in WordPress, but it only offers a simple plain text input field for the content. This means adding links and images require experience with coding HTML elements.

The test widget allow the webmaster to add text based content to sidebars in the theme. As WordPress themes tend to have more and more sidebars and use them as content placeholders, I see a strong need for a widgetized WYSIWYG solution.

Black Studio TinyMCE Widget is an interesting plugin for closing the gap. It provides you with a rich text widget in your sidebar or any widgetized area on your website. You can switch between the Visual and HTML mode, insert images/ videos from the WordPress media library, insert links to existing WordPress post or pages, full screen editing mode, widget accessibility mode and multiple languages supported.


ElegantThemes
ThemeForest

Advertisement

The plugin is available via the WordPress codex and you can download and install it in your server in less than 2 minutes. Once installed you will find a new widget available under Appearance > Widgets. Here youuse it by dragging the Black Studio TinyMCE widget into a sidebar.

black-studio-tinymce-widget-area

Black Studio TinyMCE Widget.

You can immediately add your text at the TinyMCE widget area and format it like any other text in the WordPress Visual editor.

text-widget-rich-text

Black Studio TinyMCE rich text format.

The plugin also allows you to edit in full screen mode.

full-screen

Black Studio TinyMCE Widget editor in full screen mode

Adding images is similar to the default WordPress Visual editor. Click on the Add Media Function and select from the pictures you previously uploaded.

adding-images

Save the widget and refresh your page. In our example, the text widget was placed in the sidebar so you can immediately see it in your website.

sidebar

Black Studio TinyMCE widget is a tiny little plugin that adds a powerful feature to your website. You can place any type of content to all widgetized areas of your page. This is one highly recommended visual editor plugin for the powerful aidebar system in WordPress. it can speed up the process of building your site without the need of going through complicated widgets or HTML programming. You can check out the plugin here.

Author : Lars Vraa

Lars is passionate about web design, web development, SEO, social media and loves to look into new technologies, techniques, tools etc. and to write articles for tripwire magazine readers.

{ 3 comments… read them below or add one }

Sonny June 22, 2013 at 2:16 am

Awesome tutorial Lars. Thanks for sharing! This will be very helpful.

Reply

Y8 Girl June 19, 2013 at 3:32 am

Hi there everyone, it’s my first go to see at this website, and piece of writing is genuinely fruitful designed for me, keep up posting these posts.

Reply

Jose Carlos June 17, 2013 at 8:59 am

Very good!!!
Thanks!!!

Reply

Leave a Reply

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

Previous post:

Next post:


Web Analytics