R. Carvalho

Hi there.

I had the exact same problem, and while I was unable to solve it in a proper way, I’ve found a workaround which seems to do the job.

First thing I did was opening this file:

Your WP directory/wp-content/themes/nisarg/inc/custom-header.php

There are 4 references to the 1600 max width, all which I replaced with my desired max width, 1920. In your case, 1080.

Now, I’m not sure this first step had any effect whatsoever in the whole process. But since I haven’t actually tested it, I’m just assuming it’s important.

That done, the next step is to prepare a proper sized header image, say, the size you want of 1080 x 400 px (in my case, a 1920 x 400 image).

Then upload it to THIS directory using a regular FTP client:

your WP directory/wp-content/themes/nisarg/images/headers/

NOTE: You can name your file either food.png, sea.png, skyline.png or mountains.png. If you do that, you’re replacing one of the four “suggested” headers the theme offers. You’re almost done. Just go to the WP panel and choose the header you just changed. Remember the name, because the thumbnail won’t change at all. Voilá! Your desired full width header is in place.

Now, if you’re using a different name or extension for some reason, You need to come back to the file we edited in the first step:

your WP directory/wp-content/themes/nisarg/inc/custom-header.php

Then look for this bunch of code:

/*
	 * Default custom headers packaged with the theme.
	 * %s is a placeholder for the theme template directory URI.
	 */
	register_default_headers( array(
		'mountains' => array(
			'url'           => '%s/images/headers/mountains.png',
			'thumbnail_url' => '%s/images/headers/mountains_thumbnail.png',
			'description'   => _x( 'food', 'header image description', 'nisarg' )
		),
		'skyline' => array(
			'url'           => '%s/images/headers/skyline.png',
			'thumbnail_url' => '%s/images/headers/skyline_thumbnail.png',
			'description'   => _x( 'buildings', 'header image description', 'nisarg' )
		),
		'sea' => array(
			'url'           => '%s/images/headers/sea.png',
			'thumbnail_url' => '%s/images/headers/sea_thumbnail.png',
			'description'   => _x( 'Wood', 'header image description', 'nisarg' )
		),
		'food' => array(
			'url'           => '%s/images/headers/food.png',
			'thumbnail_url' => '%s/images/headers/food_thumbnail.png',
			'description'   => _x( 'food', 'header image description', 'nisarg' )
		),

Notice the references to the four example files. All you need to do now is edit one of them to match your file’s name and extension and then choose the equivalent suggested header in the panel.
All the usual file extensions should be ok (my header for instance, is a GIF).

I know it’s sort of a cheap workaround, but it gets the job done without messing too much with the code.

Also, depending on the width you choose, the mobile and tablet layouts will get a little messy, but nothing too extreme. Definitely something I can live with.

Hope it helps!

Hello adieu.
I wanted to do the same thing, but couldn’t find the answer anywhere.
Then I decided to mess with the php files and finally got it done right.

And while there might be an easier way to do that, as a non-programmer, this is how I’ve done it.

First, I’d recommend a small logo image, not bigger than 90px height so it won’t mess with your mobile and tablet layouts.

You don’t need to deal with css at all.

The steps:

1 – Upload your logo through the media panel in WP. Copy the logo url. It will look like this:

https://yourdomain.com/yourWPdirectory/wp-content/uploads/2016/06/logo.png

Reserve. You’re gonna need it.

2 – Then open this file:

/wp-content/themes/nisarg/header.php

3 – Find and remove this bunch of code:

<div class="site-header">
      <div class="site-branding">
          <a class="home-link" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
          <h1 class="site-title"><?php bloginfo( 'name' ); ?></h1>
          <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
		  </a>
      </div><!--.site-branding-->

4 – Put this code instead, int the exact same place:

<div class="site-header">
      <div class="site-branding">
        <a class="home-link" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
        <!-- <h1 class="site-title"><?php bloginfo( 'name' ); ?></h1>
          <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2> -->
<!--your logo line --><h1 class="site-title"><img src="your logo url" alt="Your logo name"></img></h1><!-- end of your logo line -->
          </a>
      </div><!--.site-branding-->

5- Edit the code with your logo url and title.

That’s it.

Notice The original h1 and h2 are <!–commented–> so they have no effect. In case you want to revert the change, just remove the new line and the comment marks.

Also, make sure you leave the option to show title and description marked in the WP panel.

Hope this is what you were looking for!