Blog Documentation Book a Demo
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Wrong Facebook Description or no description ?

vrijvlindervrijvlinder MVP
edited August 2013 in Tutorials

So you are using the share button or something like that from Facebook, or you posted a link to a discussion on Facebook . But the description is wrong or it says " No description available "

First one must understand how Facebook fetches the meta and then the info :

I. Where does Facebook get the description?

Normally, when you share a post on Facebook, it would pull the first few lines of the post and use it as content description (a.k.a. snippet or summary). However for most forums and blogs, especially the ones built by Template  Designer, Facebook seems to pull something completely random. On some blogs it pulls texts from the comments, from blog description or from the sidebar, while on others it pulls nothing at all. Weird huh?

Facebook pulls the description from the following sources, in this order:

  1. First it looks for a description meta tag, and uses the content as description.
  2. If there is no description meta tag found, Facebook looks for the first < p > (paragraph) tag that contains at least 120 characters. (Do you know why comments discussions and blog description are picked as description? Because each of them is enclosed with a < p > tag, that’s why).
  3. If none of the above is available, it leaves the description spot blank.

According to Facebook, it scrapes your page every 24 hours to ensure the description (and other share data) are up to date. However, you can manually refresh it by entering the post URL into the Facebook URL Linter.

2. What can you do to fix this?

You can do one of the following things to solve the problem:

  1. Add description meta tag to post pages (recommended).
    add meta description to individual posts/pages
  2. Add a < p> tag to your posts.
    The absence of < p > tags in a post is the root of the problem in my opinion. Luckily you can add the tag easily enough. I explain it below.

3. How to add a < p > tag to a post?

There are three ways of adding < p > tags. Choose one.

  1. Manually enclose the first paragraph of your post in the< p >You need to do this every time you write a new post, using post editor’s HTML mode. To make the tag count, make sure you put at least 120 characters inside the tag:
    <p>FIRST PARAGRAPH OF YOUR POST</p>
  2. Use Windows Live Writer to write your post. WLW will automatically attach a <p> tag to each paragraph as you write your post.
  3. Add the tag into your template. This is a one time job, and by far the easiest. I recommend you opt for this method.

    Here’s how:

    1. Look for the following line in your HTML code:
      <data:post.body/>
    2. Enclose the code with a p tag, like this:
      <p><data:post.body/></p>
    What it does is put the entire post in a <p> tag. It will apply the tag to all existing and future posts.
    Important note: Adding a <div> or <blockquote> tag in your post will break the p tag. It will cut short the content inside the p tag -only the content from the beginning of the post until the the start of the tag will be placed inside p tag. And as it turns out, Blogger automatically adds a <div> tag whenever you add an image or click on one of those text alignment icons in the post editor. So, with that in mind, make sure you skip enough text (at least 120 characters) before adding an image or before doing any alignment.

Once you’ve done with the changes, enter the URL of a post into Facebook URL Linter. Then come back, share the post and see the difference.

For the rest of your posts, their descriptions will be updated the next time Facebook scrapes them.

I hope this helps someone .....

❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌

Tagged:
Sign In or Register to comment.