Skapa Gmail-annonser med anpassad HTML

Anpassad HTML passar för avancerade annonsörer och hjälper dig att skapa annonser som skiljer sig från befintliga Gmail-annonsmallar. Dessa annonser kan innehålla video och flera uppmaningar. Skapa Gmail-annonser med din egen anpassade layout genom att ladda upp dina anpassade HTML-annonser till Google Ads. 

Här beskriver vi hur du konfigurerar och laddar upp anpassade Gmail-annonser.

Innan du börjar

Viktigt! Tänk på att Gmail-annonser med anpassad HTML behåller måladressens formatering, och du kan inte använda slutliga webbadresser eller spårningsmallar. Läs mer om uppgraderade webbadresser.

Gör så här

En Gmail-annons med anpassad HTML består av en ZIP-mapp som innehåller alla filer som behövs för att visa annonsen i komprimerat och expanderat läge. Följ formatkraven nedan noga så undviker du problem.

Totala storleksgränser för annonsen:

  • hela ZIP-mappen: 1,25 MB
  • antal filer: <100 filer
  • filstorlek: <500 kB

Skapa den komprimerade annonsen

Lägg till två filer för den komprimerade annonsen i ZIP-mappen:

  • logotypbilden (med namnet logo.png, logo.jpg eller logo.gif)
  • textfilen (teaser.txt)

Krav på logotypbild

Filen måste heta exakt logo.png, logo.jpg eller logo.gif och filformatet måste vara PNG, JPG eller GIF.

  • Storlek på logotypbild: högst 144 px × 144 px med bildproportionerna 1:1
  • Största filstorlek: 150 kB
  • Filformat: PNG, JPG eller GIF (inte animerad)

Logotypbilden utgörs av en liten ikon, grafik eller varumärkeslogotyp.

Bilden visas som en 50 × 50 kvadrat på enheter med normal upplösning, men vi godtar upp till 150 kB för tydligare visning på vissa skärmar.

Krav på textfil

Filen måste heta exakt teaser.txt och filformatet måste vara TXT. Här följer ett exempel på en korrekt formaterad textfil:

Advertiser: Företagsnamn
Subject: 20 % rabatt på allt hos Företagsnamn
Description: Köp nya produkter till bra priser!
Display Url: www.example.com
Landing Page: https://www.example.com/sale

Obs! Följ exemplet exakt och var noga med att skriva rubrikerna på engelska precis som de visas nedan. Tänk också på att ta med både kategorin (som Advertiser) och din specifika information. I tabellen nedan hittar du teckenbegränsningar och mer information om vad du kan ta med.

Rubrik Teckenbegränsning Ta med följande
Advertiser 20 Företagets namn eller domän.
Subject 25 Ämnet kan vara ett erbjudande, rabatt i procent eller ett intressant budskap.
Description 90 Beskrivningen kan vara en kort sammanfattning eller en uppmaning.
Display URL 32 Webbadressen så som den ska visas i annonsen.
Landing page ingen begränsning Omdirigeringsadress för intresseväckare – används som måladress när användaren klickar på avsändarens korta webbadress när den expanderade annonsen öppnas. Du kan lägga till en statisk webbadress för klickspårning i det här fältet. Detta är den sida som användarna hamnar på när de klickar på din visningsadress.

 

Skapa den expanderade annonsen

Lägg till en HTML-fil och en bildmapp för den expanderade annonsen i ZIP-mappen:

  • bildmapp: heter ”Images” och innehåller bildfiler till den expanderade annonsen
  • HTML-fil: heter ”index.html”

Krav på bildmapp

  • Annonsen måste innehålla minst en och högst 100 bilder. Anvisningar om hur du bäddar in videor i den expanderade annonsen finns i avsnittet om video nedan.
  • Maximal bredd per bild: 650 px.
  • Maximal höjd per bild: 1 000 px. (Obs! Vi rekommenderar att annonsen är maximalt 650 px i höjd, inklusive all text och alla bilder – det gör annonsen effektivare.)

Krav på HTML-fil

