Guide til booking af HTML-interstitials i Cxense Mobile SDK

2016-11-08 15:37:27 UTC

Opdateret 09.04.2015 

Når du integrerer Cxense (tidligere Emediate) Mobile SDK i din iOS- eller Android-app, kan du booke rich media/HTML5-interstitialannoncer i din e-avispublikation. Disse HTML-annoncer vil blive vist som fuldskærmsannoncer mellem siderne i publikationen.

I denne artikel finder du dokumentation for de muligheder, Visiolink tilbyder mht. booking af interstitials i din e-avis ved hjælp af Cxense Mobile SDK samt en vejledning til booking af HTML-interstitials i Cxense Display-brugergrænsefladen.

En grundlæggende introduktion kan være nødvendig for at forstå grænsefladen for annoncebooking i Cxense Display. Hvis du ikke har brugt grænsefladen før og har spørgsmål til de grundlæggende funktionaliteter, bedes du kontakte Cxense's support.

Oprettelse af HTML-annoncer kræver et højt niveau af tekniske færdigheder. Hos Visiolink har vi allieret os med bureauet OnAds, der specialiserer sig i digitale annoncer, så du kan vælge mellem to måder at oprette HTML-interstitialannoncer:

Rich Media Template Ads: Adgang til et selvbetjeningsværktøj til annonceopbygning, hvor du kan benytte dig af seks forhåndsdefinerede annonceformater, der er nemme at opbygge. Læs denne artikel for at få yderligere oplysninger og se videoeksempler: http://blog.visiolink.com/new-concept-for-interactive-ads
Rich Media Premium Ads: Komplet kreativt samarbejde med vores digitale annoncebureau om oprettelse af skræddersyede annoncer.

Kontakt Visiolink for at høre mere om disse løsninger.

1.0 Visiolink HTML-annonceløsning

Hos Visiolink har vi opbygget et tydeligt koncept for indsættelse af Content Units på både faste placeringer og frekvensstyrede placeringer i e-avisen for iOS og Android. Konceptet præsenterer vi her.

1.1 Det skal du bruge

For at kunne vise HTML-interstitials, du har booket ved hjælp af Cxense Display-grænsefladen i din e-avis-app, skal du bruge:

  • Featuren Interstitial i din app
  • Integration af Cxense Mobile SDK i din app
  • Adgang til Cxense Display

1.2 Faste placeringer

Du kan oprette op til fem faste placeringer i din e-avispublikation. En placering (placement) defineres som en reserveret annonceplads, der er placeret efter en ulige side i e-avispublikationen, se illustration 1.

 Forudsætningerne er:

  • Du skal oprette én Content Unit (CU) pr. placering
  • Placeringer kan kun placeres efter ulige sidetal
  • Der skal være mindst tre sider mellem hver placering. Hvis der er en placering efter side 1, er den næste mulige placering efter side 5, se illustration 1.
  • Når appen er sendt, kan placeringer og CU'er ikke ændres.

 

 

Illustration 1

 

1.3 Frekvensstyrede interstitials

Udover faste placeringer kan du også oprette én CU, der indeholder frekvensstyrede interstitials. De vises i appen i henhold til et fast antal swipes. Hvis frekvensen er sat til syv swipes, vil din interstitial blive vist for hver syv swipes mellem sider (tre swipes trækkes fra frekvenstallet, første gang du åbner en publikation. Det optimerer sandsynligheden for, at flere læsere får vist annoncen).

Frekvenstallet kan ikke være lavere end 5. Du kan booke flere interstitials (kampagner) på denne CU på én gang.

1.4 App-logik samt generelle krav og begrænsninger

