Překryvné formáty se šablonou

Jako překryvné (pop-upové) jsou obecně označovány reklamní formáty, které se zobrazí ve vrstvě nad stránkou, nebo při přechodu uživatele z jedné stránky na jinou. Reklamní systém Seznamu nabízí překryvné formáty již několik let. Kvůli zpětné kompatibilitě zůstávají zatím zachovány i starší verze, které v partnerském rozhraní nesou ve svém názvu označení „bez šablony“. Pět aktuálních překryvných formátů, kterým je věnována tato stránka, je v rozhraní označeno slovním spojením „se šablonou“. Jejich obslužné prvky a funkce (animace, zavírací tlačítko, podkladová plocha…) zajišťuje reklamní systém, partner se o ně tedy nemusí starat a vložení překryvných formátů na stránku je stejně snadné jako u běžné reklamy.

  1. Mobilní pop-up představuje obdélníkovou reklamu umístěnou fixně k dolnímu okraji okna prohlížeče na celou jeho šíři, a to pouze na mobilních zařízeních. Jedná se buď o klasický banner (u Seznamu o rozměrech 320 × 100 px, 300 × 100 px nebo 500 × 200 px), nebo o kombinovanou či produktovou reklamu v ploše plně využívající šířku displeje a nepřesahující 25 % výšky okna prohlížeče. Na obrázku příklad mobilního pop-upu o rozměrech 320 × 100 px.
  2. Mobilní pop-up square je reklama o rozměrech 300 × 250 px nebo 300 × 300 px zarovnaná fixně do pravého dolního rohu okna prohlížeče. Zobrazuje se pouze na mobilních zařízeních a může jít o klasický banner, nebo o kombinovanou či produktovou reklamu. Na obrázku příklad mobilního pop-up squaru o rozměrech 300 × 250 px.
  3. Desktopový pop-up je obdélníková reklama umístěná fixně k dolnímu okraji okna prohlížeče na celou jeho šíři, a to pouze na desktopových zařízeních. Jedná se buď o klasický banner (u Seznamu o rozměrech 970 × 310 px, 970 × 210 px nebo 728 × 90 px), nebo o kombinovanou či produktovou reklamu v ploše o rozměrech nejvýše 970 × 310 px. Na obrázku příklad desktopového pop-upu o rozměrech 970 × 210 px.
  4. Mobilní viněta je celoplošná reklama zobrazovaná pouze na mobilních zařízeních, která využívá celé okno prohlížeče. Zobrazuje se na základě událostí definovaných partnerem, například po uplynutí určité časové odezvy nebo doscrollování k určitému prvku na stránce – stejně jako předchozí tři překryvné formáty. Může obsahovat jak klasický banner (u Seznamu o rozměrech 300 × 300 px, 300 × 600 px nebo 480 × 480 px), tak kombinovanou nebo produktovou reklamu využívající celou plochu. Na obrázku příklad mobilní viněty / interstitialu s bannerem o rozměrech 300 × 600 px.
  5. Mobilní interstitial je vzhledově totožný jako mobilní viněta, liší se však chováním. Zobrazí se výhradně poté, co uživatel klikne na (nereklamní) odkaz na webu, tedy před přechodem na jinou stránku, typicky článek.

Všechny překryvné reklamní formáty obsahují zavírací tlačítko, které umožňuje uživateli reklamu skrýt, pokud na ni nechce kliknout a přejít tak na cílovou stránku.

Reload – automatické načítání nové reklamy

U překryvných ploch s výjimkou mobilního interstitialu a mobilní viněty lze v partnerském rozhraní zapnout automatické načítání nové reklamy (reload) v rámci jednoho zobrazení stránky, a to v pevně daném intervalu 30 sekund. Pokud chce partner opakované načítání reklamy provádět na základě vlastní, samostatně implementované logiky, musí automatický reload ponechat v rozhraní vypnutý.

K požadavku na překryvnou reklamu smí dojít nejdříve po 30 sekundách od zobrazení předchozí překryvné reklamy. Požadavky odeslané před uplynutím této doby reklamní systém zamítá. Toto omezení se netýká formátu mobilní interstitial, protože jeho zobrazení je vyvoláno přechodem uživatele na jinou stránku webu.

Podrobný popis všech překryvných formátů naleznete v pravidlech pro překryvnou reklamu.

Dbejte na uživatelský zážitek

Překryvné formáty jsou vizuálně výraznější a uživatelé je často vnímají jako rušivé. Doporučujeme proto po jejich nasazení pečlivě sledovat chování návštěvníků vašeho webu a upravit podle něj výběr a nastavení těchto formátů.

Implementace překryvných formátů s využitím reklamních kódů

