יום ראשון, 28 בדצמבר 2014

Blogger - עדכון מס' 2 להוספת תיבת התגובות של פייסבוק לבלוג


תגובה מהפייסבוק לבלוג שלכם יכולה לשמש כדרך טובה 
להפוך את האתר שלכם יותר מעניין ולעודד את הקוראים 
להגיב אם הם כבר מחוברים לפייסבוק. הוא משמש גם
כמקור של תנועת חברים באמצעות העמוד של המגיב.




פייסבוק שוב שינו את ממשק יצירת האפליקציה בדף המפתחים ואנוכי מעדכנת
שוב את התקנת תיבת התגובות בבלוג.
להלן השלבים להוספת תיבת התגובות לבלוג עם הממשק החדש של פייסבוק:


1. יצירת אפליקציה חדשה

היכנסו לדף המפתחים בפייסבוק כאןלחצו על Apps אשר בתפריט ובחרו 
"Add a New App".


במידה ולא נרשמתם בעבר כמפתחים יופיע מסך רישום:

הזינו מספר טלפון סלולרי (לא לרשום את הספרה 0 הראשונה במספר),
לחצו על Send via phone call. אחרי זמן קצר תקבלו הודעת SMS
עם קוד אותו תצטרכו להזין כדי לאמת את הרישום.
במידה ואתם רשומים, המשיכו לשלב הבא.

לחצו על אייקון WWW - אתר אינטרנט.



הזינו שם לאפליקציה (2 תווים מינימום).


לחצו על Create New Facebook App ID.



בחרו בקטגוריה המתאימה מתוך הרשימה ולחצו Create App ID.



בפינה הימנית למעלה, לחצו על Skip Quick Start.



לחצו בתפריט הצידי על הגדרות (Settings).



הזינו את הפרטים:
כינוי, כתובת דוא"ל, הדביקו את כתובת הבלוג שלכם בשני המקומות הנדרשים
ולחצו Save Changes. במידה ויופיע סימן קריאה (!) באחד מהשדות, יש לתקן/
לשנות.



לאחר שסיימתם ליצור את האפליקציה, העתיקו את מספר ה- ID (מזהה יישום) המופיע 
בראש העמוד לשימוש מאוחר יותר.


2. הוספת הקוד לתבנית הבלוג

היכנסו לתפריט מרכז השליטה של הבלוג ולחצו על "תבנית".


בצעו גיבוי לתבנית הקיימת, אליה תוכלו לחזור במידה ותהיה בעיה כלשהי.
לחצו על "ערוך HTML".


במערכת בלוגר הישנה הייתה אפשרות ללחוץ על "הרחב תבניות יישומון" -
פעולה אותה חייבים לבצע על מנת להטמיע את הקוד במקום הנכון.
אפשרות זו אינה קיימת במערכת בלוגר החדשה ולכן יהיה עליכם לעשות
זאת בעצמכם (לא מצאתי דרך אחרת).
בעמודה השמאלית מופיעים מספרים עוקבים. אם תגללו את הדף כלפי מטה
יופיעו במקומות מסוימים חיצים (בצבע שחור). לחצו על כל חץ (עד סוף
התבנית) על מנת לפתוח את השורות המסתתרות.


אתרו בתבנית את השורה הבאה:

<head>  
          
(לאיתור מהיר, הקישו קונטרול F כאשר הסמן בתוך התבנית, ובשורת החיפוש
שתופיע, הדביקו את התווים. לחצו אנטר והשורה תופיע מובלטת בצבע צהוב).

העתיקו את הקוד הבא והדביקו שורה אחת מתחת.

------------------------------------------------------------------------------------------------------
<meta content='YOUR_FACEBOOK_APPLICATION_ID' property='fb:app_id'/>
------------------------------------------------------------------------------------------------------

החליפו את הרשום בצבע צהוב עם מספר ה- ID של האפליקציה שיצרתם.



אתרו את השורה:

<data:post.body/>

שורה זו עלולה להופיע מספר פעמים (3 פעמים ברוב המקרים בהם נתקלתי).
בשורה אחת מתחת לכל אחד מהם הדביקו את הקוד הבא:
------------------------------------------------------------------------------------------------------

