tag:blogger.com,1999:blog-46929895137826838602024-03-05T07:38:17.434-08:00Integrate Facebook Comments for Blogger Tutorial This tutorial shows you how to install Facebook comments on your blogger blogspot Your readers from Facebook will then be able to like or comment on your blog making them feel at home
Anonymoushttp://www.blogger.com/profile/00343566859755046681noreply@blogger.comBlogger1125tag:blogger.com,1999:blog-4692989513782683860.post-63618250778638948172014-08-25T11:09:00.002-07:002014-08-25T11:13:56.657-07:00<div class="MsoNormal">
Display Facebook comments on your diary and let Facebook
users inquire into your diary while not sign language up for Blogger or
alternative services.<o:p></o:p></div>
<div class="MsoNormal">
This tutorial assumes that you just have a Facebook account
and a Blogger account with a diary.<o:p></o:p></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-EghIslOHue2NNFVdB_2fzUs_8VSMO3j4eHjsTXCrsNnvSaANFp1bxn94dcbQT4M2jKOCF0IeXP_OK6MJDCl6gJjbu1u1B-pSJoH0WXP6MAErHmkQoxzEHL1hQ2XCIkdQG5U6GPDVfglk/s1600/facebook+comment.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-EghIslOHue2NNFVdB_2fzUs_8VSMO3j4eHjsTXCrsNnvSaANFp1bxn94dcbQT4M2jKOCF0IeXP_OK6MJDCl6gJjbu1u1B-pSJoH0WXP6MAErHmkQoxzEHL1hQ2XCIkdQG5U6GPDVfglk/s1600/facebook+comment.jpg" /></a></div>
<div class="MsoNormal" style="text-align: center;">
<br /></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
<b>1. initial you would
like to make a Facebook App for your diary. <o:p></o:p></b></div>
<div class="MsoNormal">
<b>2. within the high
right of your screen click on the "+ produce New App" button as shown
within the screen shot below:<o:p></o:p></b></div>
<div class="MsoNormal">
<b>3. you'll be bestowed
with the screen below during which you would like to choose:<o:p></o:p></b></div>
<div class="MsoNormal">
A name for your app which may be something you like; I
actually have chosen "JT diary Comments"<o:p></o:p></div>
<div class="MsoNormal">
A namespace for your app this may be something you wish in
addition however it should be altogether graphic symbol letters with none
areas. I actually have chosen "jensontaylor". don't fret concerning
what these attributes do, however simply recognize that they're necessary for
any Facebook App.<o:p></o:p></div>
<div class="MsoNormal">
Do NOT tick the net hosting possibility. this is often not
necessary for our comment application.<o:p></o:p></div>
<div class="MsoNormal">
Once you have got entered all the main points click
"Continue"<o:p></o:p></div>
<div class="MsoNormal">
<b>4. you'll then be
asked to pass the "captcha" check. i.e. kind within the letters
within the image so as for Facebook to verify that you just square measure a
person's and not a spamming malicious program. Enter the proper letters or
numbers the clicking "Submit".<o:p></o:p></b></div>
<div class="MsoNormal">
4.a) If you have got not setup your Facebook account with a
transportable range you'll see the message below. If you do not see the message
below skip to step five (that means that you have got already setup your
account with a mobile telephone). For those of you - like myself - United
Nations agency bump into this message, click on the link within the red box
that says "mobile phone".<o:p></o:p></div>
<div class="MsoNormal">
4.b) you'll then see the screen below;<o:p></o:p></div>
<div class="MsoNormal">
Select your country<o:p></o:p></div>
<div class="MsoNormal">
Enter your transportable range<o:p></o:p></div>
<div class="MsoNormal">
Then click the "Confirm" button<o:p></o:p></div>
<div class="MsoNormal">
4.c) you'll be taken to the page below and at an equivalent
time receive a text message(SMS) on your transportable. Enter the code from the
SMS you received on your transportable within the box and click on
"Confirm"<o:p></o:p></div>
<div class="MsoNormal">
4.d) you'll then see successful message as shown below
stating that your account has been verified. shut this page and return to
wherever you left off after you came upon the popup at step (4.a).<o:p></o:p></div>
<div class="MsoNormal">
4.e) Follow directions in step three once more.<o:p></o:p></div>
<div class="MsoNormal">
<br /></div>
<div class="MsoNormal">
4.f) Follow solely the primary a part of step four that is
barely getting into the inclined text displayed within the image. Then jump to
step five.<o:p></o:p></div>
<div class="MsoNormal">
<b>5. you'll see the
page displayed below;<o:p></o:p></b></div>
<div class="MsoNormal">
Make a note of your App ID or copy it<o:p></o:p></div>
<div class="MsoNormal">
Where is says "App Domain" enter
"blogspot.com". (If you host your diary on your own name then enter
your name here)<o:p></o:p></div>
<div class="MsoNormal">
In the "Website" section wherever it says
"Site URL" enter the address of your diary e.g.
"http://jensontaylor.blogspot.com"<o:p></o:p></div>
<div class="MsoNormal">
Click "Save Changes"<o:p></o:p></div>
<div class="MsoNormal">
<b>6. when saving the
changes to your Facebook app, you'll see a confirmation message during a yellow
box at the highest of the webpage.<o:p></o:p></b></div>
<div class="MsoNormal">
Now your Facebook App is prepared. simply create a replica
of the App ID as you'll would like this range once group action the Facebook
comment application into your diary.<o:p></o:p></div>
<div class="MsoNormal">
<b>7. modification the
code below by exchange FACEBOOK-APP-ID along with your Facebook App ID range
that you traced at step five.<o:p></o:p></b></div>
<div class="MsoNormal">
head to your diary dashboard on Blogger.com; choose
"Template" then click on "Edit HTML" as highlighted within
the screenshot below:<o:p></o:p></div>
<div class="MsoNormal">
<b>9. you'll receive a
popup with a couple of choices. Click on the "Proceed" button as
shown below:<o:p></o:p></b></div>
<div class="MsoNormal">
<b>10. you'll then see
the code in your model. attempt to find the
tag as shown within the screen below:<o:p></o:p></b></div>
<div class="MsoNormal">
<b>11. slightly below
the tag paste your changed code from
step seven. Here is however my code gave the look of when this change:<o:p></o:p></b></div>
<div class="MsoNormal">
<b>12. Click "Save
Template"<o:p></o:p></b></div>
<div class="MsoNormal">
<b>13. currently you
would like to feature some a lot of code to your model (this is that the actual
code for the Facebook comment section below your diary posts). head to you
diaryger dashboard for your blog then choose "Template" &gt;
"Edit markup language" &gt; "Proceed" to look at your
HTML code (i.e. follow steps eight and 9)<o:p></o:p></b></div>
<div class="MsoNormal">
Update 21/04/2013: Since eleventh of Gregorian calendar
month 2013 step fourteen is not any longer necessary. This check-box has been
removed associated instead every appliance may be distended exploitation an
arrow to the left of it. conjointly there's a drop menu at the highest of the
editor that permits you to pick the appliance that you just wish to scroll to
in one click.<o:p></o:p></div>
<div class="MsoNormal">
<b>14. Tick the
"Expand appliance Templates" checkbox as shown below:<o:p></o:p></b></div>
<div class="MsoNormal">
<b>15. realize the code
below in your model code exploitation Ctrl-F cutoff and paste the code into the
search box. Warning: don't attempt to
kind the text below as your application program might freeze.<o:p></o:p></b></div>
<div class="MsoNormal">
If you were able to realize the tag that you just explore
for jump to step sixteen.<o:p></o:p></div>
<div class="MsoNormal">
Optional: {to modification|to vary|to alter} the dimension
of your comment box up the code higher than change width="450"to no
matter you see appropriate for your diary.<o:p></o:p></div>
<div class="MsoNormal">
Optional: {to modification|to vary|to alter} the colour
theme of your comment box you'll be able to change the word "light"
to "dark" for the attribute colorscheme='light' which provides you
the 2 coloring schemes out there for Facebook comment boxes.<o:p></o:p></div>
<div class="MsoNormal">
<b>17. You currently got
to add the Facebook Namespace declaration in your code. If you go the highest
of your code you'll see a tag as <o:p></o:p></b></div>
<div class="MsoNormal">
Here may be a screen shot of the code when the change:<o:p></o:p></div>
<div class="MsoNormal">
Note: The namespace accessorial within the code higher than
is employed for all Facebook widgets and apps. therefore you merely got to add
this into your code once, in spite of what number completely different FBML
widgets you employ.<o:p></o:p></div>
<div class="MsoNormal">
<b>18. Click "Save
Template"<o:p></o:p></b></div>
<div class="MsoNormal">
<b>19. Click
"Close"<o:p></o:p></b></div>
<div class="MsoNormal">
<b>20. Enjoy!<o:p></o:p></b></div>
<h3>
Moderating comments, Administration choices and work<o:p></o:p></h3>
<div class="MsoNormal">
If you click the "Settings" link on the higher
than page you'll be bestowed with a couple of choices that square measure self
informative like adding Moderators for your diary or permitting users with
completely different logins to go away comments(e.g. Yahoo or Hotmail logins).
Here may be a screenshot of the settings page:<o:p></o:p></div>
<h2>
Removing Blogger Comments<o:p></o:p></h2>
<div class="MsoNormal">
Although i'd not suggest to anyone that they take away
blogger's default commenting feature, if you select to try and do therefore
you'll be able to simply hide or show it from your blogs dashboard by about to<o:p></o:p></div>
<div class="MsoNormal">
1. Settings <o:p></o:p></div>
<div class="MsoNormal">
2. Posts and
comments <o:p></o:p></div>
<div class="MsoNormal">
3. Comment
Location then choose "Hide"<o:p></o:p></div>
<div class="MsoNormal">
4.make certain to click "Save Settings"<o:p></o:p></div>
<div class="MsoNormal">
If the screenshots square measure too tiny to browse, you'll
be able to click on them to enlarge them.<o:p></o:p></div>
<div class="MsoNormal">
If you run into any issues, let Pine Tree State recognize
within the Facebook comments' section ;)<o:p></o:p></div>
<div class="MsoNormal">
<b>Adding a Facebook
Comment Section For Stand Alone Pages on Blogger<o:p></o:p></b></div>
<div class="MsoNormal">
If you have got a stand alone page like
http://jensontaylor.blogspot.com/p/jenson-taylor.html then the higher than
procedure for adding facebook comments won't work because the higher than
approach solely applies for diary posts and not "pages". therefore so
as to get the facebook comment section on stand alone pages you would like to
follow the steps below additionally to the higher than steps. (Note that the
steps below got to be perennial for each single page whereas the higher than
guide that solely includes diary posts can cowl all of your diary posts. Note
2; diary posts and diary pages square measure 2 completely different things)<o:p></o:p></div>
<div class="MsoNormal">
1. head to your page then choose "Edit" as shown
within the screen shot below:<o:p></o:p></div>
<div class="MsoNormal">
2. Once you bear to the edit page, check up on the uniform
resource locator within the address bar at the highest of your browser. you'll
see associate address kind of like this:<o:p></o:p></div>
<div class="MsoNormal">
3. create a note of the last range from the uniform resource
locator address. (This are distinctive to your own page therefore do not copy
the quantity I actually have shown here.) In my example the quantity is
1979633926023450196.<o:p></o:p></div>
<div class="MsoNormal">
4. Click on the "HTML" tab as shown on the screen
shot below:<o:p></o:p></div>
<div class="MsoNormal">
5. currently you'll see the markup language code behind your
page. head to the lowest of this code and "Cope &amp; Paste" the
subsequent text:<o:p></o:p></div>
<div class="MsoNormal">
6. The higher than code is associate example used for one my
diary pages therefore you have got to alter three elements that square measure
highlighted (in red) within the higher than code to fit your own diary page.<o:p></o:p></div>
<div class="MsoNormal">
7. when you have got entered the code in your page it ought
to appear as if the below screen shot therefore simply press update and your
page ought to be prepared for facebook comments.<o:p></o:p></div>
<div class="MsoNormal">
If the screenshots square measure too tiny to browse, you'll
be able to click on them to enlarge them.<o:p></o:p></div>
<div class="MsoNormal">
If you run into any issues, let Pine Tree State recognize
within the Facebook comments' section.<o:p></o:p></div>
<div class="MsoNormal">
<br />
<h2>
Conclusion<o:p></o:p></h2>
<div class="MsoNormal">
Free Blogspot blog is a simple yet extremely effective,
functional integration of Facebook comments on blog <o:p></o:p></div>
<br />
<div class="MsoNormal">
At the same time incorporate video marketing <b><a href="https://www.youtube.com/watch?v=lKrvEts5tMA"><span style="color: blue;">Pressplay Review</span></a></b> application, it will give your blog the quality of hits, precious.<o:p></o:p></div>
</div>
<div class="MsoNormal">
<br /></div>
<br />
<div class="MsoNormal">
<br /></div>
Anonymoushttp://www.blogger.com/profile/00343566859755046681noreply@blogger.com0