Stay organized with collections
Save and categorize content based on your preferences.
Display a rewarded ad
This example demonstrates using the Google Publisher Tag (GPT) library to
request and render a rewarded ad. Rewarded ad formats let app and web users
receive rewards for viewing ads. Learn more about rewarded ads in the
Google Ad Manager help center.
You can use the following GPT events to display and interact with rewarded ads:
For the purpose of this example, a simple modal dialog is used to both prompt
the user to view the rewarded ad and to display the reward upon completion. In
practice, it is the responsibility of the publisher to implement their own
interface to accomplish these tasks.
Usage notes
To ensure an optimal user experience, rewarded ads are only requested on
pages that properly support the format. Because of this,
defineOutOfPageSlot() may return null; you should check for this case to
ensure you're not doing any unnecessary work. Currently, rewarded ads are
only supported on mobile optimized pages where zoom is neutral. Typically
this means the publisher has <meta name="viewport"
content="width=device-width, initial-scale=1"> or similar in the <head>
of the page.
Rewarded ads generate their own ad slot. Unlike other ad types, it's not
necessary to define a <div> for rewarded ads. Rewarded ads automatically
create and insert their own container into the page when an ad fills.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],[],[],[],null,["Display a rewarded ad\n\nThis example demonstrates using the Google Publisher Tag (GPT) library to\nrequest and render a rewarded ad. Rewarded ad formats let app and web users\nreceive rewards for viewing ads. Learn more about rewarded ads in the\n[Google Ad Manager help center](//support.google.com/admanager/answer/9116812).\n\nYou can use the following GPT events to display and interact with rewarded ads:\n\n| Event | Fired when... |\n|-----------------------------------------------------------------------------------------------------------------------|----------------------------------------------|\n| [RewardedSlotClosedEvent](//developers.google.com/publisher-tag/reference#googletag.events.rewardedslotclosedevent) | A rewarded ad slot has been closed. |\n| [RewardedSlotGrantedEvent](//developers.google.com/publisher-tag/reference#googletag.events.rewardedslotgrantedevent) | A reward has been granted for viewing an ad. |\n| [RewardedSlotReadyEvent](//developers.google.com/publisher-tag/reference#googletag.events.rewardedslotreadyevent) | A rewarded ad slot is ready to be displayed. |\n\nFor the purpose of this example, a simple modal dialog is used to both prompt\nthe user to view the rewarded ad and to display the reward upon completion. In\npractice, it is the responsibility of the publisher to implement their own\ninterface to accomplish these tasks.\n| **Important:** Before you display a rewarded ad, you must comply with the [policies for ad units that offer rewards](//support.google.com/admanager/answer/7496282) and obtain user consent.\n\nUsage notes\n\n- **To ensure an optimal user experience, rewarded ads are only requested on\n pages that properly support the format.** Because of this,\n `defineOutOfPageSlot()` may return `null`; you should check for this case to\n ensure you're not doing any unnecessary work. Currently, rewarded ads are\n only supported on mobile optimized pages where zoom is neutral. Typically\n this means the publisher has `\u003cmeta name=\"viewport\"\n content=\"width=device-width, initial-scale=1\"\u003e` or similar in the `\u003chead\u003e`\n of the page.\n\n- **Rewarded ads generate their own ad slot.** Unlike other ad types, it's not\n necessary to define a `\u003cdiv\u003e` for rewarded ads. Rewarded ads automatically\n create and insert their own container into the page when an ad fills.\n\nSample implementation [View demo](https://googleads.github.io/google-publisher-tag-samples/display-rewarded-ad/js/demo.html) \n\nJavaScript \n\nLoading... \n\nLoading... \n[Improve this sample](https://github.com/googleads/google-publisher-tag-samples/tree/main/dist/display-rewarded-ad/js) [Report an issue](https://github.com/googleads/google-publisher-tag-samples/issues/new?labels=documentation&template=sample-feedback.md&title=Sample+feedback%3A+display-rewarded-ad/js)\n\nTypeScript \n\nLoading... \n\nLoading... \n[Improve this sample](https://github.com/googleads/google-publisher-tag-samples/tree/main/dist/display-rewarded-ad/ts) [Report an issue](https://github.com/googleads/google-publisher-tag-samples/issues/new?labels=documentation&template=sample-feedback.md&title=Sample+feedback%3A+display-rewarded-ad/ts)"]]