[Kent Hirsch]

How can I make the gray bar above the menu (under the logo) smaller or remove it? Without video on the first page or menu disappearing.

https://www.hirschproduktion.se/fotouppdrag/

https://www.hirschproduktion.se/videoarkiv-2/

https://www.hirschproduktion.se/helikopterfilmning/

https://www.hirschproduktion.se/kurser/

https://www.hirschproduktion.se/foretaget/

[Sakin]

Hi Kent,

That grey bar is from the Header Media. Looks like you have removed the Header Media image. Can you check your settings at “Appearance => Customize => Header Media”. If you want video only on first page then you need to choose “Homepage / Frontpage” on the “Enable on” option.

Regards,
Sakin

[Kent Hirsch]

Hi Sakin,

I wish I could attach screenshots.

Current Header – No image specified

Media in header
I have selected Enable on – Homepage / Frontpage

Position
Before primary menu

[Sakin]

Hi Kent,

It’s strange why it’s showing the Header Section when you have enabled it only on the Homepage. You can add the following CSS in “Appernace => Customize => Additional CSS”:

.header-media { display: none; }
.home .header-media { display: block; }

Regards,
Sakin

[Kent Hirsch]

Great, it worked. Thanks!
Do you have CSS to make the logo field (HIRSCH PRODUKTION) narrower?

[Sakin]

Hi Kent,

I see that you have defined a max-width of 250px for the logo, you can change that in “Appearance => Customize => Additional CSS” as below:

/* To change the size of logo */
.custom-logo {
    max-width: 250px !important;
}

[Kent Hirsch]

I was a little unclear in my question. I didn’t mean the size of the logo. I meant the height of the gray field where the logo is.
I managed (probably the wrong way) to change it on the first page, by changing the margin-top on the header media to -35px, but it doesn’t affect the other pages.

Now that we’re at it, I’m also wondering how I can move the logo horizontally and vertically and the text “Visual Content Producer” horizontally and vertically?

[Sakin]

You can adjust the margin top and bottom on the following CSS and add it in “Appearance => Customize => Additional CSS”

@media screen and (min-width: 75em) {
  .header-center-layout .site-branding {
    margin-top: 30px;
    margin-bottom: 30px;
  }
}

[Author]

Posts