Can the main page header be a slider?
Home › Forums › WordPress Themes – Premium › Lavish Pro › Can the main page header be a slider?
- This topic has 37 replies, 2 voices, and was last updated 5 years, 3 months ago by
Bidur.
-
AuthorPosts
-
October 18, 2017 at 11:32 am #50998
Bidur
ModeratorWell the header menu is working fine when we check from our end. Please confirm it. if you wish to remove the header from mobile menu, you may add the following css inside the additional css field of your customizer;
@media screen and (max-width: 620px) { .lavish_head { display: none; } }
Thanks!
October 18, 2017 at 7:19 pm #51003blake more
ParticipantI tried that code…and now i see why you ssay it is working perfectly — the menu header is fine…it is the header image that is not responsive…it is too big on mobile…if you look at it on a tablet or phone, it cuts off and does not resize…it looks great on a desktop…
i tried the code but it made the entire menu go away…which is definitely not what i would want, as it makes navigation between pages impossible…
so, to be clear… want to remove the header image on mobile/tablet view — or make it responsive…now it just cuts off and looks terrible…is that the lavish_banner instead of the lavish head?
please advise…
also, am i now using the most current theme version 4.1.8? can you tell? as I thought this would fix my mobile display issue
thank you again and again!
October 19, 2017 at 10:34 pm #51111blake more
Participantstill looking for a way to remove the header (not the menu or logo) on mobile…the code you provided above left the header but elimintated the menu and the logo..the opposite of what i am looking for…please assist, and the update to 4.1.8 seemed not to have solved the unresponsive header problem (your theme template says it has to be 2560 x 400, which is what I created and uploaded to the header section of customizer.
thank you
October 23, 2017 at 9:24 am #51176Bidur
ModeratorHello Blake,
Sorry for the mix-up.
Yes, now your site is succesfully running with the latest version of the theme i.e 4.1.8The theme clearly recommends you for the 2560 × 150 pixels header image.
Please undo all your changes and add the following css inside the additional css field of your customizer;@media screen and (max-width: 1024px) { #la-banner { background-size: cover; min-height: 268px!important; } } @media screen and (max-width: 780px) { #la-banner { background-size: cover; min-height: 226px!important; } } @media screen and (max-width: 650px) { #la-banner { background-size: cover; min-height: 190px!important; } } @media screen and (max-width: 550px) { #la-banner { background-size: cover; min-height: 146px!important; } } @media screen and (max-width: 440px) { #la-banner { background-size: cover; min-height: 110px!important; } }
Note: you can adjust the screen width and min-height of the image of your own.
Thanks for your patience.
Best Regards,
BidurOctober 23, 2017 at 11:44 am #51178blake more
Participantthank you…
since according to my theme customizer the them calls for 2560 x 400 (see attached screenshot), I’m a bit confused by your assertion that the theme “clearly recommends 2560 x 150” — can you please show me where this is in the documentation?as a result, I did not feel your dimensions would work, so instead, I simply removed the header from mobile and tablet views, and now it know it is: #la-banner
this works, but of course, I would rather have a responsive header…I am really wanting to know how you got the 150 number….(in the screenshot, the “400” value in the “custom header image” box was already there…so i did not add it…in fact, when i tried to eliminate that value, the entire header goes away…
thanks again for your help
Attachments:
You must be logged in to view attached files.October 24, 2017 at 8:22 am #51193Bidur
ModeratorHello Blake,
Well our demo recommends to use the header image with 150 pixels header height. You can rather change and add custom header height of your own. Since you have add 400 pixels in your custom header height field it is recommending the same. It is up to you. Is everything working now?
Thanks!
BidurOctober 26, 2017 at 3:39 am #51266blake more
Participantstrange, but when I opened the customizer, 400 was already entered in the field…perhaps that was left over from before? If at a value of 400, how does this change?
@media screen and (max-width: 1024px) {
#la-banner {
background-size: cover;
min-height: 268px!important;
}
}
@media screen and (max-width: 780px) {
#la-banner {
background-size: cover;
min-height: 226px!important;
}
}
@media screen and (max-width: 650px) {
#la-banner {
background-size: cover;
min-height: 190px!important;
}
}
@media screen and (max-width: 550px) {
#la-banner {
background-size: cover;
min-height: 146px!important;
}
}
@media screen and (max-width: 440px) {
#la-banner {
background-size: cover;
min-height: 110px!important;
}
}I’m not so good at figuring out media screen ratios!
thank you — getting so close!
blakeOctober 26, 2017 at 8:57 am #51267Bidur
ModeratorWell the header height works for desktop screen and the media query for responsiveness. Have you tried the above custom css?
Thanks!
-
AuthorPosts
- You must be logged in to reply to this topic.