How To Set The Image Thumbnail That Shows When Someone Shares Your Website Link On Social Media

1. Using the featured image setting

One of the easiest ways to set an image for social media shares is to make sure that all of your posts and pages have a featured image. You should always be using a featured image on your Divi website, and it can be use for both social sharing and also for displaying like at the top of this blog post or on our main blog page. The featured image is the default image which will be shown by social media platforms like Facebook when somebody shares a specific post/page on their platform.

To set a featured image, click on edit on any given page/post from the WordPress Dashboard. Find the Featured image section on the right side and be sure you have one set for every page or post.

If you are maing change, don’t forget to click on Publish after you are done.

Use An SEO Or Open Graph Plugin

Social media tools have a set of meta tags called open graph which decide what image to show when you share a post or a page on their network. By default, if you set a featured image to a page/post, that will be one shared. But if you want to use a different image, you need to use an SEO or Open Graph plugin.  These plugins take priority over the featured image. It might sound technical and difficult but it’s actually very simple. Open Graph meta data helps social media websites extract the meta data about your posts or pages. The content in the meta dat that it finds is what is used to control how your content appears when shared on social media platforms like Facebook and Twitter. 

To use Open Graph Meta data we would need a SEO plugin such as Yoast SEO, Rank Math, All In One SEO, or The SEO Framework. All of these plugins work well with Divi, so you can use any of them that you prefer or already have installed. For the purpose of this tutorial we are going to demonstrate using Yoast SEO.

Example Using Yoast SEO

Once you have installed and activated the Yoast SEO plugin, go to SEO>Social in the menu. There you can see tabs for a few social media platforms where you can confiture some settings. 

Start with the Facebook tab and make sure the Add Open Graph meta data toggle is Enabled. Then in the Default settings section you can set a default image that will show up by default when a page or post without any image is shared on Facebook.

You can also check the Twitter tab to configure the default settings. But these are just the default settings. The main place to remebmer to set the image is on the actual post or page.

When you go to any page or post, you will see a new set of tabs related to the SEO plugin like Readability, Scheme, and Social. The Social tab is what we need here. 

Notice how it had two toggles, one for Facebook preview and one for Twitter preview. Each of these open up and allow you to configure the social sharing image, title, and description that is used when someone shares your Divi website.

Example With Open Graph Plugin

If you are not using an SEO plugin, then I recommend a simple little plugin called Open Graph (they actually recently changed the name to Open Graph and Twitter Card Tags). I have used this and it works well and they have all the features you need.

After you install the plugin, you can go directly to any page or post. If you want to browse the main settings, then you can check Settings>Open Graph and Twitter Card Tags. Pretty much everything there is good to go, but it’s nice to be aware of the options can can be adjusted.

At the bottom of any page/post you will see this box:

You can choose a photo, and then notice what it says at the bottom about writign a custom description or leaving it blank to use the excerpt or content.

Now update the page or post to save the settings, and now all that’s left to do is to share your website on Facebook and check out the text and image being displayed there.

Image Not Showing? Debug That Thing!

If you already shared a page or post to Facebook, but either it isn’t showing the right preview image or you want to change the image, Facebook can be pretty stubborn, and it may be showing the wrong image or none at all. This is because their platform uses cache and it needs to be cleared in order to show the correct image from your website.

Thankfully Facebook make this easy with a tool called the you may need to use the Facebook sharing debugger. All you have to do is copy and paste the URL of the page or post inot the tool and click “Debug.” This will scan your page and look for fresh data, and so if you changed or added an image it will update it on the platform.