Læs nedenstående regler for styring af visningslogikken, så du forstår, hvordan interstitials vises i appen:

  • Appen forhåndsindlæser den interstitial, der er tættest på den side, der læses. Interstitials forhåndsindlæses for at minimere indlæsningstiden, når læseren når til en interstitialplacering. Det betyder, at hvis man swiper hurtigt mellem siderne, kan det resultere i, at en interstitial ikke bliver vist.
  • Af hensyn til ydeevnen kan appen kun forhåndsindlæse interstitialen for én placering ad gangen.
  • Når du tester interstitials på faste placeringer, skal du simulere normal læseradfærd. Når du bladrer hurtigt mellem de forskellige interstitials, har devicet måske ikke tid nok til at registrere, at en interstitial er aktiv, og springer derfor placeringen over. 
  • Hvis der er booket mere end én interstitial i en CU (det er kun muligt på frekvensstyrede interstitials), viser appen den interstitial, der har været vist færrest gange på læserens device.
  • Visning af en interstitial nulstiller frekvenstælleren for frekvensstyrede interstitials.
  • Et område på tre swipes før og efter en fast placering vil blive holdt fri for frekvensstyrede interstitials for at undgå at spamme læseren med flere annoncer inden for få sider.
  • Hvis der ikke er booket kampagner på en CU i appen, springes placeringen over, og brugeren sendes videre til næste side i publikationen.
  • En kampagne kan ikke begrænses til en bestemt udgave af din publikation. Når den er booket på en CU, vil den blive vist i alle udgaver, der er tilgængelige i appen i hele den bookede periode.
  • Interstitials vil kun blive vist, når devicet er online.
  • Visiolink tillader, at en interstitial overtager hele skærmbilledet, inklusive bevægelsesstyring. Vi har indbygget tre forskellige måder at bladre på for at forhindre, at læseren sættes fast på en interstitial, der har overtaget swipebevægelsen, og som sædvanligvis bruges til at gå til næste/forrige side:
    • Kantswipe: Swipe fra kanten af enheden på skærmen for at bladre til næste/forrige side, se illustration 2.
    • Pile: Tryk på pilene til venstre eller højre for at bladre til næste/forrige side. Pilene vises, hver gang læseren swiper i appen, se illustration 2.
    • Flere swipes (kun iOS): Hvis man swiper i samme retning tre gange inden for to sekunder, bladrer man til næste/forrige side, da denne adfærd angiver, at læseren ikke længere registrerer budskabet i annoncen, men i stedet ønsker at bladre til en anden side.

 

Illustration 2

 

2.0 HTML5-annoncevisning med Cxense Mobile SDK

Cxense Mobile SDK forventer HTML-interstitials, der fungerer i fuld skærm på både telefoner og tablets og i både landskabs- og portrætformat. Det er interstitialproducentens ansvar at sørge for, at de fungerer og ser ud som ønsket på alle skærmstørrelser og i begge orienteringer.

Når en interstitial skal vises, vil appen bede Cxense SDK om at levere den annonce, der er booket på CU'en, svarende til den kommende placering i appen. Hvis der er aktive kampagner til rådighed, vil der blive åbnet en Cxense-webvisning i appen, og styringen overtages af logikken i HTML-annoncen.

Annoncen vises i fuld skærm, så du har alle de gængse muligheder for at gøre brug af fuldskærmtilstanden, som du har med en normal webside. Der er ingen begrænsninger i webvisningen. Derfor finder best practice for generel webudvikling anvendelse. Når links i annoncen aktiveres, sender en popover-browservisning brugeren til landingssiden, der kan lukkes for at vende tilbage til annoncen.

iOS SDK er MRAID-kompatibel. Android SDK er endnu ikke MRAID-kompatibel.

Bemærk, at vi for Android 4.3 og tidligere versioner anbefaler at bruge statiske annoncer som alternativ/fallback i stedet for interaktive annoncer, da disse Android-versioner ikke er velegnede til alle HTML5-elementer. 

2.1 SDK-forhåndsindlæsning og HTML5 Polite Load

SDK og Visiolink-appen forhåndsindlæser din næste annonce på brugerens device for at give et hurtigere flow og en hurtigere visning af annoncen. Men selv når den forhåndsindlæses, kan det tage tid at indlæse en HTML5-annonce i webvisningen. For at optimere yderligere kan du tilføje "Polite Load" på din annonce, før hele annoncen vises. Du håndterer Polite Load ved at angive, at annoncen skal vise et statisk billede som det første og først derefter vise de tunge animationer og video. 

Hooks til start og stop af animationer (kun iOS)

Hvis du vil gøre brug af animationer, der starter, når brugeren får vist annoncen, leverer Visiolink en JavaScript-funktion, du kan bruge i din annonce:

vl_adview_will_appear();

Hvis du vil sikre dig, at animationerne stopper, når brugeren har bevæget sig væk fra annoncen, skal du bruge denne hook: 

vl_adview_did_disappear();

Denne hook er især nyttig, når der vises annoncer med lyd, så du kan sikre dig, at lyden stopper, når brugeren bevæger sig væk fra annoncen.

2.2 Sådan får du klik og sporing

Det er vigtigt, at Cxense-klikmakroen er integreret korrekt i din interstitial for at få klik og sporing til at fungere korrekt.

