Today Shout Me Crunch presents a step by step tutorial on how you can use the externally uploaded image as facebook featured image. Many of the bloggers complain about not gaining the exact image perfection when you share an article on Facebook. It’s because of you are using an image with the wrong dimension. So Facebook needs to crop automatically when sharing.
How to use the external image as Facebook Featured (OG:Image)?
The ideal image size for Post Share on Facebook is: 1200px X 630px (1200 pixel width and 630 pixel height)
Benefit of using External Image as Facebook Featured Image
- There are lots of benefits using External Image as Facebook Featured Image. We are discussing it below.
- If you use the image from imgur.com, the image will load lot faster
- It will decrease the server load of yours.
- It will replace as OG: Image so Google Related article ads will show that image.
- You can upload images offsite with relatively more substantial size. In your server, you need to upload an image with relatively short size. It will save your disk space of the server.
Your Featured Image got distorted? Here is the solution
First you need to see your SEO plugins. You need to use Yoast or All in One SEO pack to set external featured image for Facebook.
If you use Yoast SEO If you use All in One SEOBut First things first. Where you can upload the Image?
For Uploading Image. I am Using Imgur.com
- Go To Imgur.com
- Sign up a Free Account There.
- Log in with your username and password
- Upload image
Step By Step Tutorial [Video]
- You can see a social button in the SEO Box of Yoast. Click on the Social Button. The picture is shown number 1.
- You can see the below there is a field to give image link. The recommended size of uploading image is 1200X630px.
- You can upload the direct image link here. Direct Link means with extension .jpg, .jpeg, .png, .gif. If you have already uploaded the image to imgur.com. Right-click on the image and get the direct link (Bly clicking copy image link or copy image location).
- After Publishing the post, Debug the post with Facebook Debugger:
https://developers.facebook.com/tools/debug/
You can see the OG: Image from Imgur link.
- Go to Social Settings as marked arrow 1.
- Paste the direct Image link in Custom Image Field. I have pasted the imgur direct link image in that box
- It’s the part you need to specify width and height of the image. You can get the image width and breadth easily. Just Paste the Direct image link in new tab. You can see the image dimension in the browser tab header.
- After Publishing the post, Debug the post with Facebook Debugger:
https://developers.facebook.com/tools/debug/
I have found a problem with debugging ALL in SEO. That is OG: Image: alt is not fetched automatically.