<b:if cond='data:blog.pageType == "item"'> <div id="fb-root"></div> <script>
(function(d){ var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;} js = d.createElement('script'); js.id = id; js.async = true; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; d.getElementsByTagName('head')[0].appendChild(js); }(document));</script> <fb:comments width='450' colorscheme='light' expr:title='data:post.title' expr:href='data:post.canonicalUrl' expr:xid='data:post.id'/>
</b:if>
---------------------------------------------------------------------------------------------------

אם שורה זו אינה קיימת בתבנית, נסו את אחד מהבאים: 

<div class='post-footer-line post-footer-line-1'>

או את השורה:


<div class='post-footer-line post-footer-line-3'>

או את השורה:


<p class='post-footer-line post-footer-line-3'>



- ניתן להתאים את רוחב התיבה מ- '450' עד '600'.
- לתיבת תגובות בעברית יש לשנות en ל- he ו- US ל- IL.
חשוב: אם כבר התקנתם בבלוג פלאגין כלשהו של פייסבוק (כמו Like ואחרים)
          בשפה האנגלית, יש לשנות גם אותם לשפה העברית או להישאר עם הכל
          באנגלית.


אתרו בתבנית את השורה הבאה:

    <html

הדביקו את הקוד הבא מיד אחרי (שימו לב שיהיה רווח לפני הקוד ואחריו).
במידה וקוד זה כבר מופיע אצלכם בתבנית, אין צורך להדביקו שוב.
------------------------------------------------------------------------------------------------------

 xmlns:fb="https://www.facebook.com/2008/fbml"
------------------------------------------------------------------------------------------------------


לחצו "שמור תבנית" ויש לכם תיבת תגובות של פייסבוק.

3. הגדרת תיבת התגובות
על מנת להגדיר את קבלת התגובות בתיבה היכנסו לכאן (ניתן לעשות זאת
גם מתוך הגדרות התיבה עצמה).

בדף שיפתח, לחצו על הגדרות והוסיפו את עצמכם כמנחה.



במידה ואתם רוצים לאשר תגובות לפני פרסום, סמנו כפי שמופיע 
בתמונה (למטה).
הערה: לעיתים תקבלו התראה, אך המערכת הזו אינה יציבה לגמרי.
ניתן לעקוב אחרי התגובות כאן.



מדריך זה נבדק בשתי תבניות שונות ובשתיהן נוצרה תיבת תגובות תקינה.

בהצלחה!



9 תגובות:

  1. תודה רבה! נעזרתי במדריך שלך והצלחתי להוסיף תיבת תגובות של פייסבוק!!!!

    השבמחק
  2. היי, עקבתי אחרי ההוראות במדויק והתיבה אכן נוספה לי אבל כשאני מנסה לפרסם תגובה בתיבת הפייסבוק זה נותן לי הודעה שמשהו השתבש.. ולא מפרסם
    מה יכולה להיות הבעיה?

    השבמחק
    תשובות
    1. היי נועם. נכנסתי לבלוג והשארתי הודעה וזה נראה בסדר גמור!

      מחק
  3. היי,
    רוב תודות על ההדרכה הנפלאה הזאת שהצלחתי להציב באמצעותה את תיבת התגובות בבלוג שלי!
    כשמשאירים לי תגובה בפורמט פייסבוקי, זה בעצם לא מודיע לי (לא במייל ולא בפיסבוק). יש אפשרות לשנות את זה באיזו הגדרה? תודה רבה!

    השבמחק
    תשובות
    1. לצערי לא. לפעמים תקבלי התראה ולפעמים לא. הדרך היחידה היא לעקוב מפעם לפעם בדף ההתראות, כפי שציינתי בפוסט (יש קישור). תודה על הפידבק...

      מחק
  4. תודה רבה! עזרת לי מאוד :)

    השבמחק
    תשובות
    1. נהדר יוליה! תודה על הפידבק...

      מחק
  5. תודה רבה,
    הדרכה מעולה! אם אני הצלחתי לפעול לפיה - כל אחד יכול :)

    השבמחק