Why Facebook Doesn't Show the Images of My Blog Posts

How To Make
Facebook Pick or
Show Up the Exact
Image or Images of
Your Blog Posts or
Web Pages When
You Share Them on
Facebook?

By
Alex Bond
Search Engine Talks

An Easy To
Understand Guide To
Help All the Online
Marketers, Business
Owners and Bloggers
Get Rid of This Very
Common Issue
Permanently!

Issues People Have Faced and Are Still Facing With Facebook

Example: 1

There are many people who’ve already
experienced and are still experiencing this
issue. They are sharing a link or one of their
blog posts on Facebook, but Facebook is not
showing up the image of their blog post.

Example: 2

According to example no. 2, Facebook is able
to pick the images and also giving people an
option to choose their desired
thumbnail, but the problem is none of those
images belong to the blog post people
actually want to share.

Why Is This Happening With Facebook and What’s the Solution?

Reason:
The reason you’re facing this problem is because, you're not making it easy for Facebook to read the
source code of your web pages or blog posts and the properties of your blog posts like: the
Title, Description, Image or Images and others. In other words I can say that, Facebook actually and
always tries to read the source code of your web pages or blog posts, but not always able to pick or show
up the images.
Which is why in most of the cases Facebook doesn’t show any image, just like shown in the Example: 1
on the previous slide. And in some cases Facebook does show an image or few images (which is/are
actually and mostly the default image/images you’ve on your website or blog) and gives you an option
to choose the thumbnail you prefer, but unfortunately that image or those images don’t belong to the
blog post you want to share, just like shown in the Example: 2 on the previous slide.

Solution and Benefits:

To solve this issue or problem and to allow Facebook pull the exact image or images of your web pages
or blog posts, Facebook requires you to set up its own social media tags or meta tags in the source code
of your web pages or blog posts, which is called “Facebook Open Graph”. Facebook Open Graph
meta tags allow Facebook to read the source code of your web pages or blog posts and their properties
like: Title, Description, Image or Images etc. and most importantly instruct Facebook which
Title, Description, Image or images to pick. Besides, implementing Facebook Open Graph meta tags not
only solve this issue, but also increase your Facebook traffic as well.

Which Open Graph Meta Tags To Use?

There’re many Open Graph Meta Tags that one can use, but generally
nobody use them all. Below is a list of 9 mostly used, recommended and
important Open Graph Meta Tags that you should use. Remember, all
these meta tags should be placed between the HTML Head tags i.e.:
<head> </head>, of the source code of your web pages or blog posts.

Meta Tag #1

No. 1 If you’re using any Plugin or App to
produce Open Graph Meta Tags then you
<meta property="fb:app_id" need to mention an app ID to the Plugin
content="Your App ID" /> settings page as Facebook requires it. It
also renders better Facebook Insights.
Recommended for WordPress users.


No. 2 Important tag for better and more data
in Facebook Insights. It helps Facebook
<meta property="fb:admins" recognize that you’re the website owner
content="Your FB Admin/User ID" and thus your website gets connected to
/> your Facebook Fan Page. Recommended
for all WordPress and Non-WordPress
Users.

Meta Tag #2 & #3

No. 3 Important tag where you need to
mention the title of your web page or
<meta property="og:title" content="Title blog post to optimize it on Facebook. You
of the blog post/web page" /> need to keep the title less than 95
characters. Recommended for all
WordPress and Non-WordPress Users.


No. 4 Describes the content of your web blog
post. Write a short and compelling
<meta property="og:description" description and add few keywords in
content="Description of the blog it, so that it can generate more clicks.
post/web page" /> You need to keep it within 297
characters. Recommended for all
WordPress and Non-WordPress Users.

Meta Tag #4 & #5

No. 5 Helps Facebook pull the exact image or
images of your web pages or blog posts.
Very important and recommended for all
<meta property="og:image" WordPress and Non-WordPress Users.
content="URL of the image" /> Some more important specifications are
there for this tag, which are mentioned in
the “Key Notes” slide below.


