לרוב, מפיצים של משחקים מארחים את המשחקים שלהם בצורה שאפשר לשחק בה במסך מלא או ב-iFrame'd כדי להיכנס לדף אינטרנט אחר או ל-WebView באפליקציה.
בדף שמארח את המשחק (כלומר קנבס העריכה של משחק) יש קוד AdSense ('התג'); הוא טוען את לוגיקת JavaScript של המשחק, ובדרך כלל כולל רכיב של לוח עריכה שבו המשחק מעובד.
המטרה שלנו ב-Ad Placement API היא למזער את הקוד שצריך להוסיף למשחק. כך תוכלו לשלוט במודעות מבלי לשנות את המשחק באופן קבוע ולפרסם גרסאות חדשות שלו.
![](https://google-developers.gonglchuangl.net/static/ad-placement/docs/images/html5-structure.png?authuser=0&hl=he)
יש דרכים רבות ליצור משחקי H5 באמצעות JavaScript ישירות, או ספריות של צד שלישי לגרפיקה דו-ממדית ולתלת-ממד שמעובדות לווידג'ט של בד ציור, למנועי משחקים ובמקרים מסוימים, תהליכים מורכבים של אוסף בשפות אחרות.
ה-Ad Placement API מיועד לפעול באותו מסמך כמו ה-Canvas עם התג והתג adsbygoogle
. לדוגמה, אם מוסיפים משחק כ-iFrame בדף גדול יותר, יש לקרוא את התג ואת כל הקריאות ל-API מתוך אותו iFrame.
דוגמה למבנה של משחק H5
הדוגמה המפורטת הבאה מציגה את החלקים העיקריים של דף משחק טיפוסי.
יש דרכים רבות ליצור משחקי H5 באמצעות JavaScript ישירות, או ספריות של צד שלישי לגרפיקה דו-ממדית ולתלת-ממד שמעובדות לווידג'ט של בד ציור, למנועי משחקים ובמקרים מסוימים, תהליכים מורכבים של אוסף בשפות אחרות. הפרטים המדויקים של המשחק עשויים להיות שונים מהדוגמה הזו.
<head>
## The Ad Placement tag ##
# Configure your monetisation settings here and place the standard
# boilerplate code for initialising the API functions. This code may change
# depending on where the game is being distributed (eg. a website, a super
# app, different publishers).
<script async
data-ad-frequency-hint="30s"
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-123456789" # your publisher ID
crossorigin="anonymous">
</script>
<script>
window.adsbygoogle = window.adsbygoogle || [];
var adBreak = adConfig = function(o) {adsbygoogle.push(o);}
</script>
[...]
</head>
<body>
[...]
## Your game code ##
# This is your game logic that renders the playable canvas. Once you've
# integrated your game with the Ad Placement API, this code won't change due
# to ad configuration updates.
<canvas id="game_canvas" width="100%" height="100%"></canvas>
<script src="game.js"></script>
[...]
</body>
ה-Ad Placement API מיועד לפעול באותו מסמך כמו ה-Canvas עם התג והתג adsbygoogle
. לדוגמה, אם מוסיפים משחק כ-iFrame בדף גדול יותר, יש לקרוא את התג ואת כל הקריאות ל-API מתוך אותו iFrame.
<head>
<!-- The adsbygoogle tag is not here -->
</head>
<body>
<iframe src="https://www.my-game.com" title="My game" allow="autoplay">
<!-- The game is loaded here and contains the adsbygoogle tag -->
</iframe>
</body>
אופן ההפצה של משחקי H5
ניתן להפיץ משחקי H5 בדרכים רבות ושונות, ובפלטפורמות רבות. לעיתים קרובות עשויות להיות ישויות שונות בתהליך היצירה וההפצה של משחקים, כולל:
- מפתחים – האנשים שיוצרים את המשחקים
- מנועי חיפוש – חברות שמספקות את הכלים לבנייתן
- ספקי אירוח – המארחים משחקים
- מפיצים – שעובדים עם מפתחים כדי ליצור קטלוגים עשירים של משחקים
- בעלי תוכן דיגיטלי – שבבעלותם מקור התנועה ורוצים להציב משחקים באתרים או באפליקציות שלהם
ברוב המקרים, הישויות יכולות לכלול את התפקידים האלה — אתם יכולים לפתח, לארח ולפרסם את המשחקים שלכם.
אפשר לשחק במשחקים בדרכים שונות, כולל:
- מסך מלא – מסך מלא שבו אפשר ליהנות מחוויה מקיפה
- iFrame/WebView – שבו הם מוצגים כחלק ממסמך גדול יותר
- מוטמע – במקומות שבהם הם ממוקמים ישירות בדפים עם תוכן אחר
חוויות מסך מלא ו-iFrame חלות גם על אינטרנט וגם על אפליקציות ("iFrame" במקרה הזה, הן יכולות להתייחס גם ל-WebView שמוטמע באפליקציה) – אנחנו מצפים שרוב המשחקים יופצו בדרכים האלה. משחקים מוטמעים הם חוויית אינטרנט בלבד.
להיזכר
- מסמך ה-HTML שמכיל את התג הוא המקום שבו המודעה מוצגת.
- המודעה צריכה לכלול תמיד את המסמך המקיף.
- התג והמשחק צריכים תמיד להיות באותו מסמך.