As we have explained in this post, one of the many benefits of using the WordPress web publishing application for managing and growing your digital presence is that WordPress makes it very easy to add content, expand your website’s functionality, or rearrange the site’s layout without coding skills and knowledge required.
WordPress lets you quickly and easily insert, delete, and reorganize content on your website’s sidebar area (and header and footer sections too, 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 theme you have installed) like:
- website page list
- categories
- blog post archive
- menus that display only the pages you select
- links to resources
- posts that you want to promote
- recent comments
- advertising banners
- customer testimonials
- survey results
- RSS content
- shopping cart forms
- images
- Facebook feeds
- add widgets from other sites (e.g. StumbleUpon)
- administrative forms (e.g. login, register, etc.)
(WordPress widgets make managing and using WordPress easier)
To learn more about what WordPress widgets are, how widgets work and why widgets can make managing your site easier, go here:
In this tutorial we are going to show you how to use and configure a number of commonly-used widgets in WordPress.
Using WordPress Widgets
The Basics
Before we get into configuring and using widgets, it helps to first cover some of the basics about using widgets:
Most WordPress Themes Support Widget-Ready Areas
Many WordPress themes support widgets and provide widget-ready areas in the theme’s layout where widgets can be used, such as the sidebar navigation area, header area, and footer. Depending on the theme, widgets can also be used below or above the content area …
(Many WordPress themes offer users a number of widget areas)
These widget-ready areas correspond to a feature inside your Widget panel called “Widget Areas” …
(Widget Areas)
The Widgets Panel
The Widgets panel displays a list of all the widgets that are currently available for use on your site.
On the right-hand side of the window, you can see the “active” widgets …
(Activate or deactivate widgets by dragging & dropping)
Available widgets can be made Active or Inactive by dragging-and-dropping items to different areas of the screen.
Widgets dragged from the Available Widgets section to widget areas like your sidebar, footer, etc. become active and available for use.
In addition, the Widgets area includes an Inactive Widgets section that lets you remove widgets that you no longer want on your website. Inactive widgets do not lose their pre-configured settings.
Reorganize WordPress Widgets With Drag-And-Drop
You can easily add, activate, deactivate, reorder and delete things using widgets with drag and drop in your Widgets section …
(Rearrange your site’s widgets using drag & drop)
You can also easily reconfigure your theme’s layout by dragging and dropping widgets.
For example, take a look at the image below. In this site, the widgets have already been configured to show the following:
- A newsletter subscription form,
- A click for support button, and
- A ‘click to call’ feature from a widgetized WP plugin (i.e. a WordPress plugin with an accompanying widget) …
(Widgets control how certain features display on your WordPress site)
Looking inside the Widget area, you would see that the front end features display on the site’s sidebar section in the same order as they have been arranged in the back-end widget section …
If we reorganize these widgets in the Sidebar Widget Area by dragging & dropping some of the elements around …
(Drag-and-drop to rearrange widgets in the widget area)
The widget features have now been reorganized in your sidebar …
This instantly reorganizes the layout of your sidebar.
Reorganizing sidebar elements using widgets can improve visitor experience.
Note in the screenshot below that the ‘click to call’ function (3) is now first the sidebar navigation area, and the support graphic banner (2) can now be found above the newsletter subscription form (1) …
(Rearrange sidebar elements using widgets to improve your site’s visitor experience)
Deleting Widgets From Your WordPress Blog Sidebar Navigation Menu
Deleting widgets from the sidebar navigation section is very easy.
For example, let’s remove the Search widget from the sidebar navigation area …
(Search widget)
To remove an active widget, either open up the widget settings and click the Delete link …
(Deleting a widget)
Or just drag the widget out of the Active Widgets section and into the Inactive Widgets area …
(How to remove your widgets)
Repeat this process for all widgets you want to remove from the sidebar. You can always reinstate a widget by dragging it back into the active widgets area.
Widget Settings
Most widgets can be further customized. This can include things like hiding information from users (but allowing access to registered users), displaying additional forms, fields, or data, specifying sizes of sidebar images, videos, etc.
Clicking on the little triangle in the corner of a widget toggles between expanding and collapsing the item and displays the settings for the widget …
(Toggling expands/collapse widget settings)
When the widget expands, you can change and save your settings, remove your widget from the “Active Widgets” section, close the widget, or click on the triangle to collapse the widget settings …
(Widget settings)
Some widgets give you little to no customizable options, or they may only allow you to add an optional title …
(Some widgets give you little to no customizing options)
Preview Your Widgets
Depending on which theme you use, you’re also able to customize and manage your widgets without actually making 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.
Widget management is a valuable feature of WordPress. You can work in preview mode inside the WordPress Theme Customizer screen (Appearance > Customize) and see how the widget content will appear before publishing any changes you’ve made (and avoid making errors), or configure widgets on the fly using the Widget editor area.
(Edit widgets live in the Customize section)
If you need to make changes to your site while viewing the front-end, just click on the Customize link …
(Toolbar Customize Link)
This brings you to the Customizer section in the back-end.
You can do many edits and adjustments to widgets in preview mode (like adding, deleting and reorganizing your widgets), and this will all be done in real time. If you are happy with what you’ve done, click the “Save and Publish” button and your changes will instantly become visible on your site to visitors.
(Widget management – configure widgets on the fly!)
After saving the changes, your new settings will automatically show on your site.
Because WordPress Themes can display elements differently on your site, we recommend that you install your theme first before configuring widgets on your sidebar navigation menu.
Also, remember to use the Customizer feature to preview all changes. This will save you from having to keep two browsers open while you work through this tutorial.
Now that you know the basics of using widgets, the next step is to configure various frequently-used WordPress sidebar widgets.
***
This is the end of section one of this series of tutorials.
To keep reading, click this link:
***
"I was absolutely amazed at the scope and breadth of these tutorials! The most in-depth training I have ever received on any subject!" - Myke O'Neill, DailyGreenPost.com
***