Центр электронной почты, отправленной клиенту Gmail

Прежде всего, пожалуйста, извините мой английский и мой html, я ни английский, ни разработчик. Я пытаюсь создать HTML-письмо для своего клиента, который хочет отправить его через Копировать/вставить в свой клиент Gmail. Я загрузил шаблон из mailchimp и настроил его. HTML выглядит следующим образом:Центр электронной почты, отправленной клиенту Gmail

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 



    <title>*|MC:SUBJECT|*</title> 

<style type="text/css"> 
    #outlook a{ 
     padding:0; 
    } 

    body{ 
     width:100% !important; 
    } 
    .ReadMsgBody{ 
     width:100%; 
    } 
    .ExternalClass{ 
     width:100%; 
    } 
    body{ 
     -webkit-text-size-adjust:none; 
    } 
    body{ 

     margin:0; 
     padding:0; 
    } 
    img{ 
     border:0; 
     height:auto; 
     line-height:100%; 
     outline:none; 
     text-decoration:none; 
    } 
    table td{ 
     border-collapse:collapse; 
    } 
    #backgroundTable{ 
     height:100% !important; 
     margin:0; 
     padding:0; 
     width:100% !important; 
    } 

    body,#backgroundTable{ 
     background-color:#FAFAFA; 
    } 

    #templateContainer{ 
     border:1px solid #DDDDDD; 
    } 
</style></head> 
<body align="center"> 
    <center> 
     <table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="backgroundTable" align="center"> 
      <tr> 
       <td align="center" valign="top"> 

        <table border="0" cellpadding="10" cellspacing="0" width="600" id="templatePreheader"> 
         <tr> 
          <td valign="top" class="preheaderContent"> 


           <table border="0" cellpadding="10" cellspacing="0" width="100%"> 

           </table> 


          </td> 
         </tr> 
        </table> 

        <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateContainer"> 
         <tr> 
          <td align="center" valign="top"> 

           <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateHeader"> 
            <tr> 
             <td class="headerContent"> 

              </br> 
              <img src="http://gallery.mailchimp.com/7243c1f17089e9e1ebba4fe7e/images/logo_couleur.png" style="max-width:600px;" id="headerImage campaign-icon" mc:label="header_image" mc:edit="header_image" mc:allowdesigner mc:allowtext> 


             </td> 
            </tr> 
           </table> 

          </td> 
         </tr> 
         <tr> 
          <td align="center" valign="top"> 

           <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateBody"> 
            <tr> 
             <td valign="top"> 
              <table border="0" cellpadding="0" cellspacing="0" width="600"> 
               <tr> 
                <td valign="top" class="bodyContent"> 


                 <table border="0" cellpadding="20" cellspacing="0" width="100%"> 
                  <tr> 
                   <td valign="top"> 
                    <div mc:edit="std_content00">

Содержание и т.д.

Когда я копировать/вставить, что и отправить его с Gmail он правильно делает на мой мобильный, но электронная почта не центратор в Gmail клиенте.

Любая помощь была бы действительно оценена!

Большое спасибо.

источник

2013-08-05 Alan Zed

вы должны использовать встроенные стили - gmail удаляет любые таблицы стилей или теги стиля. Будьте осторожны с вашим гнездом в таблице - я слышал, что некоторые клиенты не будут отображать столы с 3 глубинами – Pete

Лучшим способом является размещение ваших столов.

Имейте один стол обертки, который центрирует его дочерние таблицы.

<table width="100%" cellpadding="0" cellspacing="0" border="0" align="center"> 
    <tr> 
    <td align="center"> 

    <table align="center" border="0" cellpadding="0" cellspacing="0" width="600"> 
    <tr> 
    <td> 
     YOUR EMAIL CONTENT GOES HERE 
    </td> 
    </tr> 
    </table> 

    </td> 
    </tr> 
</table>

Кроме того, gmail является капризным почтовым клиентом. Если у вас черные ссылки, вам нужно использовать # 000001, иначе gmail будет отображать эти ссылки с голубым цветом по умолчанию.

Убедитесь, что все ваши изображения отображаются в виде элементов блока без границ, иначе он будет добавлять пустое пространство вокруг каждого из них, даже проставки.

Если вы не хотите, чтобы телефонные номера были доступны по умолчанию для gmail, вам необходимо обернуть их в пустые теги привязки.

И одно золотое правило html-email: встроенные стили.

Надеюсь, это поможет! :)

источник

2013-08-05 14:05:03

Уважаемый R Lacorne, Ты свет моего дня! Это сработало ! –

Рад, что я мог бы помочь! :) –

Центр электронной почты, отправленной клиенту Gmail

ответ

Смежные вопросы