Changing header size

Hi there,

I am starting a blog with GreatMag. My problem is the following: I want the website header to display the background image in full width.

To be more graphic, my background image is 4096 × 2730, and what currently shows is this:

In order to provide you with more context, this is what I have added in the TC Custom Javascript:

;(function($) {`

  if( $('[data-bodyimg]').length ){
	
    var $bodyBg = $('[data-bodyimg]').data('bodyimg');
    
    $('.site-branding').css(
      "background-image", "url("+ $bodyBg +")"
    );
    
  }

})(jQuery)

And this is what I have as additional CSS:

.site {
  background-image: none !important;
}

.site-branding {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.media.breaking-news {
    display: none;
}

Hello,

It looks like this issue requires some coding and testing on different screen resolutions, this goes beyond our support policy. It’s considered advanced customization. As an option, you can contact Codeable for this kind of service, or find a reputable freelancer on Upwork.

Kind Regards, Roman.