Facebook comment form is very powerful tool to increase the time a visitor spends on your site or blog. With the lovely "Love" logo and the inscribed sentence "We love Comments" added to it, it becomes very hard for a reader to finish reading a post without wanting to comment. This comment form from facebook have a feature that allow you receive a notification upon comment by any reader that visits and comment on your post. With this facebook comment form, you can be certain of your communication with your blog readers.I want you to follow me through the following steps
STEP 1: Visit Facebook developer page .
You may be asked to verify your account, choose any of the verification options to complete the verification.
Afterwards you will see a small form, enter your blog name (You can type any name or blog tittle).
Then, enter your blog url with an ending slash in Site URL (for instance:www.kutufam.com/)
Click on Create application.
Make sure you put the "/" sign at the end of your blog url as indicated in the picture below.
When you are successful, you should see a page displaying your application infomation. Copy the APP ID as indicated in the picture below and save it in a notepad.
STEP 2: Login to you Blogger dashboard and click on Layout/design; Edit HTMLand tick the small "Expand Widget Templates" box. Using "CTRL+F", search for the code <body> OR <body expr:class='"loading" + data:blog.mobileClass'> and paste the code highlighted below directly under it and save the template.
Replace the APPID in the code above with your APP ID provided from Facebook which you copied in Step 1 and save the template.
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=141084445958514&xfbml=1"></script>
After adding the code, your code should now look like:
STEP 3: Still in Design/Layout > Edit HTML and tick the small "Expand Widget Templates" box. Using "CTRL+F", search for the code
<b:if cond='data:blog.pageType == "item"'>
<p align='left'><a href='http://www.ogbongeblog.com'><img alt='' class='icon-action' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkk7zfP-SKdiashGKNxDGr9UAvry2x4ujxrWygcTnU193Tt6XJOPuJ6_ffL22jrUJdiBxKegBRk2ZkX6wIeWQApoNOqb3ntOuOEUtpF1x2h53mGr9VIsdE8wiPp29LyXsvcWaQ5tW2bKk/s320/commentpix.png'/></a></p>
<fb:comments expr:href='data:post.url' numposts='10' width='500'/>
</b:if>
You can adjust the WIDTH to any size you want (@ 500 ok ).
SAVE your template and view one of the POSTS on your blog. You should see the comment form with your picture embed, if your are on facebook.
NOTE
Change my URL in the above code(www.kutufam.com) to yours, else if a visitor clicks on, it will go to my blog homepage
That's all. SAVE your template and view your blog.
How about the Notifications?
You must add some codes to your blog HTML so you can be receiving facebook notifications and also to be able to moderate the comments.
Login to you Blogger dashboard and to Layout /design; Edit HTML and tick the small "Expand Widget Templates" box. Using "CTRL+F", search for the code <b:skin><
STEP 2: Login to you Blogger dashboard and click on Layout/design; Edit HTMLand tick the small "Expand Widget Templates" box. Using "CTRL+F", search for the code <body> OR <body expr:class='"loading" + data:blog.mobileClass'> and paste the code highlighted below directly under it and save the template.
Replace the APPID in the code above with your APP ID provided from Facebook which you copied in Step 1 and save the template.
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=141084445958514&xfbml=1"></script>
After adding the code, your code should now look like:
<b:if cond='data:blog.pageType == "item"'>
<p align='left'><a href='http://www.ogbongeblog.com'><img alt='' class='icon-action' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkk7zfP-SKdiashGKNxDGr9UAvry2x4ujxrWygcTnU193Tt6XJOPuJ6_ffL22jrUJdiBxKegBRk2ZkX6wIeWQApoNOqb3ntOuOEUtpF1x2h53mGr9VIsdE8wiPp29LyXsvcWaQ5tW2bKk/s320/commentpix.png'/></a></p>
<fb:comments expr:href='data:post.url' numposts='10' width='500'/>
</b:if>
You can adjust the WIDTH to any size you want (@ 500 ok ).
NOTE
Change my URL in the above code(www.kutufam.com) to yours, else if a visitor clicks on, it will go to my blog homepage
That's all. SAVE your template and view your blog.
How about the Notifications?
You must add some codes to your blog HTML so you can be receiving facebook notifications and also to be able to moderate the comments.
Login to you Blogger dashboard and to Layout /design; Edit HTML and tick the small "Expand Widget Templates" box. Using "CTRL+F", search for the code <b:skin><
Thanks for sharing this information.
ReplyDeleteThank u, do visit this blog regularly u will get what u want
ReplyDeleteHey there! Do you know if tthey make any plugins to protect against hackers?
ReplyDeleteI'm kinda paranoid about losing everything I've worked hard on.
Any recommendations?
My blog; adobe photoshop cs6 crack
Yes there is a plugin which protect you from hackers
DeleteThanks for showing me the way.
ReplyDeleteYou are welcomed do visit regularly
ReplyDeleteI am actually thankful to the owner of this website who has shared this fantastic information most Informative article. You explain everything in deeply and easiest language.
ReplyDelete