This guide will help you change your header image as well as other images on the page.
When looking at your header image, if it looks blurry then you can do a few things to find and solve the problem!
The first and most common issue causing a blurry/fuzzy looking image (or lower quality image) is that it is a vertical photo, instead of a horizontal photo. Vertical photos are great, and they do have a place in social media or even on a website, but they may cause some problems on your site if they are in your header. Because your Church Co site is device responsive, it is using the same image on a mobile phone or a large desktop monitor, and is actively adjusting the image to fit your screen. When you use a vertical in your header, that image has to be cropped and scaled larger on any screen larger than a mobile device.
Another reason your image may seem blurry is because the image is actually lower quality. Export settings are incredibly important when editing photos, and you should ensure that you are using the highest setting for either PNG or JPG, while keeping your image under the 3MB limit. That may seem daunting, but it is very doable!
One place to look is at your image width and height. The recommended image for a header is 1920 pixels by 1080 pixels. If you feel like your image is blurry, and you find that the image is only 100 pixels by 30 pixels, then you found your problem! That image has too few pixels in its current state and is becoming pixelated. The opposite is also possible, where your image may be too large to upload. It could be caused by the pixel size being way to large. Keep an eye on your export settings and final product image size as they often play a large role in what your image will look like on your site.
If you find that you need to change your header image, it is easy! Navigate to the page you want to edit, click edit, then click on the header image section on the left.
Once you have opened the page header section, you can click on the "X" to delete the current page header and then click "Add Image" to select a different image. Try looking for an image that is high quality and is horizontal. Once you find it, click on the "Select" button and be sure to hit save or publish if you are done making changes.
When editing images that are in the Image 2.0 block, we have a whole guide for that! Check it out here, but I will give you a basic overview.
If you are back in the page editor, and want to change an image that is in the Image 2.0 block, you simply click on the block on the left to open it up. Then click on images to access the specific images and text being use. From there, you can delete an image (just like we did above) by clicking on the "X" in the corner of the image, and click on the "Add Image" button. Select on your new image from your media library, and then click "Select" and Save.
One trick you can use when adding multiple images in the Image 2.0 block is to hold the CONTROL key on your keyboard while clicking on the images. The will then be added in the order you selected them!