WordPress widgets make things easier for beginners. Previously, we showed you how you can make your own custom WordPress widget, and how to make text widgets colorful and fun. We also showed how to add widgets in post or page content. But a beginner level user who has never written HTML markup would probably be unable to add any images or links (very basic essentials) in a plain text widget. In this article, we will show you how to use visual editor to create widgets in WordPress.
WordPress comes with a text widget which can be used to add text and HTML. It comes with just a text box, and if you want to add images, links, or lists, then you will have to write the HTML code. The problem is that most beginners don’t know how to write HTML and CSS code. So the goal is to find a solution that allows users to create widgets in a WYSIWYG (what you see is what you get) visual editor.
First thing you need to do is install and activate the WYSIWYG Widgets plugin. Upon installation, the plugin adds a new menu item called Widget Blocks in your WordPress admin sidebar. Go to Widget Blocks » Add New to create a new widget block.
Widget blocks are a custom post type, so when adding a new widget block you will be using the same visual editor you use to create posts and pages. You can take full advantage of the visual editor and add links, images, lists, or anything you want in the visual post editor. Once done, publish your widget block.
Now go to Appearance » Widgets and drag-drop WYSIWYG Widget to your sidebar. Under the Widget Block click to show drop down and select the Widget Block you created earlier. Save your changes and preview your website.
If you are developing a WordPres site for clients who don’t know any thing about HTML, or if you are a beginner yourself, then you can use this technique to create custom widgets in WordPress. We hope you found this article helpful. For feedback and questions, please leave a comment below.
