Archived topic
Background image for header.
5 replies · Started by Mike on March 3, 2020
How can I make the header stand out from my content a little more? The background for the header is currently an off-white color, which makes it hard to differentiate the header from my content (which has a solid white background color). I tried playing around with the colors, but couldn’t find anything appropriate other than off-white, so I thought about using a custom image as a background for the header.
How could I implement this, and what should the dimensions of the image be?
Hi there,
You can try adding a background image in Customizer > Background Images > Primary navigation.
Something like 2000px in width and 77px in height (the menu item height) should work.
Let me know if this helps :)
Thanks Leo! How can I only change the background for mobile though?
To change the background color for mobile only?
You can try this CSS:
#mobile-header {
background-color: #000000;
}Adding CSS: https://docs.generatepress.com/article/adding-css/
No, I mean to use a custom background for mobile only.
Youn would use this CSS:
#mobile-header {
background-image: url(https://URL-FOR-MOBILE-BACKGROUND-IMAGE;
}