Mailchimp влияет на мои условные комментарии для Outlook в HTML

У меня возникают проблемы с правильным отображением моего HTML-шаблона электронной почты, когда он отправляется из Mailchimp в Outlook 2007, 2013 и 2016. Дело в том, что когда я загружаю HTML непосредственно для тестирования в Litmus, электронное письмо отлично отображается во всех предварительных просмотрах Outlook . Когда я отправляю тестовое письмо из Mailchimp в Litmus, оно выглядит непропорционально в Outlook 2007, 2013 и 2016 (для Win7).

Mailchimp что-то делает с моими условными комментариями, ориентированными на Outlook, и как я могу это обойти?

Мои условные комментарии, кажется, работают иногда, чтобы исправить ширину некоторых элементов моего электронного письма MC (вы увидите на скриншотах, текстовое поле имеет правильный размер для верхней карточки, но не для второй. ). Но хоть убей, я не могу понять, почему один работает, а другой нет, я пишу один и тот же комментарий для обоих.

Скриншоты:

когда Mailchimp отправляет электронное письмо в Outlook (что пошло не так)

когда HTML отображается непосредственно для Outlook (как он должен выглядеть)

Условные комментарии:

Я добавил условные комментарии для Outlook, например:

<!--[if (gte mso 9)|(IE)]>
<table align="center" border="0" cellspacing="0" cellpadding="0" width="600">
<tr>
<td align="center" valign="top" width="600">
<![endif]-->

<!--BODY TABLE-->
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:600px;">
...
</table>

<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->

Спасибо вам за помощь! Действительно ценю это.


person Cherrie    schedule 27.01.2017    source источник


Ответы (2)


Я чувствую вашу боль, у меня была такая же проблема с шаблонами, которые я делал для клиента. Я хотел сделать иконки устойчивыми к сетчатке и позволить клиенту загружать изображение любого размера, который он хочет. К сожалению, после многих часов отладки и поиска в Интернете я прочитал в сообщении MailChimp следующее:

Outlook не распознает HTML, ограничивающий изображения. Это означает, что если вы используете HTML для изменения размера изображения, загруженного в кампанию или шаблон, оно может отображаться с исходным размером в Outlook. Обязательно измените размер изображений, прежде чем загружать их в MailChimp, или используйте наш встроенный редактор изображений.

источник: База знаний MailChimp

Я действительно не верил, что это может быть правдой, поэтому я продолжал пытаться ограничить изображения. Я поставил фиксированную ширину на img, td, tr, table .. ничего не помогло.

К сожалению, я не могу реально объяснить, что происходит, надеюсь, ссылка на статью MC дает вам лучшее представление об этом. Но мой лучший ответ - в любом случае установить максимальную ширину и ширину для ваших img и td. И попросите своего клиента изменить размер изображений до разрешенного. Установка максимальной ширины и ширины также будет отображать #px при наведении курсора на редактируемое изображение в редакторе MailChimp. Я также обнаружил, что когда вы загружаете файлы большего размера, MailChimp выдает небольшое предупреждение.

Если это может хоть как-то помочь; см. мой код ниже, который я использовал в своих шаблонах, чтобы сделать его плавным.

<table mc:repeatable mc:variant="Item with image top and CTA" width="650" cellpadding="0" cellspacing="0" border="0" align="center" class="full-table" style="width:650px;">
<tr>
  <td style="padding:30px 20px 40px 20px;" bgcolor="#FFFFFF">
    <table width="100%" cellpadding="0" cellspacing="0" border="0">
      <tr>
        <td style="padding-bottom:15px;max-width:610px;">
          <img src="/images/img.jpg" alt="x" style="width:100%; max-width:610px;" width="610" mc:edit="article_image">
        </td>
      </tr>
    </tr>
  </table>
</td>

person Kevincore    schedule 01.02.2017
comment
Да - это именно то, что я тоже понял, когда сравнил свой исходный html и код, который выплевывает mailchimp - MC по какой-то причине убирает ширину, если я не захожу в редактор и не устанавливаю ширину. Пока что кажется, что я делаю то же самое, что и вы, чтобы он отображался правильно - чтобы убедиться, что человек, использующий шаблон, устанавливает ширину в редакторе MC. Я также нашел ссылку на эту проблему здесь, но для по какой-то причине не удается заставить работать условные комментарии MSO? Вы пробовали это / повезло? - person Cherrie; 03.02.2017
comment
MailChimp просто ошибается в приведенном выше объяснении, и это очень досадно. Установка ширины в качестве атрибута html - это в значительной степени only способ ограничения ширины в определенных версиях Outlook. Удаление этого атрибута делает для меня практически невозможным предоставление шаблонов для моих клиентов, которые используют надежные, отзывчивые изображения сетчатки. Я действительно не могу ожидать, что мои нетехнические клиенты не забудут установить ширину каждого изображения, которое они добавляют, особенно когда это будет хорошо выглядеть для них в предварительном просмотре, если они этого не сделают. Я надеюсь, что MailChimp это выяснит. - person Kerri; 14.03.2018

Вы используете изображения сетчатки глаза в своих письмах? По опыту я обнаружил, что в Outlook, если им дается большое изображение, они отображают его в большом размере, если определенная ширина не назначена тегу img. Ниже приведен пример кода, который я использую для изображений в своих электронных письмах.

<img src="[IMAGE PATH]" width="" height="" style="width:px; height:px;display:block;" border="0">

Также вы можете опубликовать тег img оскорбительного элемента, чтобы я мог лучше взглянуть на него, пожалуйста?

Ваше здоровье

person Syfer    schedule 29.01.2017
comment
Спасибо - вы были полностью на правильном пути, сравнив исходный html и код из электронного письма Mailchimp, я понял, что mailchimp убирает ширину в теге img - и нашел некоторую ссылку на эту проблему также здесь. Единственный способ, которым я придумал, как временно это исправить, - это установить ширину непосредственно в редакторе дизайна mailchimp, что немного раздражает. Я просто не уверен, почему мои условные комментарии MSO не помогают ограничивать ширину? - person Cherrie; 03.02.2017
comment
Привет, Черри, ширина таблицы в Outlook предназначена только для таблицы, я боюсь, что она не нацелена на тег изображения. Если вы хотите, вы можете добавить условный оператор для отображения только определенного изображения для Outlook и одного для остальных? Ваше здоровье - person Syfer; 09.02.2017