How to add a custom Open Graph image tag to your home page

Jetpack automatically creates these meta tags for you, so you don’t have to worry about it!

Jetpack will also add an Image meta tag to your home page if you use a Site Logo, or a Site Icon. If you don’t use any of these 2 options, you might want to add your own custom image meta tag there. To do so, add one of the following code snippets to your theme’s functions.php file, or to a functionality plugin:

function fb_home_image( $tags ) {
	if ( is_home() || is_front_page() ) {
		// Remove the default blank image added by Jetpack
		unset( $tags['og:image'] );

		$fb_home_img = 'YOUR_IMAGE_URL';
		$tags['og:image'] = esc_url( $fb_home_img );
	}
	return $tags;
}
add_filter( 'jetpack_open_graph_tags', 'fb_home_image' );

Alternatively, you can change the default image used any time Jetpack can not determine an image to use:

function custom_jetpack_default_image() {
	return 'YOUR_IMAGE_URL';
}
add_filter( 'jetpack_open_graph_image_default', 'custom_jetpack_default_image' );

It’s worth noting that the fallback image has to be larger than 200 x 200px, as per Facebook requirements. If your image is smaller, Facebook will ignore it.

Jeremy Herve

Jetpack Mechanic 🚀 at Automattic. WordPress, board games, TV Series, music.