I’ve been looking for a way to expand my image banner to also include the header for my page. I haven’t found a solution to do this on the Spotlight theme. I’d be so grateful for your help on this! What I’m looking for is for the image at the top of the page to be in the header as well. Thanks!
To expand your image banner to include the header on the Spotlight theme, you’ll need to modify the theme’s HTML and CSS code. Here’s a general approach you can follow:
Identify the HTML element that represents the image banner in the theme. Look for a section or div element that contains the image.
Find the HTML element that represents the header. This is usually a <header> element or a section with a class like site-header.
Adjust the HTML structure to include the image within the header element. You can move the image code or add a new image element inside the header element.
Once the HTML structure is updated, you’ll need to adjust the CSS to ensure the image and header display correctly together. You may need to adjust the positioning, dimensions, and other styling properties.
Open the theme’s CSS file and locate the CSS rules that target the image banner and the header. You’ll need to modify these rules to accommodate the expanded layout. This may involve adjusting the positioning, dimensions, and margins.