This step involves adding some more functions below your menu's function in the theme functions file:
functions.php
.?>
tag, add the following:function osmag_widgets_init() { register_sidebar (array( 'name' => __('Sidebar','osmag'), 'id' => "sidebar-widget-area", 'before_widget' => '<li id="%1$s" class="widget %2$s">', 'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">', 'after_title' => '</h2>' ) ); register_sidebar (array( 'name' => __('Left Footer','osmag'), 'id' => "footer-left-widget-area", 'before_widget' => '<li id="%1$s" class="widget %2$s">', 'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">', 'after_title' => '</h2>' ) ); register_sidebar (array( 'name' => __('Right Footer','osmag'), 'id' => "footer-right-widget-area", 'before_widget' => '<li id="%1$s" class="widget %2$s">', 'after_widget' => '</li>', 'before_title' => '<h2 class="widgettitle">', 'after_title' => '</h2>' ) ); } add_action('init', 'osmag_widgets_init'),
functions.php
file.We added the functions to register sidebars for our theme's footer and sidebar. Let's have a look at what we did.
Firstly, the sidebars we registered:
Now let's take a look at the code we used to register each widget area:
osmag_widgets_init
defines a new function for our theme based on widgets_init
register_sidebar
and an array of parameters__('Sidebar','osmag')
defines the sidebar name. It won't work without osmag
which echoes the function osmag_widgets_init
.sidebar-widget-area
is the unique ID for the widget area which we'll use shortly to add it to a template file. It's also used to give the widget area an ID which you can use for styling.<li id="%1$s" class="widget %2$s">
, which opens a <li>
tag and gives it an ID and class related to the widget name.</li>
closes the list item.<h2 class="widgettitle">
, which opens an <h2>
tag to display the title and gives it a class for styling.</h2>
closes the <h2>
element.add_action
adds an action based on our function to the init
action which WordPress always runs on starting upSo, we now have our widget areas registered. You'll now see them displayed on the Widgets admin screen: