Default image for homepage when shared in social media

Question

Default image for homepage when shared in social media

Thredolsen

2019年7月31日 17:29

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?

Topic social-sharing images homepage Wordpress

Category Web

Dihgg · Accepted Answer · 2017年6月27日 18:11

1

Dihgg answered at 2017年6月27日 18:11

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

Jonny Perl · Accepted Answer · 2017年6月27日 18:06

Different social platforms use different methods.

For Facebook, you need a set of <meta> tags with og properties - e.g. og:url, og:type, og:description and og:image. 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. name="twitter:card" and name="twitter:image"

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.

WebElaine · Accepted Answer · 2017年6月27日 18:05

Several options:

Out-of-the-box plugin

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.

Child theme

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_front_page()) or 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; ?>" />

Custom plugin

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.

Default image for homepage when shared in social media

About