Full Width Top Banner & Moved To Top

Also… where am I supposed to add the “banner” image?

Currently, I’ve added it as the “featured image” on the page. I’m going to have the same banner image for all pages for now, so maybe there is a better place to add the image?

Oh, I figured it out by following this tutorial! https://www.shapedpixels.com/setup-aberration-lite/add-banner-images-to-your-pages

Now I just need to figure out how to set the full width… will post if I find it before getting a response.

When you say full width, you mean the banner image? That is dependent on the size of image actually. You will want to make sure the image is big enough before uploading to the media library to be used as the banner image. For example, the demo site for Aberration Lite has an image size of 2560×900 pixels. This accommodates very large screens and resolutions, but if most of your viewers will be on 1920px wide screens, then you can make your image at that width.

Thanks for your reply! Yup, I meant the banner image. My image is 2560×900 pixels, but there is a margin on the left and right side of the image. Oh… I guess I’m looking to set the margin to 0… I may have just answered my own question… just not sure where to set that. Or maybe it’s padding.

If you look at the banner on this website, there is no white space to the left or right of the image: https://www.mocadazu.com/mocadazu-nights/

Does that info help paint a better picture?

Sorry for late reply back…. been out of commission for the afternoon. Anyway, it looks like you have this solved? I checked your site out and the banner is full width edge to edge.

No worries… but that’s someone else’s site. My original post mentioned I’m trying to get my site to look like theirs. I haven’t posted a link to mine : )

ah…do you have a link to yours? IF not, then a screenshot? Ideally, a link would work best then I can look at the code.

UPDATE: Do you mean the left and right space like the demo site:
https://demos.shapedpixels.com/aberration-lite/

IF so, that is done by design, but you can change it with custom CSS:

#page {
    padding-left: 0;
    padding-right: 0;
}