When a guest sees the homepage they see the (almost) full height picture which is quite nice I think.

However, when a user logs in I'd like them to be redirected to the home page but with a much shorter picture (as the picture appears on the internal pages of the site).

I know I could redirect logged in users to a faux front page, but is there a way of changing the height of the main header picture depending if the user is a guest or logged in?

1 Answer 1


WordPress will automatically add a body class to the body tag if a user is logged in. You could potentially use this to adjust the height.

For example..

.logged-in #myElement {
    ...Your CSS

Something like this should work.

.logged-in.twentyseventeen-front-page.has-header-image .custom-header-media {
    height: calc(70vh);

Note the calc 70vh is 70% of viewport height, so adjust to what you need.

  • A very simple, elegant, not to mention fast, response and solution - thank you!
    – arathra
    Feb 12, 2019 at 16:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.