Freelance Web Designer in Dubai & SEO Expert in Kerala
01 / 01

How to Add a Header Widget in WordPress

We can simply add the header widget to  WordPress website by modifying to pages in the website. For Adding header widget we need to modify the functions.php file and header.php file in the wordpress

Path for the files

function.php wp-content/themes/{theme name }/ function.php
header.php wp-content/themes/{theme name }/ header.php

Modifying the file

Step 1 : Add the below code to function.php it’s declaring the widget into our WordPress website header section

function wpb_widgets_init() {
register_sidebar( array(
'name' => 'Header Widget',
'id' => 'header-widget',
'before_widget' => '<div class="hw-widget">',
'after_widget' => '</div>',
'before_title' => '<h2 class="hw-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'wpb_widgets_init' );

Step 2 : Calling the declared widget in the theme.

<?php
if ( is_active_sidebar( 'header-widget' ) ) : ?>
    <div id="header-widget-area" class="hw-widget widget-area" role="complementary">
	<?php dynamic_sidebar( 'header-widget' ); ?>
    </div>
<?php endif; ?>

Modifying the Widget

Now you can modify the widget from the WordPress Dash Board

by anvar
Published : May , 16

Post a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

WhatsApp Logo Chat
design specialist