לצ'אטים ב-WhatsApp
ראו את הכותרת, התיאור והתמונה הממוזערת ש-WhatsApp מציג כשמדביקים קישור בצ'אט.
בלי כרטיס אשראי · תוכנית Free בלי הגבלת זמן
WhatsApp קורא את תגי Open Graph הסטנדרטיים, og:title, og:description ו-og:image, מתוך ה-head של ה-HTML בדף. אין סט תגים מיוחד ל-WhatsApp, ולכן דף שמוצג יפה במקומות אחרים מוצג בדרך כלל יפה גם ב-WhatsApp.
התצוגה המקדימה נוצרת בטלפון של השולח ברגע שהוא מדביק את ה-URL, לפני שההודעה נשלחת, ואז היא מצורפת להודעה. הנמענים רואים את מה שהמכשיר של השולח טען. אם השולח הדביק את הקישור כשהתגים עוד היו שגויים, את הכרטיס הישן הזה תראה כל הקבוצה.
המלכודת העיקרית שייחודית ל-WhatsApp היא הטיפול בתמונות. ברוב הקישורים WhatsApp מציג תמונה ממוזערת ריבועית וקטנה שנחתכת ממרכז og:image, ולכן תמונה שהנושא או הטקסט שלה נמצאים בשוליים מאבדת אותם. תמונות קטנות מאוד לא מוצגות בכלל: רוחב og:image צריך להיות לפחות כ-300 פיקסלים. קובץ קטן (הרבה פחות ממגה-בייט) מונע מצב שבו התמונה נעלמת מהתצוגה המקדימה בלי הודעה בחיבורים איטיים.
WhatsApp טוען דפים עם user agent משלו (הוא מזדהה כ-WhatsApp). כללי הגנה מפני בוטים או חומות אש של CDN שחוסמים user agents לא מוכרים מחזירים לו דף שגיאה, והתצוגה המקדימה מגיעה בלי תמונה או בלי כלום. בדקו שה-URL מחזיר 200 ללקוחות שאינם דפדפנים.
אין ל-WhatsApp כלי ציבורי לניפוי באגים, והתצוגות המקדימות נשמרות במטמון בכל מכשיר. כדי לטעון את הדף מחדש אחרי תיקון התגים, הוסיפו פרמטר שאילתה זמני (למשל ?v=2) כך שה-URL ייחשב חדש, או הדביקו את הקישור שוב אחרי שהתיקון התעדכן.
אם הכרטיס נראה לא נכון, הסיבה היא בדרך כלל התגים של הדף או הפניה שעומדת לפניו. תיקון תצוגות מקדימות של Open Graph עובר על התגים שכל פלטפורמה קוראת, בודק ההפניות מראה אם סורק עובר דרך כמה קפיצות לפני שהוא מגיע לדף שלכם, וציון האמינות לקישור מראה אם היעד עצמו מסומן כחשוד. למונחים (og:image, canonical, unfurl) ראו את המילון. לגרסה הלא-טכנית, בודק התצוגה המקדימה של קישורים מציג את הכרטיס הסופי בשמונה פלטפורמות בבת אחת.
בדקו את הכרטיס פעם אחת לפני שקישור יוצא לקהילת WhatsApp. ההדבקה הראשונה של השולח היא מה שכולם רואים.
ודאו שמרכז og:image נשאר גלוי בתמונה הממוזערת הריבועית הקטנה ש-WhatsApp מציג ברוב הקישורים.
אתרו תגי og:image עם תמונה קטנה מדי, כבדה מדי או מאוחסנת בשרת שחוסם את ה-user agent של WhatsApp.
דאגו שכתובות של מרכז העזרה ושל מעקב הזמנות יוצגו בכרטיס אמין בצ'אטים אישיים.
גרסאות מוגדרות מראש, מותאמות לפלטפורמות ולתרחישי שימוש מסוימים.
לשיתופים ב-LinkedIn
ראו איך הכתובת שלכם תיראה כשישתפו אותה ב-LinkedIn, לפני שאתם מפרסמים.
פתיחת הגרסהלתצוגות מקדימות ב-Slack
בדקו איך הקישור שלכם מוצג בהודעות ובערוצים של Slack.
פתיחת הגרסהלכרטיסי X ו-Twitter
ראו איך הקישור שלכם מוצג ככרטיס Twitter ב-X.
פתיחת הגרסהלשיתופים ב-Facebook
בדקו איך הכתובת שלכם תוצג בפוסט או בשיתוף ב-Facebook.
פתיחת הגרסהלהטמעות ב-Discord
ראו איך Discord מטמיע את הכתובת שלכם בערוץ או בהודעה פרטית.
פתיחת הגרסהלהודעות ב-Telegram
ראו איך Telegram מציג את הקישור שלכם בצ'אטים, בקבוצות ובערוצים.
פתיחת הגרסהלקישורים עשירים ב-iMessage
ראו את כרטיס הקישור העשיר ש-Apple Messages בונה מ-og:title ומ-og:image.
פתיחת הגרסה