Skip to main content

Complete Tutorial on Facebook Open Graph


Facebook Open Graph for Web Developer


Facebook Open Graph allows you to use custom site title, URL, description and even a custom image when you share your page. If you use Facebook Open Graph code on your site, every time when you share any page, it will be counted directly for your home page. Suppose, if I share the following URL on Facebook - 

http://www.markspcsolution.com/2014/09/complete-tutorial-on-facebook-open-graph.html

The sharing/ like will be counted for - 


http://www.markspcsolution.com/


But If there is no open graph code on my site, the sharing of the first URL will be counted individually. And the sharing will not be counted for your home page. Now I guess, you've understood the importance of open graph. It's really helpful to increase facebook likes of your site rapidly. 


Couple of days ago, I discussed about how to claim a site on Facebook. Following the same method, you can place Facebook Open Graph code on your site. Open graph code is as follows:



<meta property="og:title" content="Site Title"> 
<meta property="og:description" content="Site Description"> 
<meta property="og:type" content="Content Type">
<meta property="og:url" content="http://www.example.com/"> 
<meta property="og:image" content="Custom Image Link"> 
<meta property="og:site_name" content="Your Site Name"> 
<meta property="fb:admins" content="Your Numeric FB ID">


You have to place the above code in the head (<head> </head>) section of your site's HTML. The code must be placed before closing head tag - </head>.


Facebook Insights Meta Code

Now follow the steps below:

  1. Go to Facebook Insights > Domain Insights > Add your Domain
  2. Type your home page URL > Copy the Numeric FB ID > Keep the window open
  3. Go to your site's code or HTML and find the closing header tag </head>
  4. Place the above code before closing header tag
  5. Now back to the Facebook Insight Page 
  6. Hit on the Get Insights button
  7. Now you should be able to see your domain under the Domain Insights section


There are 7 meta properties in the above code. You have to change in the content option.  Make sure you've used them properly. I'm gonna clarify the points - 
  1. Site Title Example - Marks PC Solution.
  2. Site Description - What's your site about. Example - Your Ultimate Choice for Computer, Internet, Blogging, SEO & PC Troubleshooting Tips!
  3. Content Type - Website/ Blog/ Article/ News etc.
  4. Site URL Example - www.markspcsolution.com
  5. Custom Image - Upload your desired image in a server. Then simply copy and paste the link here. You can use postimage.org to upload image.  
  6. Type your Site Title here. Example - Marks PC Solution.
  7. Numeric FB ID that you've got from the 2nd step in Facebook Insights Page. You can also find numeric by this method


Marks PC Solution Custom Image



Troubleshooting

If you face any problem after implementing the code on your site, you can take help of Debugger. Here you can paste your site URL and debug the errors. You can check whether all properties are functioning normally or if there is a problem. 

Remember, you can omit some properties. If you use Custom Image, then it will be same for any link of your site. So you can also use a shorter version of the code as below:

<meta content='Website' property='og:type'/> 

<meta content='http://www.example.com/' property='og:url'/> 
<meta content='100002127563096' property='fb:admins'/>

It will do the same job for you. You can also use multiple Admin IDs. Simply add more numeric IDs in the admin property.


If you need any support regarding Facebook Open Graph, please leave a comment . . . 


Stay with Marks PC Solution to get more interesting IT topics!



Comments

Popular posts from this blog

GTA San Andreas Cheat Code (PDF)

After Vice City, San Andreas is the most popular game released by Grand Theft Auto (GTA). Usually GTA releases role playing game. San Andreas is such a game where you can act like a person. You can do everything. You have to take part in missions and complete them.  To make your missions easier, there are lots of cheat codes. If you can properly apply these codes, the tough parts of the game will be easier. Cheat codes are somewhat like keyboard shortcuts of computer programs.  I've shared 63 cheat codes below. There were more cheat codes in my collection, but I've omitted the less important cheats. Effects or result of the cheats are on the left side, and the codes are on the right side.  You can copy the following codes in your PC. And for your convenience, I've also uploaded a PDF file of these codes. You will find the download link at the bottom.  Effect Cheat Code Adrenaline Mode MUNASEF All Cars Explode ALL...

How to Change IP Address on Windows 10 (Easy Way)

    In fact this is not a very difficult task. But in case of emergency you may not find the right option and this happened in my office few days ago! I solved the problem myself and decided to write a note for you at my site . . .   Changing IP Address on Windows 10 Simply move your mouse pointer at the bottom right corner and make a click on network icon > choose Open Network and Internet settings. Follow the image below -    After clicking on this option you will get the following dialogue box. Here you should notice Ethernet properties. Click on it.   Now you will get another screen as below. Here you will get several options. But our concern is IP settings and Properties . If wanna view your IP details then look at the Properties. If you need to change it then hit on the Edit button.    After clicking on the Edit button you will have two options i.e. Automatic (DHCP) & Manual.    In order the change the IP you should choose ...

Office 2016 Activator (KMSPico 10.1.5)

It's been couple of months after the release of final version of Microsoft Office 2016. And maybe you're tired of finding for a working activator for this version. Today I'm gonna share Office 2016 activator with you - no more waiting!! About the Activator   Name: KMSPico 10.1.5 File Size: 3 MB (Approx) File Type: Zipped Folder 100% Neat & Clean - No virus! Activating Capacity . . . KMSPico 10.1.5 is successfully leading the KMS world for last few months. If everything is okay, success rate is 100%. This tool has been tested and verified by Marks PC Solution. With this tool, you can activate -  Office 2016, 2013 & 2010 Windows 10, 8.1 & 8 Hopefully this version will work for both 32 bit & 64 bit versions of Windows. Installing Office 2016 Collect/ Download Office 2016 Professional Plus from Microsoft or somewhere else. Install it as trial version without any key. Use the follow...