Facebook Authorship For Blogspot Blogger Confirmed Working
Hello. As you can see using PC or mobile browser desktop view some people's blog or webpage link share on Facebook is written with author name written in blue link that people can hover to like or follow from the link itself without ever going to the person or page's FB profile.
Most of the links are wordpress based blog. You use blogger platform, you had tried the tutorials written by the others on the web but still the author name is shown either your name or no name or author name with a static text. Are you happy with that? Do you want to know how to change the author name to your FB profile link or FB page link? Read On
This thing is called Facebook Authorship. It was done using Facebook Open Graph. Facebook have it own crawler that find the Open Graph object and properties and then translates them to human readable form. If the crawler couldn't find any OG propeties, it will use raw meta it could find. The author name will be derived from the blog's author name setting which is derived from the google's account profile
1. First thing first, create a page in FB if you want to be absolute anonymous. You can skip this step if you want to use your personal FB profile
2. Log In to your blogger account
3. Go to your blog name to go to your blog dashboard
4. Click on template, then click on edit HTML
5. Copy these line of texts and paste it in notepad or whatever editor you have
<head prefix='og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#'><meta content='article' property='og:type'/> <meta content='[[[[[[ Read this.. Got this ]]]]]]]]]' property='og:title'/> <meta content='https://www.facebook.com/learningtoolcheap' property='article:author'/> <meta content='https://www.facebook.com/learningtoolcheap' property='fb:profile_id'/><meta content='[[[[[[ Read this.. Got this ]]]]]]]]]' property='og:site_name'/>
Let's see line by line
<head prefix='og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#'> This line is used as the prefix. Don't do anything, just copy the line
<meta content='article' property='og:type'/> Nothing to be done. just copy the line
<meta content='[[[[[[ Read this.. Got this ]]]]]]]]]' property='og:title'/> Replace the red font with your page title
<meta content='https://www.facebook.com/learningtoolcheap' property='article:author'/> Replace the red font with your page or personal FB profile link. This is the blue author line
<meta content='https://www.facebook.com/learningtoolcheap' property='fb:profile_id'/> Replace the red font with your personal or page FB profile link. This is the facebook id of a user that can be followed. This is useful if you use your personal profile.
<meta content='[[[[[[ Read this.. Got this ]]]]]]]]]' property='og:site_name'/> Replace the red font with your site name.
6. Copy all the lines with your own values replacing the red fonts.
7. Make space right below <head> line (put cursor at the beginning of the next line after <head> and press enter 7 times)
8. Paste the code right below the <head> line
9. Delete the original <head> line
10. Your template HTML will look like the picture on the right
11. Save the template
12. Open a new tab in your browser
13. Go to https://developers.facebook.com/tools/debug/og/object/
14. Enter your blog link address
15. Click on Fetch New Scrape Information
The picture on the left shows basic info FB crawler read you link. It shows the time, date and like, share, comment count
The picture on the right show OG properties FB crawler could read from your page
The picture on the left shows how you link share will show up. Notice the author name had changed to blue link. Click on see this in the share dialog link to see the real appearance
The picture on the right shows the final share dialog
For wordpress or other platform, the steps should be the same but this tutorial was done using blogger platform. This is the way to customize Facebook authorship for blogspot blogger. These steps are confirmed working for blogger patform. Don't forget to put this pages's link on your blog/website if this tutorial helps you then leave your link in the comment section. Your link will be inserted in this blog's link list. Happy trying.
P/S : For additional OG properties, refer
https://developers.facebook.com/docs/sharing/opengraph/object-properties
Artikel ini hanyalah simpanan cache dari url asal penulis yang berkebarangkalian sudah terlalu lama atau sudah dibuang :
http://www.dendangperantau.com/2015/08/facebook-authorship-for-blogspot.html
PING BABAB : Raksasa Aggregator Malaysia
