פרסומת

ajax WordPress הערות - -כברירת מחדל, מערכת התגובות של וורדפרס אינה מספקת לצערנו - אחת ההתנגדויות הגדולות ביותר שלי היא שכדי לפרסם תגובה, הדף צריך לרענן. אתה יכול לעבור למערכת של צד שלישי כמו Livefyre [URL שבור הוסר] או דיקוס 3 דרכים לעידוד הערות בבלוג הוורדפרס שלךקבלת הערות בבלוג שלך היא מניעה נהדרת להמשיך ולהמשיך בתהליך הארוך שעוסק בבלוגים. רק לדעת שמישהו שם בחוץ, להעריך את העבודה שלך מרגיש מצוין, אבל לא ... קרא עוד , אבל אם אתה מעדיף לשמור את הכל בבית או לבצע התאמה אישית כלשהי, הרי שפרסום תגובות מאת AJAX הוא המעט שאתה צריך לעשות.

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

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

instagram viewer

מבוא

ישנם שני חלקים נפרדים הדרושים בכדי לגרום לתגובות AJAX WordPress לעבוד, אז בואו להסביר את אלה ראשונים כדי לתת לכם סקירה כללית של התהליך.

  • כמה Javascript בדף שמיירט את המשתמש בלחיצה על הוסף תגובה כפתור הגשה, שהופך אותו גם לשיחת AJAX וגם מטפל בתגובה.
  • מטפל PHP שמתחבר לפעולה comment_post

Javascript

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

פונקציה google_jquery () { if (! is_admin ()) {wp_deregister_script ('jquery'); wp_register_script ('jquery', (" http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"), שקר); wp_enqueue_script ('jquery'); }} add_action ('wp_print_scripts', 'google_jquery');

שים לב, זוהי דרך מורחבת לטעון jQuery מכיוון שאנו משתמשים בגירסה העדכנית ביותר מ- Google CDNs, המהירה ומהירה יותר עד תאריך יותר מזה שנכלל כברירת מחדל עם וורדפרס - לכן כדאי מאוד להוסיף את זה בכל מקרה גם אם jQuery כבר נטען במקום אחר.

כעת, עבור ה- Javascript בפועל שיטפל בטופס ההערה, יש לנו כמה אפשרויות. הקלה ביותר היא פשוט להדביק את הקוד שלך single.php תבנית - בהנחה שלא הפעלת תגובה גם לדפים.

לחלופין, תוכל להדביק בתוך קיים .js הקובץ המשמש את העיצוב שלך, או צור קובץ חדש .js קובץ בספריית העיצוב שלך. אם בחרת להכניס אותו לקובץ .js נפרד משלך ולא להדביק אותו ישירות בתבנית העיצוב שלך, הקפד להוסיף את השורות הבאות לקובץ שלך. פונקציות, ושימו לב כי שם הקובץ הוא ההנחה ajaxcomments.js בשורש תיקיית העיצוב שלך.

add_action ('init', 'ajaxcomments_load_js', 10); פונקציה ajaxcomments_load_js () {wp_enqueue_script ('ajaxcomments', get_styleheet_directory_uri (). '/ ajaxcomments.js'); }

להלן Javascript לטיפול בטופס ההערה (או שאתה יכול צפה בו על גבי פסטה):

 // מערכת התגובות של AJAX. jQuery ('מסמך'). מוכן (פונקציה ($) { var commentform = $ ('# commentform'); // מצא את טופס התגובה. commentform.prepend ('
 
'); // הוסף לוח מידע לפני הטופס כדי לספק משוב או שגיאות. var statusdiv = $ ('מצב הערה #'); // הגדר את צורת התגובה של האינפופאנל. שלח (פונקציה () { // לערוך סדרות ולאחסן נתוני טופס במשתנה. var formdata = commentform.serialize (); // הוסף הודעת סטטוס. statusdiv.html ('
 מעבד... 
'); // חלץ URL של פעולה מצורת התגובה. var formurl = commentform.attr ('פעולה'); // טופס הודעה עם נתונים. $ .ajax ({ סוג: 'פוסט', url: formurl, נתונים: פורמט נתונים, שגיאה: פונקציה (XMLHttpRequest, textStatus, errorThrown) { statusdiv.html ('
 יתכן שהשארת את אחד השדות ריק, או שאתה מפרסם מהר מדי  p>'); }, הצלחה: פונקציה (נתונים, textStatus) { אם (נתונים == "הצלחה") statusdiv.html ('
 תודה על התגובה שלך. אנו מעריכים את תגובתך.  P> '); אחר. statusdiv.html ('
 אנא המתן זמן לפני שתפרסם את התגובה הבאה שלך  p>'); commentform.find ('textarea [name = תגובה]'). val (''); } }); להחזיר שקר; }); });

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

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

מטפל PHP

לבסוף, אנו זקוקים למשהו כדי למנוע רענון העמוד ולשלוח את התגובה המתאימה חזרה למשתמש כמו גם הודעה למנהל אם התגובה צריכה להיות מתונה, או להודיע ​​למחבר על תגובה חדשה. לשם כך, אנו מתחברים אל תגובה_דואר פעולה שמתרחשת ממש לאחר שהוספה למאגר, ולגלות אם הייתה זו בקשת AJAX. הוסף את זה שלך פונקציות קובץ:

(זמין גם בבית אוסף זה)

add_action ('comment_post', 'ajaxify_comments', 20, 2); פונקציות ajaxify_comments ($ comment_ID, $ comment_status) { אם (! ריק ($ _ SERVER ['HTTP_X_REQUESTED_WITH']) & strtolower ($ _ SERVER ['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') { // אם בקשת AJAX אז. switch ($ comment_status) { מקרה '0': // הודיע ​​למנחה על התגובה שלא אושרה. wp_notify_moderator ($ comment_ID); מקרה '1': // תגובה מאושרת. הד "הצלחה"; $ commentdata = & get_comment ($ comment_ID, ARRAY_A); $ post = & get_post ($ commentdata ['comment_post_ID']); wp_notify_postauthor ($ comment_ID, $ commentdata ['comment_type']); לשבור; ברירת מחדל: הד "שגיאה"; } יציאה; } }

בעיות ספוט

אם הדף עדיין מרענן במקום לפרסם דרך AJAX, סביר להניח שזו אחת משתי בעיות. אחת - יתכן שלא נטען jQuery. להתקין באג האש כיצד להתקין באג Firew ב- IE, Safari, Chrome ואופרה קרא עוד , או אפשר כלי מפתח של Chrome ובדוק שגיאות ביומן המסוף. אם jQuery לא נמצא, חזור לקטע JavaScript וקרא את הקטע הראשון בנושא הוספת jQuery לנושא שלך. האפשרות השנייה היא שהנושא שלך עושה משהו מיוחד לטופס התגובה וזה הזיהוי שלו כבר לא "טופס תגובה". בדוק את קוד המקור, ואז התאם את var commentform = $ ('# commentform') בשורת ה- JavaScript להיות המזהה הנכון - זה עשוי לעבוד.

כתמיד, אני בסביבה לעזור ככל האפשר, אך אנא פרסם קישורים לכתובת אתר לדוגמה שבה אוכל להציץ במהירות.

ג'יימס הוא בעל תואר ראשון בבינה מלאכותית, והוא מוסמך CompTIA A + ו- Network +. הוא המפתח הראשי של MakeUseOf, ומבלה את זמנו הפנוי במשחקי פיינטבול VR ומשחקי לוח. הוא בנה מחשבים אישיים מאז שהיה ילד.