WordPress widgets. Half a decade back, when I was looking for an elegant, easy to follow, robust blogging platform, WordPress turned out to be a beast for me. Of course, with time it has grown into a bigger (and tamable) beast – thanks to the consistent self-reinventions. However, truth to be told, the WordPress defaults have seldom cut the ice with me, or for that matter, with anyone with a reasonable experience in web development.
For what it’s worth, WordPress does come with certain limits. They may be incognito to a rookie but they are there. One such amazing feature of WordPress that I feel can be built into so much more is the widgets.
The default widgets allows you to embed additional functionality into your theme. But, it doesn’t serve your purpose when you’re looking for a more wholesome website that fits the description of how you want it to function.
Now, there is a whole lot of literature dedicated to how you can create your own widgets and add them to your website, but let’s face it, they are hardly comprehensible to those who are novices to the workings of WordPress. Keeping in mind the same, I put forth a set of easy-to-follow instructions that even the greenhorns can understand and implement in order to add the custom widgets to their websites.
An Overview of WordPress Widget
WordPress widgets were created to provide WordPress users a convenient way to have control over the design and structure of any WordPress theme. The best aspect about widgets is that you can simply drag and drop them into your website widget areas, making it possible for users to add certain functionality without fiddling with code. A widget contains static content like advertisements, email newsletters etc. Additionally, you can use widgets to display content dynamically, such as latest news feeds, Twitter feeds from your account, countdowns to a certain event and so on.
How to Add a Custom Widget to Your Pages/Post?
This process is divided into two steps:
Step 1 – In order to implement a widget and widget area into your theme, you’ll need to register them first. In our case, we want to register a simple sidebar. Take a look at the following code snippet and place it in your theme’s functions.php file to see the widget in action.
register_sidebar(array(
'name' => __('Custom Widget Area '),
'description' => __('Description for this widget...'),
'id' => 'my-custom-widget',
'before_widget' => '<div id="%1$s" class="%2$s">',
'after_widget' => '</div>',
'before_title' => '<h3>',
'after_title' => '</h3>'
));
This code helps to register a single sidebar – Custom Widget Area – on the WordPress dashboard. And then, the code declares an array with values needed to create the custom widget in your theme, such as:
- name: It helps to identify the name of our custom Widget on the Widgets screen. (you can replace it with your Widget name that you want to create).
- Description: The description parameter can be used to tell users what appears in the sidebar of our theme.
- id: The id parameter is used to call that custom widget in the code.
- before_widget: It accepts html tag which appears before your custom widget.
- after_widget: It accepts html tag which appears after your custom widget.
- before_title: This parameter accepts html tag that come before your custom widget title
- after_title: This parameter accepts html tag that come after your custom widget title.
Step 2 – After getting your custom Widget registered, you can drag and drop the Widget into your WP theme from Appearance -> Widgets screen. However, the custom Widget won’t appear on your theme until it is being called from the place you want to display it.
You can use it in any session of your WordPress website, by calling the function as given below in your functions.php file
<?php dynamic_sidebar( 'my-custom-widget' ); ?> //my-custom-widget is the id of your widget
After this step, move to your widgets panel and you’ll see the newly created “Custom Widget Area”. Now all you need to do is drag and drop the elements that you want to show up in your Custom Widget Area (as shown in the screenshot above) in your theme.
Wrapping Up!
Widgets can be used to add more functionality into your WP theme. Widgets can be added to your WordPress posts as well as page content. Usually they are placed into widgetized regions provided by your theme – be it a sidebar, footer, header any other widget-ready areas in your theme. By default WordPress comes with several built-in widgets, but you can choose to create your own custom widget as well.
Hopefully reading this post will help you give a basic understanding of adding more custom Widgets to your WordPress pages or posts successfully.
