Currently, my homepage contains a few of the latest posts. Therefore, when the homepage is shared via social media (i.e. Facebook), the thumbnail image which is displayed comes from the top image in the latest post.
What I am trying to do, is to set it so that when the homepage is shared, a specific, default image will be displayed. However, the image must only be displayed when the homepage is shared, and should not otherwise appear on the site. What would be the best way to do this?
If you’re using Yoast WordPress SEO, you have a built-in setting for Facebook images. Under your SEO > Social menu, go to the Facebook tab and select an image under “Frontpage settings.” You can also set an image as a fallback, for posts that have no featured image, under “Default settings.”
Other SEO plugins may have similar capabilities.
You can create a child theme or modify a custom theme. First, make sure the theme supports a site logo. If not, add custom logo support.
Next, edit or copy
header.php into your new child theme. Inside the
<head></head> tags, include a check for
if(is_home()) depending on your needs. Sounds like either would work in your case.
If the condition is met, grab the custom logo URL
$image = wp_get_attachment_image_url(get_theme_mod('custom_logo'), 'large');
and output it within Open Graph tags:
<meta property="og:image" content="<?php echo $image; ?>" /> <meta name="twitter:image" content="<?php echo $image; ?>" />
You could also create your own plugin, if you don’t want to use Yoast WordPress SEO or fiddle with the theme. The risk is that an existing theme or plugin may already output a featured image, so you’d want to check your page source and make sure nothing else is setting a featured image. I assume this is the case since your current theme and plugins are setting the most-recently-published post’s image when you try to share it.
Basically, you would add an action for the
wp_head hook. Your action would output the Open Graph and Twitter image data just like you would if you chose the first option, working with the theme.
You’d have to decide whether to hard-code the image into your plugin, or whether you would create an options page somewhere in wp-admin where you could change the image whenever you wanted.
Different social platforms use different methods.
For Facebook, you need a set of
<meta> tags with
og properties – e.g.
og:image should contain the full path to the image you want to be displayed.
Twitter is similar but has their own ‘card’ mechanism which requires its own set of
meta tags – e.g.
I believe there are plugins to handle this. I have my own simple function which uses the thumbnail of the page, or a fallback if this isn’t set.
OG meta tags is probably what you are looking for, in this case :
<meta property="og:image"content="path/to/foo.jpg" />
put inside a if
is_home() and hopefully it will work