No. 6 Mention the exact URL of the web page
or blog post you want to share on
<meta property="og:url" content="URL Facebook. This tag makes sure that all
of the blog post/web page" /> the likes and shares are counted towards
the URL you’ve mentioned in this tag.
Thus very important and recommended
for all the website owners.

Meta Tag #6 & #7

No. 7 Lets Facebook know the name or the tag
line of your website or business. Not as
important as the other Open Graph Meta
<meta property="og:site_name" Tags, but your brand name can be well
content="Name or Tag line of your optimized on Facebook through this tag.
Website/Business" /> So have it!


No. 8 Here in this tag you need to describe the
type of your content. Means what type of
<meta property="og:type" content=“type content you’re sharing? Like: whether it’s
of the content"/> an article, blog, website related or
hotel, sport, book related. Just need to
mention that. Recommended for both
WordPress or Non-WordPress users.

Meta Tag #8 & #9

No. 9
You need to specify the language of your
content here in this meta tag. If not
<meta property="og:locale" specified the then it uses “en_US” as the
content=“language of your content"/> default language.

Now How To Set Up the Open Graph Tags?

There’re Two Ways To Set It Up

1. For Both WordPress & Non-
2. For WordPress Users Only
WordPress Users

This particular method of setting up the Open If you’re a WordPress user then you can use
Graph Meta Tags is common for all the Plugins like: WP Facebook Open Graph
website owners, both WordPress and Non- Protocol or WordPress SEO by Yoast and they
WordPress users. will generate the open graph meta tags for all
the web pages or blog posts of your website or
You’ve to edit the source code of your web
blog.
pages and manually implement the open
graph meta tags for each page on your Remember, you must add your Facebook user
website or blog. Remember, the open graph or admin ID or an App ID or both of them to
meta tags should be placed between the the Plugin settings page in order to make the
HTML Head tags i.e.: <head> </head>, of Plugin generate correct open graph meta tags.
the source code of your web pages. Besides, this is required by Facebook as well.

So friends, now you all know how to make Facebook pull and show up the exact image or images of
your web pages or blog posts when you share them on Facebook right? Imm hmm!! Wait it’s not
the end yet!! You need to know some important “Key Notes” here on the next slide.

Key Notes:

It’s been seen now a days that people are adding more than one image in a blog post or
web page. Now here is the twist, implementing Facebook Open Graph Meta Tags only, is
just not enough to get the image/images of your web pages or blog posts picked up
properly by Facebook. There are few other important things that Facebook wants you to
take care of. So what those things are? See below:

1. The image or all the images should be at least 200px in both dimensions, means 200x200 px at least.
However bigger than that is always better i.e. preferably 1500x1500 px.
2. Size of an image shouldn’t exceed 5MB, it has to be within 5MB.
So it means that you have to check all the images with "og:image" tag and make sure that your image or
images meet the above specifications highly recommended by Facebook.
3. Lastly, WordPress and Non-WordPress users who are generating the open graph meta tags manually
need to make sure that they’ve added the "fb:admins" meta tag with their Facebook user ID and
WordPress users who are using Plugins need to make sure that they’ve added their Facebook user ID or
the App ID or both of them to the Plugin settings page to ensure correct implementation of open graph
meta tags and as Facebook requires this. Besides, both "fb:admins" & "fb:app_id" tags render more data
in Facebook Insights and better News Feed story that ensures high CTR.
Now, if you follow all these simple things I’ve mentioned in this presentation then I guarantee that you’ll
never encounter this issue regarding images with Facebook!  

Hi Friends! I’m Alex
Bond, a Digital, Internet &
Online Marketing
Consultant, have been
working in this industry for
more than 8 years and
trying my best to help
business owners achieve
their goals. Besides, I’m a
simple kind of person
trying hard each and every
single moment to reach my
goals and I love connecting
with new people. Connect
with me, not as a client but
as a friend first! Thanks
and God Bless You All! 

Facebook
Twitter
Google+

Image Credit: Gotcha

Why Facebook Doesn't Show the Images of My Blog Posts

Recomendados

Recomendados

Más contenido relacionado

Último

Último (20)

Destacado

Destacado (20)

Why Facebook Doesn't Show the Images of My Blog Posts