Následující text obsahuje návod pro nasazení výše uvedených překryvných formátů se šablonou.

  1. V partnerském rozhraní si pro vámi vybrané překryvné formáty založte samostatné nové zóny. Pokud je váš web zařazen do služby Seznam Newsfeed, zóny pro vás založíme i nastavíme my a jejich přehled obdržíte e-mailem společně s pravidly používání překryvných formátů v newsfeedu.
    V detailu každé zóny zvolte požadovaný překryvný formát (vybírejte z těch, které mají za názvem uvedeno „se šablonou“). Povolit zde můžete automatický reload reklamy v rámci jedné stránky (nelze využít u mobilního interstitialu a mobilní viněty).
  2. Poté, co od nás obdržíte ID zón pro překryvné formáty, ze svého webu kompletně smažte původní nasazení pop-upových formátů, ať už vlastní, nebo provedené s využitím našeho skriptu popup.js. Je třeba odebrat nejen reklamní kódy a jejich volání, ale i dosavadní řešení pro obsluhu překryvného formátu (animace, zavírací tlačítko, podkladová plocha…). V případě, že jste dosud žádný překryvný formát nasazený neměli, můžete tento bod přeskočit.
  3. Nové zóny nasaďte stejným způsobem jako jakoukoli jinou běžnou plochu, tedy vložením reklamního kódu do stránky. Doplnění zavíracího tlačítka a ovládací logiky zajistí reklamní systém. Parametry width a height do požadavku pro jednotlivé překryvné formáty jsou následující:
    • mobilní pop-up – width: 500, height: 200
    • mobilní pop-up square – width: 300, height: 300
    • desktopový pop-up – width: 970, height: 310
    • mobilní viněta a interstitial – width: 480, height: 600
  4. Element určený pro reklamu musí být prázdný a může být skrytý. Zobrazí se až společně s vydanou reklamou. Reklamní systém zajistí, že se reklama vykreslí tak, jak určuje nastavení zóny, a to včetně veškerých obslužných prvků a očekávaného chování. Zkontrolujte, že v CSS nemáte definované vlastnosti elementu iframe bez dalšího upřesnění konkrétního prvku třídou nebo kotvou, aby stylování reklamy probíhalo správně. Pokud bude na zóně zapnutý automatický reload, v rámci jednoho zobrazení stránky se každých 30 sekund automaticky odešle nový požadavek na výdej reklamy a dojde k opětovnému zobrazení plochy, i když ji uživatel mezitím zavřel.

Příklad nasazení (překryvné formáty s výjimkou mobilního interstitialu)

<script src="https://ssp.seznam.cz/static/js/ssp.js"></script> /* na stránku stačí vložit pouze jednou do hlavičky */

<div id="ad"></div>  /* prázdný element pro reklamu; musí být do stránky umístěn před voláním funkce getAds(), jinak na jeho pozici u překryvných formátů nezáleží */

<script>
  sssp.getAds({
    zoneId: 123456,  /* unikátní identifikátor překryvné zóny */
    id: 'ad',        /* id elementu */
    width: 970,
    height: 310
  });
</script>

Mobilní interstitial

Mobilní interstitial se uživateli zobrazí těsně před přechodem na jinou stránku webu, tedy poté, co uživatel klikne na nereklamní odkaz směřující na jinou stránku (například článek). Kliknutí v tomto případě vede k odeslání požadavku na reklamní systém, aby reklamu vydal jako mobilní interstitial.

Partner musí zajistit, aby po kliku na odkaz nedošlo k přechodu na další stránku a mobilní interstitial dostal možnost se vykreslit. Abychom mohli uživatele po zavření reklamy přesměrovat na uvedenou stránku, musí partner předat její URL v požadavku na reklamu. To provede pomocí parametru landingUrl, jak je popsáno v technické dokumentaci reklamního systému.

Příklad nasazení mobilního interstitialu

<script src="https://ssp.seznam.cz/static/js/ssp.js"></script> /* na stránku stačí vložit pouze jednou do hlavičky */

<div id="ad"></div>  /* prázdný element pro reklamu; musí být do stránky umístěn před voláním funkce getAds(), jinak na jeho pozici u překryvných formátů nezáleží */

<script>
  sssp.getAds({
    zoneId: 123456,  /* unikátní identifikátor překryvné zóny */
    id: 'ad',        /* id elementu */
    options: {
      landingUrl: 'https://www.novinky.cz/clanek/domaci-pocet-obyvatel-ceska-klesl-40525415'
      },
    width: 480,
    height: 600
  });
</script>

URL musí být validní včetně protokolu a může směřovat kamkoli, i mimo aktuální doménu. Jakmile uživatel reklamu zavře, reklamní systém provede přesměrování uživatele na landingUrl.

Pokud partner URL přes parametr nepředá, nebo nebude-li adresa validní, uživatel po zavření reklamy zůstane na původní stránce. Tím dojde k zablokování pohybu po webu – jestliže uživatel znovu klikne na odkaz na článek a odeslaný požadavek na výdej mobilního interstitialu bude opět obsahovat nevalidní/chybějící landingUrl, uživatel se z výchozí stránky nedostane dál.

UX tipy pro nasazení překryvných formátů

  • Zobrazení mobilního pop-upu a mobilního pop-up squaru doporučujeme navázat na určitou míru odscrollování nebo na dosažení konce článku. Reklama tak uživatele osloví ve chvíli, kdy už nebude věnovat plnou pozornost obsahu.
  • Automatický reload aktivujte až od druhé navštívené stránky – nikoliv ihned po příchodu na web. Tím snížíte rušivý dojem z reklamy.
  • Ze stejného důvodu nezobrazujte na první stránce ani mobilní vinětu. Tu doporučujeme zařazovat až od druhé stránky dál. Druhý celostránkový překryvný formát – mobilní interstitial – lze naopak zobrazit už při přechodu mezi první a druhou stránkou.

Nasazení překryvných formátů na webech využívajících WordPress

V případě, že pro administraci svého webu používáte systém WordPress, můžete pro jednoduché nasazení naší reklamy použít plugin Seznam Reklama WP. Překryvné formáty bude plugin podporovat od verze 2.4, jejíž vydání plánujeme na září 2025.