Custom Header Height - Support | Kriesi.at

Viewing 16 posts - 1 through 16 (of 16 total)

Author

Posts
June 3, 2015 at 10:20 pm #454112

bdm55
Participant

Hi,

Is there a way to make the header taller than 300px? I don’t want to use a slider … I would like the header to be at least 600 px high.

Like a full screen header only not quite that big.

Thanks,
Bill

June 4, 2015 at 2:43 am #454188

Josue
Inactive Moderator

Hi Bill,

Can you post the link to your website please?

Regards,
Josue

June 4, 2015 at 5:32 am #454246

bdm55
Participant

This reply has been marked as private.

June 4, 2015 at 3:39 pm #454528

Rikard
Keymaster

Hey Bill!

I can’t see anything in your last post?

Cheers!
Rikard

June 4, 2015 at 3:43 pm #454535

bdm55
Participant

This reply has been marked as private.

June 4, 2015 at 10:31 pm #454779
Josue
Inactive Moderator
I guess you want the header to be 469px, use the following code in Quick CSS:
```
#top #header_main > .container, #top #header_main > .container .main_menu ul:first-child > li > a, #top #header_main #menu-item-shop .cart_dropdown_link {
    height: 469px;
    line-height: 469px;
}
```
Don’t paste the code from the mail notification but from the forum reply.

Cheers!
Josue
June 5, 2015 at 2:15 am #454884

bdm55
Participant

Sorry .. this did nothing …did not work

June 5, 2015 at 2:22 am #454885
Josue
Inactive Moderator
Try with this:
```
#top #header_main > .container, #top #header_main > .container .main_menu ul:first-child > li > a, #top #header_main #menu-item-shop .cart_dropdown_link {
    height: 469px !important;
    line-height: 469px !important;
}
```
Cheers!
Josue
June 5, 2015 at 7:31 am #454962

bdm55
Participant

Hi … I appreciate your efforts .. but this is not what I want … I would like to change the header height to anything over 300px not just 469px ..

This code is adding a black band at the bottom of the header also … which I don’t want …

Thanks

June 5, 2015 at 8:42 am #454988

Josue
Inactive Moderator

Your background image (469) is too small for the height (632) you’ve set, that’s why you see that black band.

Cheers!
Josue

June 11, 2015 at 8:59 pm #458030

bdm55
Participant

Hi Josue ..

Again .. thanks .. but you didn’t answer the question on how to adjust the header height to something over 300 px.

I don’t yet know what exact height that would be … maybe 425px … not sure.

Thanks,
Bill

June 11, 2015 at 9:35 pm #458043
Josue
Inactive Moderator
Hi Bill,

You can’t, at least not from the Theme Options, that’s why we suggest using a CSS approach instead (which works the same):
```
#top #header_main > .container, #top #header_main > .container .main_menu ul:first-child > li > a, #top #header_main #menu-item-shop .cart_dropdown_link {
    height: 469px !important;
    line-height: 469px !important;
}
```
Regards,
Josue
February 28, 2017 at 11:51 am #752854

smudgedesign
Participant

Is there an option to have header height set to a percentage: eg 90% height?

March 2, 2017 at 7:17 am #754092

Rikard
Keymaster

Hi,

I’m not sure why you would need the header to be 90% of the page? You can set a custom pixel value to it under Enfold->Header->Header Size though.

Best regards,
Rikard

March 2, 2017 at 11:02 am #754262

smudgedesign
Participant

Hi Rikard

If i wanted to create a page like this
http://theethicalgardener.com/

– where there’s to top menu bar for social media icons
– logo is almost full screen
– Then the header height of 90% so the user can just see the menu below but none of the main content.

Is there another way you would create this layout?
The custom pixel value is good but max is 300px
A future version might include a percentage option maybe?

Let me know what you think.
thanks in advance

March 7, 2017 at 7:47 am #756812
Ismael
Moderator
Hi!

Did you create the site?

Right now, this is not possible. Please request the feature here: https://kriesi.at/support/enfold-feature-requests/

Or you can start with this css modification.
```
#header {
    height: 80vh;
}

.container.av-logo-container, .container.av-logo-container a, .container.av-logo-container a img {
    height: 80vh !important;
    line-height: 80vh !important;
    max-height: 80vh !important;
}
```
Set the header position to “Logo center, Menu below.”

Best regards,
Ismael
Author

Posts

Viewing 16 posts - 1 through 16 (of 16 total)

You must be logged in to reply to this topic.