Mantieni tutto organizzato con le raccolte
Salva e classifica i contenuti in base alle tue preferenze.
Mostrare un annuncio ancorato
Questo esempio mostra un annuncio di ancoraggio utilizzando la libreria Tag publisher di Google (GPT).
Scopri di più sugli annunci di ancoraggio nel
Centro assistenza Google Ad Manager.
Visualizzare l'anteprima degli annunci ancorati
Puoi mostrare un annuncio di ancoraggio demo su qualsiasi pagina che mostra annunci con GPT aggiungendo
#gamTopAnchorDemo o #gamBottomAnchorDemo all'URL. Ad esempio,
https://www.example.com/#gamTopAnchorDemo.
Questa funzionalità può essere utilizzata per visualizzare l'anteprima degli annunci ancorati sul tuo sito senza dover apportare modifiche al codice. Questo è particolarmente utile per convalidare rapidamente l'aspetto e il comportamento degli elementi di ancoraggio su dispositivi e ambienti operativi diversi.
Note sull'utilizzo
Per garantire un'esperienza utente ottimale, gli annunci ancorati vengono richiesti solo nelle pagine che supportano correttamente il formato. Per questo motivo,defineOutOfPageSlot() potrebbe restituire un valore null. Dovresti controllare in questo caso per assicurarti di non svolgere operazioni non necessarie. Al momento, gli annunci di ancoraggio sono supportati se sono soddisfatte le seguenti condizioni:
Il tag GPT è in esecuzione nella finestra principale.
In una pagina ottimizzata per il mobile in cui lo zoom è neutro. In genere, questo significa che il publisher ha <meta name="viewport" content="width=device-width,
initial-scale=1"> o un valore simile nel <head> della pagina.
L'area visibile è in orientamento verticale con una larghezza compresa tra 320px e
1000px.
Richiedi gli annunci ancorati solo nelle pagine e negli ambienti in cui vuoi che venga visualizzato un annuncio ancorato. Gli annunci ancorati possono essere pubblicati su computer, tablet e dispositivi mobili.
Gli annunci ancorati generano il proprio contenitore dell'annuncio. A differenza degli altri tipi di annunci, non è necessario definire un valore <div> per gli annunci in primo piano. Gli annunci ancorati creano e inseriscono automaticamente un proprio contenitore nella pagina quando un annuncio viene riempito. Questi contenitori possono sovrapporsi o coprire altri elementi che utilizzano il posizionamento assoluto o fisso, pertanto è consigliabile evitare di posizionarli nelle aree in cui devono essere visualizzate le ancore.
Se utilizzi un'architettura di richiesta singola (SRA) su una pagina con più aree,
non chiamare display() finché non vengono creati valori div di aree annuncio statiche. Come spiegato nelle best practice per gli annunci, la prima chiamata a display() richiede ogni area annuncio definita prima di quel punto. Sebbene le aree annuncio di ancoraggio
non richiedano un <div> predefinito, le aree annuncio statiche lo richiedono. Chiamare display()
prima che questi elementi siano presenti nella pagina può generare indicatori di qualità inferiori, riducendo la monetizzazione. Per questo motivo, ti consigliamo di ritardare la chiamata iniziale finché non sono state definite le aree annuncio statiche.
Solo gli annunci ancorati visibili possono essere aggiornati. Quando un'area annuncio principale è chiusa o non è ancora visibile, tutte le chiamate a refresh() vengono ignorate. Tuttavia, se utilizzi disableInitialLoad() per controllare manualmente il caricamento e l'aggiornamento degli annunci, la prima chiamata a refresh() attiverà una richiesta di annuncio indipendentemente dalla visibilità dell'area.
[null,null,[],[],[],null,["# Display an anchor ad\n====================\n\nThis example displays an anchor ad using the Google Publisher Tag (GPT) library.\nLearn more about anchor ads in the\n[Google Ad Manager help center](//support.google.com/admanager/answer/10452255).\n\nPreview anchor ads\n------------------\n\nYou can display a demo anchor ad on any page that shows ads with GPT by adding\n`#gamTopAnchorDemo` or `#gamBottomAnchorDemo` to the URL. For example,\n`https://www.example.com/#gamTopAnchorDemo`.\n\nThis functionality can be used to preview anchor ads on your site with no code\nchanges required. This is especially useful to quickly validate how anchors will\nlook and behave on different devices and in different operating environments.\n\nUsage notes\n-----------\n\n- **To ensure an optimal user experience, anchor 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, anchor ads are\n supported if the following conditions are met:\n\n - GPT is running in the top window.\n - On a mobile optimized page where zoom is neutral; typically this means the publisher has `\u003cmeta name=\"viewport\" content=\"width=device-width,\n initial-scale=1\"\u003e` or similar in the `\u003chead\u003e` of the page.\n - Viewport is in a portrait orientation with a width between `320px` and `1000px`.\n- **Only request anchor ads on pages/environments where you want an anchor to\n appear.** Anchor ads are eligible to serve to desktop, tablet, and mobile\n devices.\n\n | **Note:** You can use Chrome DevTools [mobile simulation](//developers.google.com/web/tools/chrome-devtools/device-mode#viewport) to test anchor ads on mobile from a desktop environment.\n- **Anchor ads generate their own ad container.** Unlike other ad types, it's\n not necessary to define a `\u003cdiv\u003e` for anchor ads. Anchor ads automatically\n create and insert their own container into the page when an ad fills. These\n containers may overlap or occlude other elements using absolute or fixed\n positioning, so it's recommended to avoid placing such elements in areas\n where anchors are meant to appear.\n\n- **If using single-request architecture (SRA) on a page with multiple slots,\n don't call `display()` until static ad slots divs are created.** As\n explained in [Ad Best Practices](//developers.google.com/publisher-tag/guides/ad-best-practices#use_single_request_architecture_correctly), the first call to `display()`\n requests every ad slot defined prior to that point. Although anchor ad slots\n do not require a predefined `\u003cdiv\u003e`, static ad slots do. Calling `display()`\n before these elements are present on the page can result in lower quality\n signals, reducing monetization. Because of this, we recommend delaying the\n initial call until after the static slots are defined.\n\n- **Only visible anchor ads may be refreshed.** When an anchor ad slot is\n collapsed or not yet scrolled into view, all calls to `refresh()` are\n ignored. If you're using `googletag.setConfig({ disableInitialLoad: true })`\n to manually [control ad loading and refresh](//developers.google.com/publisher-tag/guides/control-ad-loading), however, the\n first call to `refresh()` will trigger an ad request regardless of the slot\n visibility.\n\nSample implementation\n---------------------\n\n[View demo](https://googleads.github.io/google-publisher-tag-samples/display-anchor-ad/js/demo.html) This sample makes use of library features that are not fully supported when running in an iframe. To view a demo of this sample in a new window, click the **View demo** button above. \n\n### JavaScript\n\nLoading...\n----------\n\nLoading...\n----------\n\n[Improve this sample](https://github.com/googleads/google-publisher-tag-samples/tree/main/dist/display-anchor-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-anchor-ad/js)\n\n### TypeScript\n\nLoading...\n----------\n\nLoading...\n----------\n\n[Improve this sample](https://github.com/googleads/google-publisher-tag-samples/tree/main/dist/display-anchor-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-anchor-ad/ts)"]]