Cxense-klikmakroen er: EASLink=

Eksempel på brug af Cxense-klikmakro i HTML5-banner:
<a href=”EASLink=http://yourhomepage.com”>Go to homepage</a>

eller med JavaScript

window.open (’EASLink=http://yourhomepage.com’);

Hvis du bruger en anden videresendelsemetode til din startside/destinations-URL, skal du bare bruge EASLink= før URL'en.

2.3 Sådan opsætter du Cxense Display til booking af interstitials

For at klargøre visning af HTML-interstitials i din(e) e-avis-app(s) skal du gøre følgende:

  • Opret op til fem enkelte Content Units til faste placeringer
    • Navngiv CU'erne logisk iht. placeringerne i appen, f.eks. "AvisOverskrift_s1", "AvisOverskrift_s5" osv.
  • Opret én CU til frekvensstyrede interstitials
  • NB! Når du opretter CU'erne, vil du blive bedt om at angive højde og bredde på CU'en. Hvis du kun vil køre HTML-annoncer, er størrelsen irrelevant, fordi skaleringen styres af annoncen. Sæt størrelsen til f.eks. 1x1 px (det er vigtigt, at du bruger samme størrelse, når du opretter Kampagner, da CU-størrelse og kampagnestørrelse skal matche).
  • Du skal oplyse id-nummeret (fire eller fem tegn) til Visiolink for hver enkelt CU og de tilsvarende sidetal (kun ulige tal), hvorefter du ønsker at placere CU'erne.

Hos Visiolink bruger vi JavaScript-tags til at køre annoncer. Nedenfor finder du en trin for trin-vejledning til, hvordan du booker JavaScript-tags til visning af interstitials. 

  • Opret en ny kampagne
    • Navngiv kampagnen
    • Angiv en startdato og slutdato for, hvornår kampagnen skal være aktiv
    • Prioritetsniveau skal være Tilgængelige visninger
    • Type skal være Banner
    • Størrelse skal svare til størrelsen af den Content Unit, du ønsker at bruge til denne kampagne
    • Tryk på “Tilføj”

 

Illustration 3

  • Nu er du klar til at tilføje en annonce på kampagnen
    • Tryk på “Tilføj annoncer”
    • På næste skærmbillede trykker du på “[HTML]”
    • På næste skærmbillede trykker du på “Indsæt i dit eget HTML-indhold”
    • I vinduet skal du indpakke JS-tagget i denne enkle HTML og placere JS-tagget i tagget <div>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!--cx autoScale=false; --> DENNE KOMMENTAR ER VIGTIG FOR, AT INTERSTITIALS BLIVER VIST KORREKT
<html>
<head>
<style type="text/css">
html, body
{

    padding: 0px;

    left: 0px;

}
</style>
</head>
<body>

    <div>

PLACER JS-TAG HER

    </div>
</body>
</html>

 

Illustration 4

  • Tryk på “Opdater”
  • Tryk på “Anvend”

Nu kan du finde din kampagne i oversigten under Annoncering -> Vis kampagne, og derfra tilføjer du kampagnen på den ønskede CU. Derudover skal du ændre status for kampagnen fra “Afventer godkendelse” til “Godkendt”.

Nu vil kampagnen være klar til udførelse i appen på kampagnens startdato.

 

2.4 Eksempler på JS-tags

Nedenfor finder du to eksempler på JavaScript-tags, der kører to forskellige HTML-annoncer. Taggene indeholder billedfiler, der er tilpasset både tablets og telefoner samt lodret og vandret visning. Derudover indeholder de logik, der registrerer enhedstype (baseret på skærmstørrelse) og hvordan enheden vender.

Eksempel på en reagerende billedannonce:

<script type="text/javascript" src="http://pool.static.onads.dk/static/20120/banner.php?bnid=30fa2200740b901d1ca9f5f5270dbcc4&clickTAG=EASLink=&landingUrl=http%3A%2F%2Fonads.dk"></script>

 

Eksempel på en 3D-kube med op til fire sider:

<script type="text/javascript" src="http://pool.static.onads.dk/static/20124/banner.php?bnid=a17cb1e456aa58774f202a326f7c280e&clickTAG=EASLink=&landingUrl=http%3A%2F%2Fonads.dk"></script>

Var denne artikel en hjælp?
0 ud af 0 fandt dette nyttigt
Har du flere spørgsmål? Send en anmodning

Kommentarer