WordPress Widgets are a tool for adding content to specific website areas, known as widget areas. They first appeared in version 2.2 of WordPress and still remain a crucial element for building a website. More specifically, it is impossible to make an effective website without them.

Creating a widget in WordPress is a simple task. Still, there are some important issues here, which I will explain further.

Once Again: What Is a WordPress Widget?
- What exactly are widgets used for?
How Do Widgets Work: Key Issues
How to Add a Widget to the WordPress Website?
To Sum Up

Once Again: What Is a WordPress Widget?

At the beginning of the article, I gave a short version of the widget definition. Here I want to clarify some aspects.

First of all, note this: through the WordPress widgets, it is possible to insert different content from the blog post to any web page you need. It helps you make the website more informative and interesting for visitors, extend its functionality, or improve its usability.

What exactly are widgets used for?

Let’s say you have a photography blog collecting and publishing gorgeous photos worldwide. You can use Facebook, Twitter, or Instagram widgets for WordPress to introduce your social media accounts. Besides, you can add a slideshow section to the homepage, demonstrating the most unusual images to catch users’ attention and motivate them to spend more time on the website. Widget functionality is also required to do it. View the Angry Birds website to get an idea of how it may look:

In addition, WordPress widgets help to solve various marketing and customer service tasks. For instance, you may add an online chat or shopping cart to the widget area to provide customer support to users or help users make an order at any time. Widgets are also necessary to insert ad banners, testimonials, and announcements to the website. I am sure you understand how important such things are for marketing promotion.

There are also some creative ways to use WordPress widgets. For example, this website demonstrates its navigation menu exactly from the widget area. Looks fascinating, don’t you agree?

creative usage of WordPress widget example — *Source*

As example, I used widgets for my demo website to show the newly added chapters of the novel. For now, it looks like this:

However, these are but some examples of how to use WordPress widgets. With their help, it is possible to give effect to any decision or concept, depending on your goals and needs.

How Do Widgets Work: Key Issues

Like any other tool, using WordPress widgets has its specifics. Here I want to clarify three essential things about it:

Widget areas can be added to any website spot

To be more precise, widget areas locate in the sidebars, footer, or/and header of the website.

Note:

Sidebars look like vertical columns to the left and right of the website’s main content.

The footer is the lowest section of the website, while the header is an area located in the very top part of the website. Read about essential header elements to get more details.

Normally, each WordPress theme has at least one inbuilt widget area. Free-to-use themes usually contain sidebars only, while premium themes may also have footer and header widget areas. As a result, the default WordPress widget menu may look differently for the theme with footer and header widget areas and without. Still, regardless of the installed WordPress theme, you are always welcome to add more widget areas to the website using codes or plugins.

NOTE:

All these requirements refer to the default WordPress editor (Gutenberg). Those who use Elementor editor to build WordPress sites can add widgets to any widget area, no matter what theme they use.

WordPress has pre-installed widgets

Previously, I wrote that a widget might contain any type of content. Some of these types of content are already available on WordPress by default, meaning you need only choose them from the list to create a widget. In some cases, this is enough to add the desired website functionality.

The list of most popular default WordPress widgets includes:

Headings – adds headings and titles;
Text – adds short texts to the widget areas;
Image – allows downloading various photos and pictures;
Video – showcases short videos;
Gallery – displays multiple images in a grid format or as a slideshow;
Recent Comments – shows the last added comments on the website;
Recent Posts – works the same way as Recent Comments, only showing the last published posts;
Categories – displays the posts categories in the widget area;
Navigation – visualizes the website’s navigation menu in the widget area;
Social Media – this widget for WordPress allows displaying links to your social media accounts.

Default WordPress menu also provides a limited number of tools to edit widgets’ content. For example, you can resize the images, set up headings styles, change the widget’s position in the widget area, and so on.

To add even more content and functions to the widget, use WordPress plugins like JetElements from Crocoblock.

WordPress widgets are easy to use

Of course, beginners may argue with me about that, which is hardly a surprise. At first glimpse, the WordPress Widget menu really looks confusing. It can be hard to understand how everything works on the fly. But there is nothing to worry about. All you need is a little practice and Crocoblock guides. 🙂

Note that to add widgets to WordPress, you don’t need coding skills. Widgets were created to help people without a technical background make multifunctional websites in no time. That is why you can add widgets literally in a couple of clicks.

How to Add a Widget to the WordPress Website?

There are a few different methods to work with WordPress widgets for Gutenberg and Elementor.

To add widgets in Gutenberg:

Open your WordPress dashboard.
Click Appearance in the panel from your left, and choose Widgets from the list.
Click Sidebar (or any other widget area if they are available).
After that, you can insert into the widget area any content you need. If problems occur, tap Options > Help, and read the Widget guide from WordPress.
Finish editing and click the “Update” button in the right corner of the interface.
That’s it! Your widget is ready to work.

NOTE:

After tapping the “Update” button, the widget will be automatically added to your website. If, for some reason, you don’t want this to happen, click Inactive widgets instead of choosing Sidebars (or another widget area), as Step 2 mentioned. This menu lets you create and keep widget drafts. You can move them to any widget area whenever you like.

Another way to add a widget to the WordPress Gutenberg editor:

Open the website’s page where you want to insert a widget in the browser.
Press the “Customize” button from the panel on the top (you can see it on the screenshot below). A new menu will open after that. Scroll down to find the “Widget” button and click on it. Now a widget editor will appear on the left part of the screen. With its help, you can set up the widget as needed.
Click “Publish” to add the widget to the page.

customize the widget in gutenberg editor

To add widgets in Elementor:

Open Elementor Editor.
Proceed to Sidebar > Choose Sidebar, and select a sidebar you want to add to the page. In this case, however, Elementor will automatically add widgets you have in the default WordPress Widget Menu. It means you have to create a widget in the default editor first. Or, you may install plugins like JetPlugins, which add ready-made widgets to the Elementor editor. To learn more, watch how to use JetElements widgets guides.

To Sum Up

I tried my best to collect all the vital information about WordPress widgets. I hope it helps you grasp the essence and make your first widget without problems.

And if you are ready to increase your knowledge about how to use WordPress widgets, read our manuals about widgets to use for landing page creation and the best JetWidgets for Elementor.