Header customisation

I try to customize header height and image
There is a quite big gap between "Browse store" button and header bottom (please see the attachment below)
Is there any way to reduce the header height?

Also I need help how to customize the header image.
The sample shoe looks great but when I change it to a wide image it shows very small. Which element I need to overwrite to expand image size (width)?

Could you please provide me with a URL to your website, either here or via PM (click the “Private Message” text underneath my avatar) so that I may analyze it? It is a lot easier for us to diagnose issues when we have a live site to examine.

My messages are bouncing back to my box as unsent.
Can you please send a PM so I will reply for it? Cheers!

Hi

In template settings You will find an option to reduce the height of the frontpage image:

I am so sorry, but it did't help. The bottom margin is still unnecessarily big.
Item min and max-height shows 925px.
Any ideas please?

Did you find a solution for that? I am having the same issue.
I am setting height to 400 px in the template but still the same size...

Hi

Ok. Now I see. I've described how to change it for regular Quark style and not E-commerce. In E-commerce script is counting the value to cover 100% of the starting screen. So this can be solved on 2 ways:

1. overwrite the height via override.css:

Code: Select all

.frontpage #gkHeaderMod {
min-height: 400px !important;
max-height: 400px !important;
}


2. by removing script:

Code: Select all

   // Header resize
   var gk_quark_header_resize = function() {
      if($(document.body).hasClass('fullscreen')) {
         var header = $('#gkHeaderMod');
         
         if(header.length) {
            header.css('min-height', $(window).height() + "px");
            header.css('max-height', $(window).height() + "px");
         }
      }
   }


from /js/gk.ecommerce.js