תצוגה מקדימה לשיתוף חברתי

תצוגה מקדימה ל-Open Graph

תצוגה מקדימה לרשתות חברתיות מציגה לכם איך הקישור שלכם ייראה כשמישהו ישתף אותו בפייסבוק, ב-LinkedIn, ב-WhatsApp או ב-X (טוויטר). הכלי שולף את תגי ה-Open Graph (og:title, og:description, og:image) ואת ה-Twitter Card מתוך ה-HTML של העמוד, ומרנדר את הכרטיס בדיוק איך שכל פלטפורמה תציג אותו. שיתוף קישור עם תמונה והגדרות נכונות מקבל ב-3 עד 5 פעמים יותר קליקים מקישור עם תצוגה גנרית.

מתי להשתמש?

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

איך לקרוא את הכרטיס

הכלי מחזיר חמישה שדות: og:title, og:description, og:image, og:type ו-og:url. ה-image הוא הקריטי ביותר: גודל מומלץ 1200×630 פיקסלים, פורמט JPG או PNG, פחות מ-5MB. אם הטקסט בכרטיס נחתך — זה אומר ש-og:title שלכם ארוך מדי (אופטימלי 60–70 תווים), או ש-og:description ארוך מדי (אופטימלי 150–170 תווים). פלטפורמות שונות חותכות במקומות שונים, אבל הכלל הזה נכון לרובן.

בעיות נפוצות

מה שאנחנו רואים שוב ושוב: היעדר og:image לחלוטין (פייסבוק שולף תמונה רנדומלית); תמונה שגרסת המובייל שלה אחרת מהדסקטופ; og:title שזהה לכותרת ה-SEO ולא מותאם להקשר חברתי; og:description שמשכפל את ה-Meta Description במקום להיות מנוסח בנימה שיווקית; ושימוש ב-Twitter Card מסוג "summary" כשהיה צריך "summary_large_image". הכלי מסמן את כל אלה.

אחרי שזיהיתם בעיה

תקנו את התגיות ב-HTML או דרך תוסף ה-SEO שלכם, ואז חזרו לכלי כדי לראות שהתיקון תפס. בפייסבוק, השתמשו ב-Sharing Debugger הרשמי כדי לרענן את המטמון. ב-Rank+ המערכת מייצרת og:image אוטומטי לכל פוסט (מהתמונה הראשית או מ-fallback מותאם), ומסנכרנת את כל תגיות ה-Open Graph עם ה-Meta של ה-SEO — כך שגם בשיתוף וגם בחיפוש הקישור נראה מקצועי.

מקרים נפוצים שראינו

דוגמה 1 — אתר תדמית שכל שיתוף שלו בפייסבוק הציג אייקון אדום של "Rank+" קטן במקום תמונה. הסיבה: og:image הוגדר כ-favicon (32×32 פיקסלים). תיקון לתמונה 1200×630 הפך את הכרטיס למקצועי. דוגמה 2 — אתר שלאחר שיתוף ב-WhatsApp הציג טקסט בעברית הפוך. זה היה בגלל ש-og:title הוגדר אבל ללא lang="he" וב-charset שגוי בכותרת ה-HTTP. דוגמה 3 — בלוג שכל המאמרים הציגו את אותה תמונה ב-LinkedIn למרות שכל מאמר היה לו תמונה ראשית. התוסף שלהם הזריק og:image סטטי על כל הדפים בנוסף לדינמי, ופלטפורמת LinkedIn לקחה את הראשון. הסרת ה-fallback הסטטי פתרה.