Static cover image not displaying fully
-
I am trying to set up a static cover image for a page and it keeps cutting off the image. Please help.
-
Hi there,
Are you speaking of the front page on https://danielsagerman.wordpress.com/?
It’s cropping the image like that because you have the cover block set to use a fixed background, and you’re not specifying the height of the cover block. So the image is sized to cover the entire vertical space allocated to that section, which results in the edges being cut off – the alternative would be for the image to get squashed instead.
Edit the post and click on the cover block. In the block settings on the right, switch off the Fixed image toggle, and set a minimum height of 700px to the image. That should prevent the image from being cropped.
To be on the safe side, also adjust the focus point of the image to center on you, That way even if the image does get cropped on smaller screens, the part of it containing your photo will appear in full.
-
Hi kokkieh,
Thank you for the message. The issue is that I actually do want to use a fixed background. I’m trying to create an effect like this: https://rockfielddemo.wordpress.com/. I think it looks a lot smoother than a non-fixed background.
Is it possible for the image to not get cropped? I can also edit the cover image in photoshop in order to make my body lower down on the image – which might prevent my head from getting cropped off.
What should I try next?
-
You could try to change your image ratio to fit better, but, to be honest, if you do not want to follow the steps described by @kokkieh, I wouldn’t recommend adding your portrait to the Cover Block.
You might want to consider adding a different image there and have your photo below in an Image or Media&Text Block. The reason for that is that the Cover Block will adapt to the size of the screen, so it will always get cropped in some way, depending on the size of the visitor’s screen.
The Image Block will never crop your photo and, instead, scale it, adapting to the screen’s size.I hope that helps :).
-
staff-mckluskey – thanks for the response. That makes sense. All I’m trying to do is create a personal page with a scroll-down effect like this: https://rockfielddemo.wordpress.com/.
Would using an image block still provide the same fixed-background effect while scrolling? I’ll have to keep playing around with it some more.
-
Hi,
Would using an image block still provide the same fixed-background effect while scrolling?
It wouldn’t. Bear in mind too how https://rockfielddemo.wordpress.com/ looks on different screen sizes. Mobile browsers don’t handle the fixed-background attachment thing that well, and that’s where many people will see your site, so you’ll just want to be mindful of that.
In general, it’s a good rule of thumb to use images that can handle all kinds of cropping for backgrounds and featured images. Add portraits as an image block so you can control the cropping.
I hope this helps!
- The topic ‘Static cover image not displaying fully’ is closed to new replies.
WordPress.com Forums 