Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Edge to edge image at home page #298

Open
ghost opened this issue Apr 3, 2014 · 5 comments
Open

Edge to edge image at home page #298

ghost opened this issue Apr 3, 2014 · 5 comments

Comments

@ghost
Copy link

ghost commented Apr 3, 2014

Hey guys, just wondering if it's possible to make an edge to edge photograph on a home page? Basically, what I wanna do is to replace the grey background with an image and preserve text with buttons. What code should I use?
Thanks
1

@piotrkunicki
Copy link
Contributor

Hi,

Try to add this code into css/override.css file (first enable this option in Template Options -> Advanced tab)

#gk-header {
    background: #fff url("../images/your_image.png") no-repeat;
}

and upload your images into MeetGavernWP/images directory.

@ghost
Copy link
Author

ghost commented Apr 3, 2014

This works, thanks. But now my image is not responsive. When I resize browser window, the picture remains the same size

@piotrkunicki
Copy link
Contributor

Add also this CSS property to your #gk-header:

background-size: cover;

@ghost
Copy link
Author

ghost commented Apr 4, 2014

Awesome! The last question, how to change the big header font size on home page?

@piotrkunicki
Copy link
Contributor

Add this code into override.css:

.gk-big-header {
    font-size: 70px;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant