Widget-Ready Sidebars make it easy for webmasters and web developers to create a WordPress website easily. Without widgets, it could not be possible for so many webmasters to develop their own websites without having web development skills.
In this blog, I am going to share with all newbie web developers and webmasters who want to learn WordPress for building their websites & are curious about adding widget-ready sidebars because not all of the themes provide them.
What is a Widget?
Widgets are executable scripts that one can easily drag and drop to the sidebars of your WordPress web design theme.A widget can contain links,pages,search bar,image sliders,texts,advertisements,RSS,comments,calendar and lot more.You don’t need to be a web developer in order to manage the widgets & put them in the sidebars or your WordPress website.
Registering the Sidebars
If your theme doesn’t provide widget-ready sidebars, then you will need to register those sidebars and call them wherever you want to. Let’s go through the process of registration of sidebars first.
In order to register a sidebar for your WordPress website theme, you need to add a few code snippets (as shown below) to the functions.php file. These codes may look scary to you if you don’t have any web development skills but believe me if you go through the process carefully, you can do it. You can perform this step either by using the FTP tool or opening the functions.php file directly(Appearance>Editor) from the editor section.
[cc]
* Theme widget area
*/
add_action( ‘widgets_init’, ‘weblizar_widgets_init’);
function weblizar_widgets_init() {
/*sidebar*/
register_sidebar( array(
‘name’ => __( ‘Sidebar’, ‘weblizar’ ),
‘id’ => ‘sidebar-primary’,
‘description’ => __( ‘The primary widget area’, ‘weblizar’ ),
‘before_widget’ => ‘<div class=”enigma_sidebar_widget”>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<div class=”enigma_sidebar_widget_title”><h2>’,
‘after_title’ => ‘</h2></div>’
) );
register_sidebar( array(
‘name’ => __( ‘Footer Widget Area’, ‘weblizar’ ),
‘id’ => ‘footer-widget-area’,
‘description’ => __( ‘footer widget area’, ‘weblizar’ ),
‘before_widget’ => ‘<div class=”col-md-3 col-sm-6 enigma_footer_widget_column”>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h3 class=”enigma_footer_widget_title”>’,
‘after_title’ => ‘<div id=”” class=”enigma-footer-separator”></div></h3>’,
) );
}
[/cc]
In the above snippet, you will just need to replace the theme name (‘weblizar’ here) with yours and the sidebar ID (‘sidebar-primary’ & ‘footer-widget-area’ here) with the one you wish to name. Once you add these codes and save your file, your widgets-ready sidebars would be registered.
Now you may go to Appearance > Widgets and drag and drop the widgets to these sidebars in a few seconds.
Since we have just registered the sidebars till now and haven’t called them in the theme files so they will not appear anymore. Now I will share with you how you can call these sidebars on any of the pages of your WordPress website.
Displaying the Sidebars
In order to show the sidebars in any of the theme pages of your website, you will need to edit the specific file for eg. footer.php,front-page.php, etc., and add the below code in the desired place:
[cc]if ( is_active_sidebar( ‘sidebar-middlebar’ ) ) : //check the sidebar if used.
dynamic_sidebar( ‘sidebar-middlebar’ ); // show the sidebar.
endif;
}[/cc]
That’s it. Now you can define your own widget-ready sidebars and call them anywhere you want.
