Internet
Now Reading
Πώς να προσθέσετε σχόλια facebook στον Blogger σας σε 20 λεπτά
7

Πώς να προσθέσετε σχόλια facebook στον Blogger σας σε 20 λεπτά

by Chris Karidis23 February, 2012

Το 2009 οι προγραμματιστές του Facebook δημιούργησαν ένα από τα πιο χρήσιμα plugin τους, το “Facebook Comments Box”. Το plugin αυτό μπορεί να προστεθεί σε οποιαδήποτε ιστοσελίδα, και οι επισκέπτες της μπορούν να  σχολιάζουν χρησιμοποιώντας την ταυτότητα του facebook τους. Ο παρακάτω οδηγός θα σας βοηθήσει να προσθέσετε αυτή την επιλογή στο blog σας. Να σημειώσουμε εδώ, ότι δεν θα αντικατασταθεί ο προκαθορισμένος τρόπος για σχόλια του blogger σας, απλά θα προστεθεί και η δυνατότητα στους χρήστες να σχολιάζουν μέσω του Facebook Comments Box.

Δημιουργία  Facebook Application ID Πηγαίνετε στην σελίδα Facebook Developers Page για να δημιουργήσετε μια εφαρμογή στο Facebook

Στο πεδίο “App Name” δώστε το ίδιο όνομα με το όνομα του Blog σας. Το πεδίο “App Namespace” μπορείτε να το αφήσετε κενό. Τσεκάρετε το “I agree to the Facebook Platform Policies”. και πατήστε “Συνέχεια” (Κατά πάσα πιθανότητα θα σας ζητηθεί έλεγχος ασφαλείας (captcha) ) Αμέσως μετά την δημιουργία της εφαρμογής, θα σας εμφανίσει το facebook τις βασικές ρυθμίσεις της εφαρμογής σας. Σημειώστε, ή αντιγράψτε κάπου το “App ID” (κάτι παρόμοιο με αυτό “194626337303603”) Στην καρτέλα “βασικές πληροφορίες” υπάρχει το πεδίο “App Domain“. Εκεί στην περίπτωση μας, πληκτρολογείτε “blogger.com”, ή αν δεν το δεχτεί “blogspot.com” (χωρίς τα εισαγωγικά). Στο κάτω μέρος της σελίδας υπάρχει μια καρτέλα με όνομα “Select how your app integrates with Facebook” Κάντε κλικ στο “Website“, και κάντε επικόλληση  ακριβώς την διεύθυνση του blog σας (πχ. http://tricks-and-tips-for-you.blogspot.com/ ) Πατήστε το κουμπί “Αποθήκευση αλλαγών”, και είστε έτοιμοι να περάσετε στο επόμενο στάδιο. 2. Προσθήκη του Facebook comments Box στον Blogger σας

Πριν ξεκινήσουμε, τα σχόλια στο blog σας πρέπει είναι “ενσωματωμένα”. Αν δεν είστε σύγουροι για αυτό, μεταβείτε στις Ρυθμίσεις › Αναρτήσεις και σχόλια, και στην “Τοποθεσία σχολίου” επιλέξτε “Ενσωματωμένο”. Κάντε αποθήκευση αλλαγών. 

Στις ρυθμίσεις του blogger σας επιλέξτε “πρότυπο” και στην συνέχεια “επεξεργασία HTML“. Συνιστάτε να κρατήσετε ένα αντίγραφο ασφαλείας πριν τροποποιήσετε οτιδήποτε, διότι κάποια λανθασμένη αλλαγή μπορεί να προκαλέσει σημαντικά προβλήματα στην λειτουργία η στην εμφάνιση του blog σας. Κάντε αναζήτηση για <html και αμέσως μετά από αυτό, αφήστε ένα κενό και προσθέστε τον παρακάτω κώδικα

xmlns:fb='http://www.facebook.com/2008/fbml'

 Στην συνέχεια κάντε αναζήτηση για:  <Body>  Σημείωση: Στα νέα πρότυπα σχεδίασης (templates) του Blogger, ο ίδιος κώδικας μπορεί να είναι γραμμένος έτσι: <body expr:class=’&quot;loading&quot; + data:blog.mobileClass’>

 
Βρείτε οποιοδήποτε από τα 2, και αμέσως μετά από αυτό, επικολλήστε τον παρακάτω κώδικα:
 
<div id=’fb-root’/>  <script>      window.fbAsyncInit = function() {      FB.init({        appId  : &#39;YOUR_APP_ID&#39;,        status : true, // check login status          cookie : true, // enable cookies to allow the server to access the   session        xfbml  : true  // parse XFBML      });    };     (function() {      var e = document.createElement(&#39;script&#39;);        e.src = document.location.protocol +   &#39;//connect.facebook.net/en_US/all.js&#39;;      e.async = true;        document.getElementById(&#39;fb-root&#39;).appendChild(e);      }());  </script>
 
  • Αντικαταστήστε το YOUR_APP_ID με το Facebook Application ID που σημειώσατε στα προηγούμενα βήματα
Κάντε αναζήτηση για </head> και αμέσως πριν από αυτό, επικολλήστε τον παρακάτω κώδικα.
<meta expr:content=’data:blog.pageTitle’ property=’og:title’/>  <meta expr:content=’data:blog.url’ property=’og:url’/>  <meta content=’Tricks and Tips‘ property=’og:site_name’/>  <meta content=’BLOG-LOGO-IMAGE-LINK‘ property=’og:image’/>  <meta content=’YOUR_APP_ID ‘ property=’fb:app_id’/>  <meta content=’http://www.facebook.com/your_page‘ property=’fb:admins’/>  <meta content=’article’ property=’og:type’/>
 
  • Αντικαταστήστε το Tricks and Tips με το όνομα του δικού σας blog
  • Αντικαταστήστε το BLOG-LOGO-IMAGE-LINK με την εικόνα του λογότυπου του blog σας. Για καλύτερη εμφάνιση συνιστάτε η εικόνα αυτή να είναι gif, και με διαστάσεις 40×40. Η εικόνα αυτή θα φένεται στην ανάρτηση του facebook, όταν κάποιος σχολιάζει στο blog σας.
  • Αντικαταστήστε το YOUR_APP_ID με το Facebook Application ID της εφαρμογής που δημιουργήσατε
  • Αντικαταστήστε το http://www.facebook.com/your_page με την διεύθυνση του profile σας στο facebook, ή της σελίδας σας στο facebook.
Κάντε αναζήτηση για <b:includable id=’comment-form’ var=’post’> και αμέσως μετά κάντε επικόλληση τον παρακάτω κώδικα.
 
<b:if cond=’data:blog.pageType == &quot;item&quot;’>  <div style=’padding:0px 0px 0px 0px; margin:0px 0px 0px 0px;’><script src=’http://connect.facebook.net/en_US/all.js#xfbml=1’/>  <div> <fb:comments  colorscheme=’light expr:href=’data:post.url’ expr:title=’data:post.title’ expr:xid=’data:post.id’ width=’520′/></div></div>  </b:if>
 
  • Αν προτιμάτε το σκοτεινό θέμα του facebook, αλλάξτε το light σε dark
  • Για να αλλάξετε το πλάτος του comments box, αλλάξτε την τιμή  width=’520′
 
Αποθηκεύστε τις αλλαγές, και είστε έτοιμοι! το Facebook Comments Box υπάρχει πλέον σε κάθε ανάρτηση στον Blogger σας, και περιμένει τα σχόλια των θαυμαστών σας!
 
Για οποιαδήποτε επιπλέον πληροφορία η ερώτηση γράψτε σχόλιο.
 
Σημείωση: Αν μετά από την εισαγωγή του Facebook comments Box θελήσετε να αλλάξετε το γραφικό θέμα του Blogger σας, οι ρυθμίσεις αυτές θα χαθούν και θα πρέπει να επαναλάβετε από την αρχή την διαδικασία
 
 
 

Comments

comments

About The Author
Chris Karidis
Ονομάζομαι Χρήστος, και ασχολούμαι με την πληροφορική για πάνω από 10 χρόνια. Το TricksforGreeks.com το δημιούργησα για να βοηθήσω όσους αρχάριους χρήστες έχουν ανάγκη, σε θέματα σχετικά με την πληροφορική και την τεχνολογία. Μπορείτε να επικοινωνήσετε μαζί μου μέσω του live chat της σελίδας ή των κοινωνικών δικτύων που υπάρχουν στο επάνω μέρος αυτού του παραθύρου.