As we have explained in this article, one of the many benefits of using WordPress is that you can easily add content, enhance your site, or reconfigure the layout of your website without having any coding skills and knowledge.
WordPress allows you to quickly and easily add, remove, and rearrange content in your site’s sidebar navigation area (or header and footer sections, depending on what theme you use) using widgets.
Once you know how to use widgets, you can easily add things to your site like:
- page lists
- post categories
- archive
- menus
- links to resources
- most popular posts
- recent comments from users
- clickable ad banners
- customer testimonials
- surveys & polls
- content from RSS feeds
- newsletter registration form
- video
- social media buttons
- display widgets from other sites (e.g. Twitter)
- administrative forms (e.g. login, register, etc.)
(Widgets help make managing and using WordPress easier)
To learn more about what widgets are, how widgets work and why widgets can make managing your site easier, go here:
In this tutorial series we explain how to use and configure various frequently-used WordPress widgets.
How To Use Widgets
What You Need To Know First
Before configuring and using widgets, let’s first go over some of the basic concepts of how to use widgets:
Most WordPress Themes Support Widget-Ready Areas
Most WordPress themes support widgets and provide built-in widgetized areas in your theme’s layout where widgets can appear, such as the sidebar, header area, and footer. Depending on the theme installed on your site, widgets can also show up in the content area …
(Many WordPress themes offer users a number of widgetized sections)
These widgetized sections correspond to a feature inside the Widget administration panel called “Widget Areas” …
(Widget Areas)
Widgets Screen
The Widgets panel displays all the widgets that are available.
On the right-hand side of the window, you can see your “active” widgets …
(Widgets can be activated or deactivated using drag-and-drop)
Available widgets can be activated or deactivated by dragging-and-dropping items to different sections of the screen.
Widgets dragged from the Available Widgets section to widget areas like your sidebar, footer, etc. automatically become active and can be used for their purpose.
In addition, your Widgets screen includes an Inactive Widgets section that lets you remove any widgets that you no longer want to actively display on your website. Inactive widgets retain their settings.
Reorganize Widgets Using Drag-And-Drop
You can easily add, activate, deactivate, rearrange and remove widgets just by dragging and dropping items inside your Widgets area …
(Rearrange your site’s widgets using drag-and-drop)
You can also easily reorder the order and layout of your widget-enabled sections with drag & drop ease.
For example, take a look at the image below. In this example site, the widgets have already been configured to display things on your site like:
- A newsletter subscription form,
- A click for support banner, and
- ’Click to call’ feature from a widgetized plugin (i.e. a WordPress plugin with an accompanying widget) …
(Widgets control how certain features on your site appear)
If we take a look inside the example site’s Widget area, you will see that these features correspond to the order of widgets inside the active widget section …
If we rearrange the above widgets in the Sidebar Widget Area by dragging and dropping elements …
(Drag & drop to rearrange widgets in the widget area)
The widget features have now been reorganized in the sidebar menu …
This immediately reorganizes the order of items in your site’s sidebar.
Reorganizing sidebar layout with widgets can help improve your site’s visitor experience.
Note in the screenshot below that the ‘click to call’ feature (3) is now the first item on the sidebar, and the ‘contact us’ banner (2) has been moved to the spot above the newsletter sign-up form (1) …
(Reorganize sidebar layout using widgets to improve your site’s user experience)
Removing Widgets From Your WordPress Blog Sidebar
Removing widgets from your WordPress sidebar navigation area is really easy.
For example, let’s show you how to delete the Search widget from the sidebar …
(WordPress Search widget)
To remove a widget from an active Widget area, either expand the widget and click the Delete link …
(Delete your WP widgets)
Or just drag the widget out of the Active Widgets section and drop it into the Inactive Widgets area …
(Removing widgets)
Repeat this process for any other widgets you want removed from your sidebar. You can always restore widgets by moving them back into the active widgets area.
Widget Settings
Many widgets provide additional settings that allow you to further configure your site features. This includes making certain types of information hidden to visitors but visible to registered users, displaying additional forms, fields, or data, specifying sizes of sidebar images, videos, etc.
Click on the little triangle in the corner of a widget to expand the item …
(Toggling expands/collapse widget settings)
When the widget expands, you can change and save your settings, delete your widget from the “Active Widgets” section, close the widget, or click on the triangle to collapse the widget settings …
(Widget settings)
Some widgets provide users with little to no customizable options, or they may only allow you to add an optional title …
(Some widgets provide users with little to no configurable options)
WP Theme Customizer
Depending upon the WP theme you choose, you can also preview any changes live without making actual changes to your site. This way, you can be sure that you are happy with your customizations before making any permanent changes to your website or blog.
The ability to manage widgets inside the WP dashboard is a great feature of WordPress. You can work in preview mode inside the WordPress Theme Customizer screen (Appearance > Customize) and see how your widget content will appear prior to publishing any changes (and avoid making errors), or change your widgets on the fly using the Widget editor screen.
(Edit widgets in the Customize feature)
If you need to make changes to the site while viewing the front-end, just click on the Customize link …
(Customize link in the toolbar)
This brings you to the Customizer section in the backend.
You can do lots of things in preview mode (like adding, removing and reorganizing your widgets), and see all changes in real time. If you like what you’ve done, click the “Save and Publish” button and your changes will instantly become available on your site to visitors.
(Widget management – work in preview mode)
After saving the changes, your new updates will automatically be added to your site.
Because the WordPress theme you use affect how elements display on your site, we recommend that you install the theme first before configuring widgets.
Also, remember to use the Customizer feature to preview your changes. This saves you from having to keep two browsers open while you go through this tutorial (one to work in and one to check how the changes are coming along).
Now that you know the basics of using widgets, it’s time to learn how to configure various frequently-used WordPress sidebar widgets.
***
This is the end of part 1 of this tutorial about how to use Widgets.
To view the rest of this tutorial, click here:
***
"Learning WordPress has been a huge stumbling block for me. I've been looking for something that covers absolutely everything but doesn't cost an arm and a leg. Thank you so much ... you have just provided me with what I have been looking for! Truly appreciated!" - Tanya
***