Marknadsföringsmejl ser annorlunda ut i Outlook

Om du använder den uppdaterade klassiska e-postredigeraren för att skriva dina marknadsföringsmeddelanden kan du märka skillnader i hur ditt e-postmeddelande visas i Outlook, på grund av Outlooks begränsade stöd för CSS.

Om du märker att e-postpositionering eller avstånd ser fel ut i Outlook, följ felsökningsstegen nedan.

Lär dig mer om e-postdesign i HubSpot Designers Community.

Observera: HubSpot Support kan inte stödja anpassade kodade e-postmallar. Om du använder en anpassad kodad mall ska du kontakta leverantören som skapade mallen. Du kan också träffa andra HubSpot-användare och designers i gemenskapen.

Avstånd

Det finns två metoder för att justera avståndet runt bilder i Outlook: med hspace eller vspace och med tabeller.

Använda hspace och vspace

HTML-attributet vspace definierar vertikalt utrymme och lägger till lika stort avstånd till toppen och botten av din bild. Hspace-attributet definierar horisontellt utrymme och lägger till lika stort avstånd till höger och vänster om bilden.

• I ditt HubSpot-konto, navigera till Marknadsföring > E-post.

• Håll muspekaren över namnet på e-postmeddelandet och klicka sedan på Redigera.

• Klicka i innehållsmodulen och klicka sedan på Avancerat > Källkod.

• I slutet av bildkoden lägger du till en eller båda av följande koder: hspace="10" vspace="10", och ersätter 10 med önskat avstånd.

Användning av tabeller

Du kan använda en tabell med tre kolumner för att jämnt fördela bilden, avståndet och texten:

• I ditt HubSpot-konto, navigera till Marknadsföring > E-post.

• Håll muspekaren över namnet på e-postmeddelandet och klicka sedan på Redigera.

• Klicka på Infoga > Tabell i verktygsfältet i redigeringsverktyget för rik text. Skapa en 3x1 tabell.
  
  

• Klicka på Avancerat > Källkod i verktygsfältet för redigering av rik text i verktygsfältet för redigering av rik text...

• Ange en bredd i den tomma cellen, t.ex. <td width="10">, för det avstånd du vill ha mellan bilden och texten.

• Ange typsnittsfamilj, typsnittsstorlek, typsnittsfärg och linjehöjd, till exempel style="font-family: sans-serif; font-size:15px; line-height: 1.5em; color: #000000" eftersom Outlook lägger till sin egen stil om den inte är specificerad.

Lös problemet med oväntade horisontella linjer som visas i ditt e-postmeddelande

På grund av ett känt fel i vissa versioner av Outlook kan en horisontell linje visas mellan sektionerna i ditt e-postmeddelande. Det finns inget konsekvent sätt att åtgärda problemet, men du kan prova följande felsökningssteg:

• Du kan prova följande åtgärder: Ställ in bakgrundsfärgen i e-postmeddelandet så att den är densamma som kroppsfärgen.
• Uppdatera innehållets teckensnittsstorlek och linjehöjd så att de är jämna tal.
• Inkludera följande CSS-stilar i huvuddelen av din e-postmall:

ms-text-size-adjust: none; mso-line-height-rule: exactly;