How do I add an image to my 404 page?

[punkinpancakes]

Hello!

I would like to replace the 404 text with an image. Is that possible? I tried adding an image banner on the 404 page but it just looked way too big. I'm using the colorblock theme.

[WalkYourStyle]

What Image do you want to add?

[punkinpancakes]

This gif.

I'd prefer the image stays smaller and doesn't get blow up like it does with the image banner section. I tried image with text too but I'm not sure how to center the image and I don't like all the padding the section has on the top and bottom.

[HazilStudiosNYC]

Save it like this, and share a preview link. I'll share the CSS code you'll need to center and style it correctly.

[punkinpancakes]

https://ervc2tvz9evg3yux-89464668454.shopifypreview.com
Thank you so much! Its a minor thing but I love the small attention to details on websites.

[HazilStudiosNYC · Accepted solution]

Awesome thanks!

In the image-with-text section, add this code to the Custom CSS at the bottom.

.image-with-text__text-item {
display: none;
}

.image-with-text__grid {
justify-content: center;
}

.image-with-text__media-item {
width: 200px;
}

If you want to keep the original image size, remove the last portion. Or adjust the width to adjust the image size.

[punkinpancakes]

Thank you so much! That worked perfectly 🙂

[HazilStudiosNYC]

In the customizer, you can select the "404 Page" and edit it just like you would edit any other page.