Here is the problem: when sharing a blog post or a page from your own website on Facebook, very often the text and image selected by default don’t match what you had in mind… a text snippet, a specific image that you intended to display, some words you wanted to emphasize. The screenshot bellow illustrates the problem (before I fixed it).
The image issue: when sharing this post on Facebook I wanted to include the Post’s Featured Image (the eye image tearing Facebook’s logo), but as you can see, the screenshot below was not showing any image at all.
The text issue: the text snippet starts with the post’s title followed by the first 70 or so characters of the post. Again, this is not what I wanted to display. I want to replace the text with the following text: “Don’t let Facebook pick any image or text from your blog! Decide which image and text will be displayed when your post is shared on Facebook.”
This post will teach you how to display a different text and pick a specific image. Once your selection is set it will be applied any time a visitor shares your blog post on Facebook. This way you can control what will be shared on your visitors Facebook timeline.
The solution is composed by:
- Part #1 – One time setup
- Part #2 – Three (3) quick and easy steps.
- STEP 1 – Upload the right image (POST>SEO>Social)
- STEP 2 – Write the text you want to be shared
- STEP 3 – Share the post (not the blog) – this step is just a reminder
Part #1 – One time setup
Before jumping into steps 1, 2 and 3, we need to have the proper tools in place. For that we will be using the plugin Yoast SEO, which is a free plugin primarily used to improve your WordPress SEO. We will see how this plugin can also help us control which image and text will be displayed when sharing your post on Facebook.
Chances are you already have the Yoast SEO plugin installed and activated in your WordPress website. If not go ahead and do it now, then follow the steps below.
Part #2 – Three (3) quick and easy steps
(for each page or post you want to set a preferred imaged and text).
STEP 1: Upload the right image
Upload and image at least 200 x 200 pixels. Note that Facebook’s recommended size is 1200 x 628 pixels. If you use an image smaller than 200 x 200 pixels, Facebook will not “pick” it.
In this tutorial I will be uploading the following image:
So let’s get started:
- Scroll up and down inside the post (or page) and find the Yoast SEO area (see image below).
- Click on the Social tab.
- Click on the Upload Image button (on the Facebook Image field) and select the image to be uploaded.
- You can select from the Media Library (previously uploaded) or Upload an image now.
STEP 2: Write the text you want to be shared
- On the Facebook Description field (image above) write the text you want to be displayed.
- You can also change the Facebook Title if you want it to be different from the post title.
- Remember to save your post/page changes by clicking on the UPDATE button.
Everything is now set to display the image and text selected.
STEP 3: Sharing the post (not the blog)
I have added this last step as a reminder of the difference between sharing a blog page and a blog post.
The blog page is your blog’s main page. Depending on how you set it, it may show full posts or fragments (summary). This is my blog page: http://bluesquarewebdesign.com/blog/. It shows the post’s featured image and a short summary.
The blog post is the specific article (post) you published and want to share. It shows only one post. It is the page you are reading now: http://bluesquarewebdesign.com/control-which-image-and-text-will-be-displayed-when-sharing-your-post-on-facebook/
If you have followed steps 1 and 2, at this point when clicking on the Facebook sharing button for this particular blog post this is what you will see:
You can try it for yourself by clicking on the Facebook icon on the left side of this post… thanks!
What if Facebook is still picking the wrong image?
It can happen that after you have uploaded an image (STEP 1) Facebook does not pick it because it gets “stuck” with a previous image. To solve this issue you need to ask Facebook to fetch a new scrape information. Here is how.
- Go to https://developers.facebook.
- Enter the Input URL. That is your post’s URL (not the blog’s… the post’s)
- Click on Fetch New Scrape Information
After that try sharing the blog post again and Facebook should pick the exact text and image selected.