Back to blog

WordPress Widgets are used for adding the features and content to your Sidebars. The example shows default widgets for tag clouds, navigation, post categories, search etc., which are delivered with WordPress. Plugins, however, often introduce widgets of their own.

Getting Started With WordPress Widgets

The initial purpose of widgets is to provide the user with a user-friendly and simple way to control the design and structure of the WordPress Theme. Nowadays, this feature is common among properly “widgetized” WordPress Themes. This allows the users to include widgets in the footer, header or otherwhere in the WordPress design and structure.

WordPress Widget Panel Example

Expertise or code experience are not essential for using widgets. In fact, users can easily add, rearrange or remove them on the WordPress Administration Appearance > Widgets panel. The placement and order, determined by WordPress Theme, can be found in the functions.php file. Apart from that, WordPress Widgets may offer such customization options as fill-out forms, information and data includes or excludes, optional images, and other features.

The Widgets SubPanel includes a user guide on different widgets that are installed along with WordPress.

Users can also find plugins that are packaged with widgets in the WordPress Plugin Directory.   

How to Install Widgets

WordPress is originally pre-packaged with a number of Widgets. In case default ones do not serve your purposes, you are free to install new widgets by browsing the WordPress Plugins Directory that can be accessed from the Plugins -> Add New menu. 

Displaying Widgets 
Actual Widgets in Actual Widget Areas

Before you start adding new widgets, you must make sure that your current Theme supports Widgets (Widget Areas, to be more precise). In this case, you only have to go to the Appearance menu and search for a sub menu entitled “Widgets”. If everything is compatible, you can add widgets by completing the following steps:

  1. Navigate to Appearance > Widgets.
  2. Select a Widget and either click on it (if your Theme has several destination sidebars, you will have to select the one you need), or simply drag it to the sidebar of your choice and hit the “Add Widget” button. If there is a few sidebar options, you need to begin with the first one. When done, WordPress will update the Theme automatically.
  3. Preview the website. You should notice that standard sidebar elements are no longer available, substituted by newly added widgets that are now the only visible items.
  4. To keep adding widgets, go back to the Widgets Panel.
  5. To organize the Widgets within the Widget area or sidebar, click on the element and drag it into position.
  6. If you want to customize widget features, expand the Widget’s interface by clicking the down arrow in the upper right corner.
  7. Click “Save”, to save the widget’s customized features.
  8. Click “Delete” or “Remove”, if you wish to remove the widget.

Whenever you change Themes in WordPress, the Widgets are moved to the Available Widgets list or Widget Archives on the left side of the page. To keep using them, you will have to add and rearrange them based on the Theme’s ability to maintain the Widgets from other Themes.

Widget Areas

Most commonly, widget areas can be found in webpage sidebars, however, a theme can locate widget areas anyplace on the page. For instance, in the Twentyfourteen theme, apart from the traditional sidebar locations, the widget area is also placed in the footer of each page.

In case your Theme does not have a pre-defined Widget Area, yet you want to place a widget on this Theme, some programming knowledge along with the instructions on the Widgets API section will be of use.

How to Use Text Widgets

Among the widgets that are delivered on default every time WordPress is installed, the Text Widget is among the most frequently used. With this element, users can add text, images, video, custom lists etc. to their WordPress websites.

In order to use WordPress Text Widget, follow these steps:

  1. Move to Themes > Widgets that can be found in the WordPress Administration Panels.
  2. Open a Theme section, footer or a sidebar, which you want to add the Text Widget to.
  3. Open the list of Widgets and find the Text Widget.
  4. Click on the widget and drag it to the place you chose for it to appear.

To open and edit the Text Widget do the following:

  1. Hit the down arrow that can be found to the right of the Text Widget title.
  2. Create the Text Widget Title (not obligatory).
  3. Edit the data in the box, or add the HTML code or text.
  4. To enclose every text block in an HTML paragraph tag, select an option to Automatically add paragraphs (recommended for text).
  5. To save the Text Widget, hit “Save” button.
  6. To close the Text Widget, click “Close”.
  7. If you wish to preview the results and make some necessary changes, switch tabs in the browser you use.

The Text Widget supports a number of HTML, XHTML and multimedia links and players, for example, object embeds and video.

Text Widget Stylization

Such standard image alignment CSS styles as aligncenter, alignright and alignleft can be applied to images.

WordPress Text Widget allows users to specifically style different default styles simply by using this example:

<div id="primary">
 <li id="text-1"><h3>Widget Title for First Text Widget</h3>
 <div>Text within the text widget area.</div>
 <li id="text-2"><h3>Widget Title for Second Text Widget</h3>
 <div><p>Text for second widget text area.</p></div>
How to Add a Code to the Text Widget

It will take you no extra effort to add JavaScript, basic HTML and embeds to the WordPress Text Widget. Furthermore, the majority of the embed codes from multimedia social sharing sites will function without any problems in the WordPress Text Widget. Nonetheless, the Widget strips out the codes it cannot display, so such programming languages as PHP, along with active code will not work with Text Widget.  

There is a variety of plugins at the WordPress Plugin Directory designed to surpass WordPress restraints concerning the usage of PHP in posts, so to add active code to the Text Widget you can use one of them. However, some plugins may not work on widgets, so we recommend you to check that. 

Using RSS Widgets

WordPress has two built-in RSS, or Feed Widgets. With the help of the RSS Links, a register of the links to different core WordPress feeds can be displayed on you site for Comments and Posts. Apart from that, with the RSS you can integrate any external feed source for content, such as your Facebook account, Tweets, Google+ posts, or other blog, into a Widget area on your website.

The RSS Links Widget provides users with the option to give a title to the section and select the type of feeds that can be added to visitors’ feed readers. However, this widget showcases only the links to the feeds, yet does not show feed content.

  1. The latest content will be displayed in “Posts” in the visitor’s feed reader.
  2. Similarly, the most recent comments will be shown in the “Comments” section in the feed reader.
  3. The “Posts and Comments” option showcase a combination of both features in the visitor’s feed reader.

Typically, the feed can be added to the feed reader simply by clicking the link.

With the help of the RSS Widget, the newest published content from any source with an active feed will be displayed on your site. There is no better way to integrate outside content into you website.

The default WordPress RSS Widgets settings allow displaying a long untitled post or about a hundred of the first characters of a Tweet. Basing on the feed’s structure and design, these either feature a link to the original source, or are presented in the form of the link.

  1. To include the content to the sidebar or other widgetized place on your site, copy the RSS feed URL from the source page and enter it in the first form.
  2. Give the feed a title: While this is not compulsory, it allows you to display the source of the content.
  3. How many items would you like to display: by default, 10 elements will be shown, but you are free to choose from 1 to 20 posts.
  4. Display item content?: This option lets you display a fragment of the content, apart from the title.
  5. Display item author if available?: Select this option, if you want to give credit to the actual author of the content.
  6. Display item date?: If checked, this option allows showing the date the original content was published.

You are also free to add several RSS Widgets for incoming feeds to your sidebar and any other widgetized area on your website.

Popular Posts

Like This Article? Subscribe to Our Monthly Newsletter!

Comments are closed.