Support » Theme: Twenty Seventeen » changing the displayed height of featured images on the front page

  • Resolved dmcohen

    (@dmcohen)


    I set up the front page to display content from other pages (appearance–> customize–> theme options–> front page section [X] content). Then I set up each page’s featured image, and though I do like that parallax effect, the images take up quite a bit of real estate as you scroll down… pretty much the whole screen. So I’m wondering: is there a way to reduce the height of those featured images that are displayed on the front page?
    (Thanks!)

Viewing 10 replies - 1 through 10 (of 10 total)
  • Hello dmcohen!
    Follow below steps:
    1. Login as admin and go on theme customizer Dashboard — Apperance — Customize or Click on Custimze link on top bar from front-end.
    2. Then navigate Additional CSS and put below css into textarea then click on Save & Publish button.

    /* Mobile view*/
    .panel-image {
     height: 25vh;
    }
    /*Full screen laptop/computer screen view*/
    @media screen and (min-width: 48em) {
     .panel-image {
      height: 25vh;
     }
    }

    Use 25vh for 25% height featured images panel, or you can use 50vh for 50%.
    Hope this will helps you.

    This is great– exactly what I was looking for, and it works like a charm. Thank you!

    Thank you. I’ll go back to school tomorrow to be like you. Works perfectly.

    Greatly appreciated!

    Thank you very much! Works perfectly well 🙂

    This doesn’t seem to work for me on a child theme. Actually when I’m inspecting the markup I can’t even find a reference to “.panel-image”.

    I used #masthead instead but then the grey gradient and menu are all screwed up.

    Wish this would work – I hate having that menu right on the bottom like that when there are drop-downs with it.

    MMW

    (@moneymakewise)

    @annayu that was one of the shortest, accurate, and precise best answers i saw for some time now. Thanks!
    Is there a way we can similarly change the twenty seventeen header picture height as well?

    Thanks!

    Yes, thanks you @annayu – this was an awesome help, something I’d been wanting to do for 3 months!

    This worked great but now I’d like to do the same for the featured image on the actual page. Thanks!

    @tirwinjr, I am also looking for the solution like you.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘changing the displayed height of featured images on the front page’ is closed to new replies.