1080p Header Image

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!

How do I implement the solution above with a child theme?