Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Wyświetlanie reklamy zakotwizonej
Ten przykład pokazuje reklamę kotwicy za pomocą biblioteki tagów wydawcy Google (GPT).
Więcej informacji o reklamach kotwicowych znajdziesz w Centrum pomocy Google Ad Manager.
Podgląd reklam zakotwiczonych
Możesz wyświetlić reklamę kotwicy demonstracyjnej na dowolnej stronie wyświetlającej reklamy z tagami GPT. Aby to zrobić, dodaj do adresu URL parametr #gamTopAnchorDemo lub #gamBottomAnchorDemo. Na przykład:
https://www.example.com/#gamTopAnchorDemo.
Dzięki tej funkcji możesz wyświetlać podgląd reklam zakotwiczonych w witrynie bez konieczności wprowadzania zmian w kodzie. Jest to szczególnie przydatne, aby szybko sprawdzić, jak będą wyglądać i działać kotwy na różnych urządzeniach i w różnych środowiskach operacyjnych.
Zastosowanie
Aby zapewnić użytkownikom optymalną wygodę, reklamy kotwicowe są wysyłane tylko na stronach, które prawidłowo obsługują ten format. Z tego powodu funkcja defineOutOfPageSlot() może zwracać wartość null. Sprawdź, czy tak nie jest, aby nie wykonywać niepotrzebnych czynności. Obecnie reklamy kotwicowe są obsługiwane, jeśli są spełnione te warunki:
Tag GPT działa w oknie u góry.
Na stronie zoptymalizowanej pod kątem urządzeń mobilnych, na której powiększenie jest neutralne; zwykle oznacza to, że wydawca ma <meta name="viewport" content="width=device-width,
initial-scale=1"> lub podobny w <head> strony.
Strefa widoczna jest w orientacji pionowej o szerokości od 320px do 1000px.
Żądaj reklam zakotwiczonych tylko na stronach lub w środowiskach, w których chcesz wyświetlać takie reklamy. Reklamy kotwiczone mogą wyświetlać się na komputerach, tabletach i urządzeniach mobilnych.
Reklamy zakotwiczone generują własny kontener reklamy. W odróżnieniu od innych typów reklam w przypadku reklam kotwicy nie musisz definiować elementu <div>. Reklamy kotwiczone automatycznie tworzą i umieszczają na stronie własny kontener, gdy reklama się wypełni. Te kontenery mogą nakładać się na inne elementy lub zasłaniać je, używając pozycjonowania bezwzględnego lub stałego, dlatego zalecamy unikanie umieszczania takich elementów w obszarach, w których mają się pojawiać kotwy.
Jeśli korzystasz z architektury z pojedynczym żądaniem (SRA) na stronie z wieloma boksami, nie wywołuj funkcji display(), dopóki nie zostaną utworzone statyczne elementy div boksów reklamowych. Zgodnie ze sprawdzonymi metodami dotyczącymi reklam pierwsze wywołanie funkcji display() wysyła żądanie do każdego boksu reklamowego zdefiniowanego przed tym punktem. Chociaż boksy reklam zakotwiczonych nie wymagają wstępnie zdefiniowanego tagu <div>, statyczne boksy reklamowe go wymagają. Wywołanie tagu display(), zanim te elementy pojawią się na stronie, może spowodować obniżenie jakości sygnałów, co spowoduje zmniejszenie przychodów z reklam. Z tego powodu zalecamy opóźnienie początkowego wywołania do momentu zdefiniowania boksów statycznych.
Tylko widoczne reklamy zakotwiczone można odświeżać. Gdy boks reklamowy kotwicy jest zwinięty lub jeszcze nie wyświetlany, wszystkie wywołania funkcji refresh() są ignorowane. Jeśli jednak używasz disableInitialLoad() do ręcznego kontrolowania ładowania i odświeżania reklam, pierwsze wywołanie refresh() spowoduje wysłanie żądania reklamy niezależnie od widoczności boksu.
[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)"]]
