What Are Hero and OG Images?

A hero image is the large banner image displayed at the top of your blog post. It gives your post a visual identity and makes it stand out.

An OG image (Open Graph image) is the image that appears when someone shares your post on social media -- platforms like Facebook, Twitter/X, and Discord use it to generate a link preview card. Setting a good OG image makes your shared links look polished and inviting.

Both are optional, but they go a long way toward making your posts look great.

Setting a Hero Image

You'll find the Images card in the blog editor, below the metadata section. It has two side-by-side panels: one for the hero image and one for the OG image.

Selecting an existing image

1. Click Select Hero Image (or Change if one is already set).
2. A picker modal opens showing all uploaded images as a grid. The currently selected image (if any) is highlighted with a blue border.
3. Use the search field to find an image by title.
4. Click Select on the image you want.

Uploading a new hero image

If the image you need isn't in the library yet, you can upload one directly from the picker modal:

1. Scroll down to the Or Upload New Image section at the bottom of the picker.
2. Fill in the Title, Alt Text, and Image File fields.
3. Click Upload & Select.

The new image is added to the library and set as your hero image in one step.

Removing the hero image

If you no longer want a hero image on your post, click the Remove button next to the current hero image preview.

Setting an OG Image

The process for setting an OG image is identical to the hero image process, just using the OG Image (Social Sharing) panel on the right side of the Images card.

For best results with social sharing previews, use an image with a landscape orientation (wider than it is tall). A 1200 x 630 pixel image works well across most platforms.

Tips

• Use the same image for both if you're unsure. Setting the same image as both the hero and OG image is perfectly fine, and it's better than leaving the OG image empty.
• Give each image a clear title. When you come back to change the hero image months later, you'll thank yourself for naming it "Spring Update Banner" instead of "IMG_0847".
• Hero images look best when they're wide. Tall, narrow images may not display as well as a wide landscape shot or banner graphic.