How to Add Facebook Comment Boxes with PHP

Facebook comments are a great way to optimize your site for social media and add a level of user-engagement to you site. Quality website comments can increase your website’s credibility, as well as its traffic. This tutorial will teach you how to use Facebook’s API Connect to integrate comment boxes on your website in a few simple steps, utilizing a little PHP and some elbow grease.

Before you can implement a Facebook comment box, you need to ensure that you meet the following requirements:

  • You have access to your website’s template source code – this way you can add the Facebook comment code to your website files and then save it back to your server.
  • You have a verified Facebook Account – there are two ways you can verify your account; either by mobile phone or credit card.

Bear in mind that there are actually two versions of the Facebook comment box. The first one was released in 2009 – this is the old version that a lot of websites are still using. The latest release – which is basically a major overhaul – was released last March 2011.
This tutorial will focus on how to add a Facebook comment box to your website using the latest version.
 
The First Step: Setup a Connect Application

You need to setup a connect application before you can integrate Facebook comment boxes on your website. To do so, follow the steps below:

  • Go to: http://www.facebook.com/developers/createapp.php
  • Login using your verified Facebook account.
  •  After logging in, it will ask for permission to access your basic information; just click “Allow”.
  •  If you see the message “Congratulations! You have successfully installed the Developer App!”, click “Setup new App”.
  • It will ask you for an App Name and if you agree with the Facebook terms.
  • You are then required to enter some basic information about your app(s). Here is an example of some of the required fields:

Application Name: My website Facebook comment box
Description: Comment box for example.com blog
Contact email: The same as the email address that you are using in Facebook.
Privacy Policy URL: The URL of your website privacy policy.
Terms of Service URL: The URL of your website terms and conditions.


  • Click “Save changes”.
  • Facebook will then provide an App ID, API Key, App Secret and all of the details regarding your comment application. Take note of this data, copy and paste these details to a text file and save it to your computer in a safe location.
  • Click “Website” and you will see the core settings. Enter your Site URL and Site Domain, e.g.


Site URL= http://www.example.com/ and Site Domain is example.com

  • Click Save Changes.

Summary:

  • Go to: https://www.facebook.com/developers/apps.php – you should see all of your apps there.
  • Click your comment application.
  • You should see all of the information pertaining to your apps (e.g. App ID, API key, APP Secret, contact email, etc).
  • Click “Edit Settings”. Only “About” and “Website” really need to be edited – you do not need to edit the rest (e.g. Facebook Integration to Advanced).
  • Click “Back to my Apps”. Under Directory status you should see: “Not Submitted”. You do not need to submit to the App Directory for your comment box to work.


{mospagebreak title=Integrate Facebook Comments Code with WordPress or PHP}

Now that your application is fully ready, you can integrate the Facebook comments code to your site. You will be the one to decide where you are going to place the Facebook comments. For example, if you are using WordPress and you would like to put the Facebook comments on each blog post (assuming you have disabled or removed the WordPress default comment feature), follow the steps below:

  • Log-in to your WordPress admin panel.
  • Go to Appearance – Editor
  • Under “Templates” click “Single.php”.
  • Locate the end of the post section and paste this code:

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:comments href="<?php the_permalink(); ?>"></fb:comments>

The value of href should the canonical post URL. The primary reason is that when someone in Facebook clicks the link, the user will land on the exact post URL in your website where the comment will be found and not in other places of the site.

The PHP function:

<?php the_permalink(); ?>

Will return the exact and canonical post URL where the comments have been made. This is a WordPress specific function and will not work with other CMS or blogging software.

  • Save the changes to your single.php file.
  • Now open header.php. If you need to moderate comments and receive notifications for all comments on your website, paste this code in the head section just before the </head> closing tag:

<meta property="fb:app_id" content="{YOUR_APPLICATION_ID}"> <meta property="fb:admins" content="{YOUR_USER_ID}">

Replace {YOUR_APPLICATION_ID} with your Application ID. And replace {YOUR_USER_ID} with your Facebook User ID. Example:

Application ID: 123456789
Facebook User ID: 987654321

The code will look like:

<meta property="fb:app_id" content="123456789">
<meta property="fb:admins" content="987654321">

To get your user ID, simply mouse over your name in your friends Facebook profile or comment on any discussion board in Facebook, then mouse over your name. In your browser status bar it will appear as:

https://www.facebook.com/profile.php?id=987654321

Where the user-ID is 987654321

Now clear all of your browser cache, history, etc. Open any of your WordPress posts. You should see the comment box in the bottom of each post:



Take note that the above procedure is using WordPress. If you are not using WordPress, (e.g. you are using Blogger, Drupal or a custom made CMS) you need to consult the CMS documentation or a developer. If you are using PHP in your website, you can implement the entire code above using the layout below:

<?php
//function to get the current post URL of the page
function current_page_url(){
$page_url   = ‘http';     if(isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == ‘on’){
$page_url .= ‘s';
 }
return $page_url.'://’.$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
}
<html>
<head>
<title>This is your post where you need to add a Facebook comments</title>
<meta property="fb:app_id" content="{YOUR_APPLICATION_ID}">
<meta property="fb:admins" content="{YOUR_USER_ID}">
</head>
<body>
<!–This is the start of your post–>
<!–This is the end of your post, below this you will need to insert Facebook comments–>
<!–Inserting Facebook Comments–>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:comments href="<?php current_page_url(); ?>"></fb:comments>
</body>
</html>

The above script works with any PHP based website. The current_page_url function grabs the current post URL where the comment will be made.

{mospagebreak title=Configuring Your Facebook Comment Box}

At this point in the integration process, your Facebook comment box should be working pretty well. However, you can still configure your Facebook comment box according to your needs. To do so, follow these steps:

  • Login to Facebook.
  • Go to the website where the comment box has been integrated.
  • Since you are an administrator, you should see a “Settings” link. Click this link and you will see the configuration parameters for your Facebook comment box. To combat spam and comment abuse, the following are recommended:

a.) Check “Let me approve each comment before it is shown to everyone”. This will ensure that all comments published on your website are helpful in the discussion and related to your website post.

b.) Under Blacklisted words, select “Standard Facebook Restrictions”.

c.) To increase the chances of those that do not have Facebook accounts commenting on your website, check “Allow users to post using other login providers”.

d.) Check “Automatically correct comment grammar mistakes”, so that the comments are grammatically correct.

e.) Under “Comments composer” select “Collapse when there are more than 5 comments”.

Finally click Save to implement the changes. This will be implemented site wide. See screenshot below:



You can moderate all comments on your Facebook developer page:

  • Go to: https://www.facebook.com/developers/apps.php
  • Login to your Facebook account.
  • In your apps, click comment apps and then click “Moderate Comments”. You should then see all of the comments made on your website using Facebook.

 

[gp-comments width="770" linklove="off" ]

antalya escort bayan antalya escort bayan Antalya escort diyarbakir escort