As we explain in this article, there are so many great benefits in using WordPress for managing and growing a web site. One of these is that you can easily add content, enhance your site, or reconfigure your site’s layout without the need to have web coding skills or knowledge.
WordPress gives you the ability to quickly and easily add, delete, and reorganize content on your site’s sidebar menu (and 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’s sidebar area (plus headers and footers and other areas, depending on the WordPress theme you have installed) like:
- site pages
- blog categories
- archives
- menus that display only the pages you select
- links to resources
- your most read posts
- recent comments
- advertisements
- client testimonials
- surveys & polls
- RSS content excerpts
- opt-in form
- video galleries
- twitter feeds
- display widgets from other sites (e.g. affiliate programs)
- administrative forms (e.g. login, register, etc.)
(WordPress widgets make managing and using WordPress easier)
To learn more about what widgets are, how widgets work and how using widgets can help you expand the functionality of your website, see this article:
In this step-by-step tutorial series you will learn how to use and configure various frequently-used widgets in WordPress.
Using Widgets In WordPress
The Basics
Before we start learning how to configure widgets, let’s first make sure that you understand some of the basics of how to use widgets:
Most WordPress Themes Support Widgetized Layouts
Most WordPress themes support widgets and provide areas in the theme’s layout where widgets can be added to, such as the sidebar section, header area, and footer sections. Depending on the theme installed on your site, widgets can sometimes also be added below or above the content area …
(Many themes provide a number of widget-enabled areas)
These widgetized areas correspond to a feature inside the Widget management screen called “Widget Areas” …
(Widget Areas)
Widgets Panel
The Widgets panel displays all the widgets that can be used on your site.
On the right-hand side of the screen, you can see the “active” widgets …
(Widgets can be activated or deactivated using drag-and-drop)
Available widgets can be activated or deactivated using drag & drop.
Widgets dragged from the Available Widgets section to widget areas like the sidebar, footer, etc. immediately become active and available for use on your site.
The Widgets panel also includes an Inactive Widgets section that lets you remove any widgets that you no longer want on your website. Inactive widgets do not lose their pre-configured settings.
Reorganize Widgets Using Drag & Drop
You can easily add, activate, deactivate, reorder and remove things using widgets using simple drag & drop in your Widgets area …
(Rearrange widgets on your WordPress site using drag and drop)
You can also easily reconfigure the layout of your website’s widgetized areas with drag-and-drop ease.
For example, in the image below, the widgets have already been configured to display the following to visitors:
- A subscription form,
- A contact support button, and
- ’Click to call’ feature from a widgetized WordPress plugin (i.e. a WordPress plugin that adds an accompanying widget to your site) …
(Widgets control how certain features appear on your WordPress site)
Inside the Widget area, you would see that the front end features display on the site in exactly the same order as they have been arranged in the backend widget area …
If we rearrange the order of the above widgets in the Active Widget Area by dragging and dropping elements …
(Drag and drop widgets in the widget area to rearrange their order)
The widgets have now been reorganized in your sidebar section …
As you can see, this immediately reorganizes the layout of the sidebar.
Reorganizing sidebar layout with widgets can help improve user experience.
Note in the screenshot below that the ‘click to call’ feature (3) is now first the sidebar, and the ‘contact us’ graphic banner (2) is located above the newsletter opt-in form (1) …
(Rearrange sidebar elements with widgets to improve your site’s visitor experience)
Removing Widgets From Your Sidebar Navigation Section
Removing widgets from the sidebar menu is very easy.
For example, let’s delete the Search widget from your sidebar …
(WordPress Search widget)
To delete a widget from an active Widget area, either open up the widget and click the Delete link …
(Delete a WP widget)
Or just drag the widget out of the Active Widgets section and into the Inactive Widgets section …
(How to remove your WordPress widgets)
Repeat this process for any other widgets you want to remove from your sidebar menu. You can always reinstate widgets by dragging them back into the active widgets area.
Widget Settings
Many widgets can be customized. This includes hiding information from users (but allowing access to registered users), displaying additional forms, fields, or information, specifying dimensions of sidebar images, videos, etc.
Click on the little triangle in the corner of a widget to toggle between expanding and collapsing the item …
(Toggles expand/collapse widget settings)
When the widget expands, you can change and save your settings, click Delete to delete your widget from the “Active Widgets” section, close the widget, or click on the triangle to collapse the widget …
(Widget settings)
Some widgets provide users with little to no customizable options, or they may only allow you to add something like an optional title …
(Some widgets give you little to no customizable options)
Widget Customizer Section
Depending on which theme you are using, you can also customize your widgets without actually making changes to your site. This way, you can be sure that you like your customizations before committing anything to your site.
The ability to manage widgets from your 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 (to avoid making mistakes), or manage your widgets on the fly using the Widget editor screen.
(Edit widgets live in the Customize feature)
Wherever you are on the front-end just calick the Customize link in the toolbar …
(Customize link in the toolbar)
This will bring you to the Customizer feature in the back-end.
You can do many edits and adjustments to widgets in preview mode (like adding, deleting and moving widgets around), and see all changes in real time. If you like the results, click the “Save and Publish” button and your changes will instantly become available to your site visitors.
(Widget management – work in preview mode)
Once you have saved your changes, your site will automatically update the widget settings and display the new configuration to your site visitors.
Because the theme you choose affect how elements display on your site, we recommend installing the theme first before configuring widgets.
Also, remember to use the Customizer feature to preview all changes. This saves you from having to keep two browsers open while you complete this tutorial.
Now that you know the basics of using widgets, the next step is to start configuring various frequently-used WordPress sidebar widgets.
***
This is the end of part one of this tutorial series.
Click on this link to keep reading:
***
"I am beyond impressed with what you have put together. I can tell that you put a ton of hard work into building what you have. You have the absolute best content on WordPress I have ever seen!" - Robert T. Jillie
***