The WordPress Dynamic Sidebar function

Your typical theme will have at least one sidebar. The code to define the sidebar is pretty straightforward.

Let’s say that our specific sidebar is wrapped in an <aside> and its header is wrapped in a <h3> tag. Our functions.php code defining this sidebar would look like this:

  'name' => __( 'Main Sidebar', 'butter' ),
  'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  'after_widget' => '</aside>',
  'before_title' => '<h3>',
  'after_title' => '</h3>',

Basically, we’re naming the widgetized sidebar “Main Sidebar”, wrapping it all in an aside element and setting any widget title within it to be inside h3. The above function registers and defines a sidebar named “Main Sidebar” and its HTML markup.

You’ll routinely find the need to have more than that one sidebar so you can just copy/paste the above code and change the name.

With the “Main Sidebar” defined in the functions.php, you can then call it in the front-end. In, e.g., the sidebar.php, we’d include the following:

<?php if ( is_active_sidebar( 'Main Sidebar' ) ) : ?>
  <?php dynamic_sidebar( 'Main Sidebar' ); ?>
<?php endif; ?>