יחידות מודעות
כיצד להתאים אישית יחידה רספונסיבית עם תוכן מותאם
אם יש לכם דרישות ספציפיות ליחידות רספונסיביות המכילות תוכן מותאם, אפשר להוסיף פרמטרים לקוד המודעה כדי להתאים אישית את המראה שלהן. בעזרת הפרמטרים האלה אפשר, למשל, לשנות את הפריסה של יחידות התוכן המותאם או לקבוע את ארגון השורות והעמודות של ההמלצות שהן מכילות.
אתם יכולים להשתמש בפרמטרים גם כדי לקבוע הגדרות נפרדות לניידים ולמחשבים. לדוגמה, אם בחרת להקצות לפרמטר הפריסה ערך יחיד, הפריסה של יחידת התוכן המותאם תהיה זהה בנייד ובמחשב שולחני. אבל אם תקצו לפרמטר הפריסה שני ערכים, הפריסה של יחידת התוכן המותאם בניידים (הערך הראשון) תהיה שונה מהפריסה במחשבים (הערך השני). הפרמטרים האלה עובדים גם ב-יחידות תוכן מותאם ל-AMP.
הערה: האפשרויות האלה זמינות רק ליחידות רספונסיביות המכילות תוכן מותאם, וצריך להשתמש בכל הפרמטרים כדי שההתאמה האישית תפעל. אחרי שמשנים את קוד המודעה, צריך לבדוק את יחידות התוכן המותאם במכשירים ובמסכים שונים כדי לוודא שהכול תקין.
שינוי הפריה של יחידת התוכן המותאם
פרמטר הפריסה (data-matched-content-ui-type) מאפשר לקבוע את הסדר של הטקסט והתמונות ביחידות עם תוכן מותאם. לדוגמה, אפשר לקבוע שתמונה וטקסט יופיעו זו לצד זה, זו מעל זה וכן הלאה.
אלו הן אפשרויות הפריסה הזמינות:
תמונה וטקסט, זו לצד זה
בפריסה זו, התמונה והטקסט מופיעים זו לצד זה. כדי לבחור בפריסה הזאת, מוסיפים את הפרמטר data-matched-content-ui-type="image_sidebyside" לקוד המודעה.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-ui-type="image_sidebyside"
data-matched-content-rows-num="4"
data-matched-content-columns-num="1"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
תמונה וטקסט זו לצד זה, עם כרטיס
בפריסה זו, התמונה והטקסט מופיעים זו לצד זה בתוך כרטיס. כדי להשתמש בפריסה הזאת, מוסיפים את הפרמטר data-matched-content-ui-type="image_card_sidebyside" לקוד המודעה.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-ui-type="image_card_sidebyside"
data-matched-content-rows-num="4"
data-matched-content-columns-num="1"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
תמונה מוערמת מעל לטקסט
בפריסה זו, התמונה והטקסט מסודרים זו על גבי זה. כדי לבחור בפריסה הזאת, מוסיפים את הפרמטר data-matched-content-ui-type="image_stacked" לקוד המודעה.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-ui-type="image_stacked"
data-matched-content-rows-num="3"
data-matched-content-columns-num="1"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
תמונה מוערמת מעל טקסט, עם כרטיס
בפריסה זו, התמונה והטקסט מסודרים זו על גבי זה, בתוך כרטיס. כדי להשתמש בפריסה הזאת, מוסיפים את הפרמטר data-matched-content-ui-type="image_card_stacked" לקוד המודעה.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-ui-type="image_card_stacked"
data-matched-content-rows-num="3"
data-matched-content-columns-num="1"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
טקסט בלבד
פריסה של טקסט בלבד, בלי תמונות. כדי להשתמש בפריסה הזאת מוסיפים את הפרמטר data-matched-content-ui-type="text" לקוד המודעה.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-ui-type="text"
data-matched-content-rows-num="4"
data-matched-content-columns-num="1"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
טקסט עם כרטיס
פריסה של טקסט בלבד, עם כרטיס. כדי להשתמש בפריסה הזאת, מוסיפים את הפרמטר data-matched-content-ui-type="text_card" לקוד המודעה.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-ui-type="text_card"
data-matched-content-rows-num="4"
data-matched-content-columns-num="1"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
ציון מספר השורות והעמודות ביחידה עם התוכן המותאם
ההמלצות שמוצגות בתוך היחידה עם התוכן המותאם מאורגנות ברשת. אפשר לציין את מספר השורות והעמודות שיופיעו ברשת. לדוגמה, אפשר להגדיר שיחידת התוכן המותאם תהיה ריבוע בגודל של 2x2, או עמודה בגודל של 4x1 וכן הלאה.
ההגדרה של מספר השורות מתבצעת באמצעות הפרמטר data-matched-content-rows-num וההגדרה של מספר העמודות מתבצעת באמצעות הפרמטר data-matched-content-columns-num. יש להגדיר את שני הפרמטרים ואת data-matched-content-ui-type יחד.
- יש מגבלות למספר השורות והעמודות שניתן להגדיר. בכל יחידה עם תוכן מותאם ניתן להציג בין 1 ל-30 המלצות לכל היותר. אם לא מציגים המלצות, או אם מציגים יותר מ-30 המלצות, היחידה עם התוכן המותאם תופיע כשהיא ריקה.
- לפעמים ייתכן שלא נוכל להציג את המספר המדויק שציינת לשורות או לעמודות. לדוגמה, אם הגדרת מספר גדול של עמודות אבל היחידה עם התוכן המותאם לא רחבה מספיק כדי להכיל את כולן. במקרה כזה, כדי לספק חוויית משתמש טובה, נתאים את מספר העמודות או השמורות כך שההמלצות יתאימו לשטח הזמין.
דוגמאות לשורות ולעמודות
4x1 (נייד ומחשב שולחני)
דוגמת הקוד הבאה ממחישה איך יוצרים יחידת תוכן מותאם עם ארבע שורות ועמודה אחת כדי להציג ארבע המלצות בסה"כ.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-rows-num="4"
data-matched-content-columns-num="1"
data-matched-content-ui-type="image_stacked"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
2x2 (נייד ומחשב שולחני)
דוגמת הקוד הבאה ממחישה איך יוצרים יחידת תוכן מותאם עם שתי שורות ושתי עמודות כדי להציג ארבע המלצות בסה"כ.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-rows-num="2"
data-matched-content-columns-num="2"
data-matched-content-ui-type="image_stacked"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
3x3 (נייד ומחשב שולחני)
דוגמת הקוד הבאה ממחישה איך יוצרים יחידת תוכן מותאם עם שלוש שורות ושלוש עמודות כדי להציג תשע המלצות בסה"כ.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-rows-num="3"
data-matched-content-columns-num="3"
data-matched-content-ui-type="image_stacked"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
4x1 (נייד) ו-2x2 (מחשב) לאתרים רספונסיביים
דוגמת הקוד הבאה ממחישה כיצד ליצור יחידת תוכן מותאם עם רשת בגודל 4x1 לנייד ורשת בגודל 2x2 למחשב. מומלץ להשתמש בהגדרה הזאת אם יש לכם אתר רספונסיבי.
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxxxx"
data-ad-slot="1234567890"
data-matched-content-rows-num="4,2"
data-matched-content-columns-num="1,2"
data-matched-content-ui-type="image_stacked,image_stacked"
data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>יש לכם משוב?
נשמח לקבל מכם משוב על התאמה אישית של יחידות עם תוכן מותאם. בטופס המשוב אפשר לספר לנו מה מתאים לך ומה טעון שיפור.
פתרון בעיות
אחרי ההתאמה האישית של יחידה עם תוכן מותאם, ייתכן שהיא לא תופיע בדיוק כמו שציפית. ריכזנו כמה בעיות נפוצות בכל הנוגע ליחידות עם תוכן מותאם, ופתרונות שלהן:
יחידת התוכן המותאם שלך ריקה
יש 2 סיבות אפשריות לכך:
- ביחידת התוכן המותאם אין המלצות כלל או יש יותר מ-30 המלצות בסה"כ. עליך לשנות את מספר השורות או העמודות ביחידת התוכן המותאם, כך שמספר ההמלצות הכולל יהיה במסגרת המגבלה.
- יחידת התוכן המותאם רחבה מדי ביחס למספר ההמלצות שהגדרת. במקרה כזה, עליך להקטין את הרוחב של יחידת התוכן המותאם.
יחידת התוכן המותאם מכילה פחות המלצות מהצפוי
ההמלצות שלך הן מסוג טקסט בלבד
שימוש במסוף (DevTools Console) כדי לאתר שגיאות ביחידות התוכן המותאם שלך
ניתן להשתמש במסוף שבדפדפן כדי לוודא ששינית בצורה נכונה את קוד המודעה של התוכן המותאם. לדוגמה, במסוף אפשר לראות אם בקוד המודעה חסר פרמטר נדרש או אם פרמטר מכיל ערך לא חוקי.
בדפדפן Chrome אפשר לבצע את הצעדים הבאים כדי לבדוק את קוד המודעה באמצעות DevTools Console:
- נכנסים לדף שמכיל את יחידות התוכן המותאם.
- הקשה על Ctrl+Shift+J (Windows / Linux) או על Cmd+Opt+J (Mac).
- בודקים אם יש הודעות שגיאה בחלונית המסוף.