Homepage Image Size Issue/Cornerstone

Hi, I’m using Cornerstone to build my site and trying to replace the front page image with one of my own. I’ve been going to Section -> Background Type and clicked the image icon to upload my image. I want my image to appear like the demo image but it’s not working.

This Church Demo link shows the home page photo in the demo (with the text “Welcome to Kingdom Church” under it):

http://demo.theme.co/church/

Yet my normal-formatted image appears considerably cropped like this on my desktop (and mobile):

How can I change this? Thank you.

Hello There,

Thanks for writing in! The background image is working as intended. The issue is that your section does not have enough height so that you can see the whole image. Please add more elements into the columns or set a minimum height in one of the columns so that you will have enough space for the background image to display a bigger area.

Hope this make sense.

Thanks for replying! How do I set the image size for the column? And how can I ensure it will appear okay in mobile as well?

Hello Again,

The section height is dependent on the height of the child elements. If you want to make sure that you have at least a good amount of height for your background image to display or maybe you would like to have the height the same as your browser height, please edit the page back in Cornerstone, in your column settings, find the style field and insert min-height: 450px or min-height: calc(100vh - 100px).

100px is the height of your navbar so the background image will display along with your navbar.

Please let us know how it goes.

Hi, the “min-height: 450px” entry into the style field worked wonderfully, thank you.

Hey There,

You’re welcome! We are just glad we were able to help you out.
Thanks for letting us know that it has worked for you.

Cheers.

Hi there!

Can you please tell me how I can find the column settings in cornerstone so I can do the same thing please? New to it all!

Thanks so much

Hello @SecureSpot,

Thanks for asking. :slight_smile:

Under section you just need to click on column. To help you get started I have recorded a screencast. Please take a look. https://cloudup.com/co5PU-jz3lu

Kindly note that this is quite old ticket. In case you have any further questions, please create a new ticket.

Thanks.

Thank you - I do have further questions so will create a new ticket

You are most welcome. :slight_smile: