תגובות בעמוד ראשי, #2

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

הפיתרון השני, הוא להציג את התגובות בתוך העמוד עצמו, זאת אפשר לעשות בעזרת שימוש ב Div נסתר. עבור כל אובייקט ניתן להגדיר את המאפיין העיצובי: Display:none. המאפיין הזה אומר שאין להציג את האובייקט הרלוונטי. בצורה שכזו, ניתן לשלב תוכן בתוך הדף מבלי שהוא יוצג למשתמש (התוכן כן נטען, אבל לא מוצג). על מנת להציג את התוכן, נזדקק לג'אווה סקריפט שמשנה את מאפיין ה Display. וסוג של "מתג" שידליק ויכבה את האובייקט.

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

 

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

< ?php $withcomments = true; comments_template();?>

היות ומדובר בעמוד הראשי שבו לא אמורות להופיע תגובות, חובה להגדיר את המשתנה הבוליאני withcomments ומבלעדיו התגובות לא יוצגו בעמוד הראשי.

עטיפה
על מנת להפעיל אובייקט נעטוף אותו בצורה הבאה:

 

והטריגר יוטמע בצורה הבאה:

הצג תגובות

השילוב הזה אמור להציג בעמוד כיתוב "הצג תגובות" שבאירוע לחיצה יציג / יסתיר את התגובות.
איך זה עובד?
האירוע onClick אומר לדפדפן מה לעשות באירוע לחיצה. הקריאה href עם שם האובייקט אומרת למעשה לעמוד לקפוץ אל האזור שבו מוצג האובייקט. את האובייקט והטריגר ניתן להעמיד בכל מקום בדף והם יוצגו בהתאם למיקום בו הם הועמדו, הם לא חייבים להיות צמודים.

הפונקציה שאמורה להציג את התגובות משתמשת ב getElementById על מנת לקבל ולקבע את המאפיינים של האובייקט.
עבור כל Div בעמוד ניתן להגדיר מזהה בצורה הבאה:

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

 

ועל מנת לשלב בטריגר ובמעטפת:

 
הצג תגובות 

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

ולסיום

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

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

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

לדרג את הפוסט
0

Comments

6 תגובות על “תגובות בעמוד ראשי, #2”

  1. לא עדיף לשמור את הקוד ג'אווה בתור קובץ JS ולגשת אליו?

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

  3. […] פופאפ. (הפוסט הנוכחי) 2. תגובות ב Div נסתר בעזרת JavaScrip – קישור 3. תגובות ב lightbox – שידרוג של שלב 2 בעזרת תוסף. 4. Ajax? שילוב […]

  4. הבנתי.
    אז אני שומר בתור קובץ JS, אבל איך ניגש אליו?

    הצג תגובות

    ? 🙂

  5. < script src="url/script.js" type="text/javascript">

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

    דרך אגב, המספור בקטעי הקוד מקשה מאוד על ההעתקה שלו.

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *