This tutorial shows you how to install, add, customize and remove WordPress Widgets to get the functionality you need from your web site.

WordPress Widgets

WordPress Widgets add content and features to your Sidebars. Examples are the default widgets that come with WordPress; for post categories, tag clouds, navigation, search, etc. Plugins will often add their own widgets, once installed.

Widgets were originally designed to provide a simple and easy-to-use way of giving design and structure control of the WordPress Theme to the user, which is now available on properly “widgetized” WordPress Themes to include the header, footer, and elsewhere in the WordPress design and structure. What Widgets are available and what they do are highly dependent on the Theme chosen. So, for more information, see the Theme documentation, if available. If there is no documentation, then you can just play around and see what each Widget does.

The WordPress Widget Panel

Widgets can be added, removed, and rearranged from the WordPress Appearance -> Widgets sub-menu. That will take you to the Widget Panel. The order and placement of each Widget is set by the WordPress Theme. Some Widgets offer customization options such as forms to fill out, optional images, and other features. The Widgets Sub-Panel explains how to use the various Widgets that come delivered with WordPress.

Plugins that come bundled with widgets can be found in the WordPress Plugin Directory.

Adding Widgets

WordPress comes prepackaged with a variety of Widgets. If those are insufficient for your needs you can install new ones by searching the WordPress Plugins Directory which is accessible from the Plugins -> Add New sub-menu.

Before you can add a Widget you must verify that the Theme you’re using supports Widgets. You can do so by simply navigating to the Appearance menu and looking for a sub-menu titled Widgets. If it does, you can add widgets by following these steps:

  1. Go to Appearance -> Widgets.
  2. Choose a Widget and drag it to the sidebar where you wish it to appear. There might be more than one sidebar option, so begin with the first one. Once in place, WordPress automatically updates the Theme.
  3. Preview the site. You should find that the “default” sidebar elements are now gone and only the new addition is visible.
  4. Return to the Widgets Panel to continue adding Widgets.
  • To arrange the Widgets within the sidebar or Widget area, click and drag it into place.
  • To customize the Widget features, click the down arrow in the upper right corner to expand the Widget’s interface.
  • To save the Widget’s customization, click Save.
  • To remove the Widget, click Remove or Delete.

If you change WordPress Themes, the Widgets will return to the left side of the page in the Widget Archives or Available Widgets list. You may need to add them again and rearrange them depending upon the Theme’s ability to preserve other Theme’s Widgets.

Using the Text Widget

The Text Widget is one of the most commonly used WordPress Widgets that comes with every WordPress installation. It allows users to add text, video, images, custom lists, and more to their WordPress sites. This Widget may need you to write some HTML or to copy it from another site and paste it in.

To use the WordPress Text Widget:

  1. Go to Appearance -> Widgets in the Navigation Menu.
  2. Open the sidebar, footer, or Theme section to which you wish to add the Text Widget.
  3. Find the Text Widget in the list of Widgets.
  4. Click and drag the Widget to the spot you wish it to appear.

To open and edit the Text Widget:

  1. Click the down arrow to the right of the Text Widget title.
  2. Set the Text Widget Title (optional).
  3. Add the text or HTML code to the box or edit what is currently there.
  4. Choose the option to Automatically add paragraphs to wrap each block of text in an HTML paragraph tag (recommended for text).
  5. Click Save to save the Text Widget.
  6. Click Close to close the Text Widget.
  7. Switch tabs in your browser and preview the results and make changes, if necessary.

The Text Widget can hold a variety of HTML, XHTML, and multimedia links and players such as video and object embeds.

Styling the Text Widget

Standard image alignment CSS styles such as alignleft, alignright, and aligncenter apply for images.

To use the default styles of the WordPress Text Widget, use the following example:

<div id=”primary”>

<ul>

<li id=”text-1″><h3>Widget Title for First Text Widget</h3>

<div>Text within the text widget area.</div>

</li>

<li id=”text-2″><h3>Widget Title for Second Text Widget</h3>

<div><p>Text for second widget text area.</p></div>

</li>

</ul>

</div>

Using the RSS Widgets (Links & RSS)

RSS stands for Really Simple Syndication. It is a way for you to subscribe to content on the Internet and to provide content from your site for others to subscribe to. If you have never subscribed to an RSS feed before, it’s OK. You can at least provide feeds for others to subscribe to. There are two built-in WordPress RSS Feed Widgets. The Links Widget displays a list of the links to various Posts and Comments as RSS feeds that others can subscribe to. The RSS Widget allows you to integrate an external RSS feed into a Widget area of your site, such as your Twitter account, Facebook posts, Google+ posts, or other blogs.

The Links Widget offers the option to title the section and choose which type of feeds to offer to visitors to add to their feed reader. This widget does not display feed content, just the links to the feeds.

  • Posts displays the most recently published content in their feed reader.
  • Comments displays the most recent comments in their feed reader.
  • Posts and Comments displays a combination of both in their feed reader.

The visitor will typically click the link to add the feed to their feed reader.

The RSS Widget displays the most recently published content from any source with an active feed. This is an ideal way of integrating outside content into your site. By default, WordPress RSS Widget displays the post title or the first 100 or so characters of a Tweet or long untitled post. These are either in the form of a link or features a link to the original source depending upon the feed’s design and structure.

  1. Enter the RSS feed URL in the first form, copied from the source page for the content you wish to include in your sidebar or other “widgetized” space.
  2. Give the feed a title: This is optional and gives you the chance to showcase the source of the content.
  3. How many items would you like to display: By default, 10 are show, but you can choose from 1-20 posts.
  4. Display item content?: This allows you to show an excerpt of the content not just the title.
  5. Display item author if available?: If you wish to give credit to the original author of the content, check this to display the author.
  6. Display item date?: If available, the date of the original content will be shown.

You may add multiple RSS Widgets for incoming feeds to your WordPress sidebar and other “widgetized” areas of your site.