Teknisk information

  • Webbadresser: Måste innehålla minst en absolut webbadress (högst 15 stycken) och alla specialtecken måste kodas (exempel: blanksteg, #).
  • Formatering: Definiera layouten med vanliga HTML-tabeller för att få konsekvent layout på olika enheter.
  • Spårning: Statiska spårningsadresser kan användas för att spåra externa klick. Pixlar för visningsspårning och dynamiska spårningsadresser tillåts inte.Om du använder mallen Gmail-annons med anpassad HTML måste du lägga till de spårningsadresser du vill använda både i filen index.html och i teaser.txt.
  • Märkningsspråk: HTML (använd UTF8-kodning), vissa HTML5-taggar (ARTICLE, ASIDE, FIGCAPTION, FIGURE, FOOTER, HEADER, MARK, SECTION, TIME, WBR) och vissa CSS-taggar (endast style-attribut som <div style="color: black" >) stöds.

Märkningsspråk som inte stöds:

  • JavaScript: <script>-taggar tas automatiskt bort från annonsen
  • mallar: <link>-taggar tas automatiskt bort från annonsen
  • Flash
  • HTML5: De enda taggar som stöds är ARTICLE, ASIDE, FIGCAPTION, FIGURE, FOOTER, HEADER, MARK, SECTION, TIME, WBR
  • ljud
  • iFrame
  • animerade bilder: GIF

CSS som stöds

azimuth border-right-color font-size-adjust list-style padding-bottom text-decoration-style
bakgrund border-right-style font-stretch list-style-image padding-left text-emphasis
background-attachment border-right-width font-style list-style-position padding-right text-emphasis-color
background-blend-mode border-spacing font-synthesis list-style-type padding-top text-emphasis-style
background-clip border-style font-variant margin pause text-indent
background-color border-top font-variant-alternatives margin-bottom pause-after text-justify
background-image border-top-color font-variant-caps margin-left pause-before text-kashida-space
background-origin border-top-left-radius font-variant-east-asian margin-right pitch text-orientation
background-position border-top-right-radius font-variant-ligatures margin-top pitch-range text-overflow
background-repeat border-top-style font-variant-numeric marker-offset quotes text-transform
background-size border-top-width font-weight max-height richness text-underline-position
border border-width height max-width speak unicode-bidi
border-bottom box-sizing image-orientation min-height speak-header vertical-align
border-bottom-color caption-side image-resolution min-width speak-numeral voice-family
border-bottom-left-radius clear ime-mode mix-blend-mode speak-punctuation white-space
border-bottom-right-radius color isolation object-fit speech-rate width
border-bottom-style direction layout-flow object-position stress word-break
border-bottom-width display layout-grid opacity table-layout word-spacing
border-collapse elevation layout-grid-char outline text-align word-wrap
border-color empty-cells layout-grid-char-spacing outline-color text-align-last writing-mode
border-left float layout-grid-line outline-style text-autospace zoom
border-left-color font layout-grid-mode outline-width text-combine-upright  
border-left-style font-family layout-grid-type overflow text-decoration  
border-left-width font-feature-settings letter-spacing overflow-x text-decoration-color  
border-radius font-kerning line-break overflow-y text-decoration-line  
border-right font-size line-height padding text-decoration-skip  

Lägga till en video i HTML-filen för den expanderade annonsen

  1. Lägga till en video

    Du kan bädda in en YouTube-video i en annons med ett förhandsgranskningsfönster. När datoranvändare klickar på videobilden spelas videon upp i en lightbox i Gmail. När användarna har tittat klart på videon kommer de tillbaka till den expanderade Gmail-annonsen. På mobilwebbläsare spelas videon upp i den videospelare som användaren har valt som standard (till exempel YouTube-appen eller en webbläsare). 

    Anvisningar: Lägg till video från YouTube genom att lägga in kod för YouTube-länken, bildkällan och visningstexten på lämpligt sätt för annonsen. Exempel:

    <a href="http://www.youtube.com/watch?v=oHg5SJYRHA0"><img src="images/play.jpg" alt="Gmail-video"></a>

    Obs! När du förhandsgranskar annonsen i Google Ads visas inte YouTube-videon och den spelas inte upp i en lightbox.

  2. Lägga till video som spelas upp på en ny flik

    Om du vill att videon ska spelas upp i YouTube på en ny flik och inte i en lightbox anger du ”class” som ”nonplayable”.

    Exempel:

    <a href="http://www.youtube.com/watch?v=oHg5SJYRHA0" class="nonplayable"><img src="images/play.jpg" alt="Gmail-video"></a>

  3. Viktigt! Lägg in en uppspelningsknapp i förhandsgranskningsbilden

    Förhandsgranskningsbilden bör innehålla någon typ av uppspelningsknapp så att användarna ser att en video spelas upp när de klickar på bilden. Google Ads lägger inte till något i förhandsgranskningsbilder som visar att de leder till en video.

Relaterade länkar

Var det här till hjälp?
Hur kan vi förbättra den?

Behöver du mer hjälp?

Logga in för ytterligare supportalternativ så att du kan lösa problemet snabbt