Вопрос по gmail, html – Gmail скрывает внешние изображения электронной почты даже после того, как пользователь разрешил их

2

Я пытаюсь вставить подпись с изображениями в html электронные письма. У меня есть некоторые проблемы с GMail (он отлично работает с клиентом iPhone).

Прежде чем пользователь примет изображения, они имеют правильный размер и виден альтернативный текст:

Images before user allowed them

HTML для каждого изображения:

<img alt="Bonne" width="80" height="80">

Так что это нормально, но когда пользователь нажимает кнопку «Разрешить изображения в этом сообщении» (не знаю точной метки на английском), они просто исчезают:

Images after user allowed them

Если я осматриваю элемент, я вижу, что был добавлен некоторый код, чтобы скрыть их:

<img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/happy.png" alt="Bonne" width="0" height="0" style="display: none !important; visibility: hidden !important; opacity: 0 !important; background-position: 80px 80px; ">

Не знаете, что это делает Gmail, у кого-нибудь есть идея?

EDIT

Исходный тег изображения:

<img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/unhappy.png" alt="Mauvaise" width="80" height="80" style="border : 0; width:80px; display: block;   margin-left: auto;   margin-right: auto;" hspace="10" />

Глобальный HTML:

    <center>
        <table border="0" cellpadding="0" cellspacing="0" id="backgroundTable" style="border-color:#FFFFFF" >
            <tbody>
            <tr>
                 <td valign="top">
                    <div >
                        <h4 class="h4">Si vous avez une seconde, vous pouvez évaluer ma réponse :</h4>
                    </div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="top">
                    <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateBody" style="border-color:#FFFFFF">
                        <tbody>
                            <tr>
                                <td valign="top" width="180" class="leftColumnContent">
                                    <table border="0" cellpadding="20" cellspacing="0" width="100%" style="border-color:#FFFFFF">
                                        <tbody><tr>
                                            <td valign="top">
                                                <a href="http://demo.smartadserver.com/Shared/happy-customers/vote/21142b09-3eab-4c07-aa64-e09e6924cd89/Happy" style="text-decoration: none;outline: none; " title="Bonne">
                                                    <img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/happy.png" alt="Bonne" width="80" height="80" style="border : none;  width:80px; display: block;   margin-left: auto;   margin-right: auto;"  />
                                                    <div style="text-align: center;">
                                                       <h4 class="h4" style="text-decoration: underline; color:#50b748; margin-bottom:0;">Bonne</h4>
                                                       <span style="color:#50b748;">Rapide, utile et agréable.</span>
                                                    </div>
                                                </a>
                                            </td>
                                        </tr>
                                    </tbody></table>
                                </td>
                                <td valign="top" width="180" class="centerColumnContent">
                                    <table border="0" cellpadding="20" cellspacing="0" width="100%" style="border-color:#FFFFFF">
                                        <tbody><tr>
                                            <td valign="top">
                                                <a href="http://demo.smartadserver.com/Shared/happy-customers/vote/21142b09-3eab-4c07-aa64-e09e6924cd89/Neutral" style="text-decoration: none;outline: none; margin-bottom:0;" title="Moyenne" >
                                                  <img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/neutral.png" alt="Moyenne" width="80" height="80" style="border : 0; display: block; width:80px;   margin-left: auto;   margin-right: auto;" >
                                                  <div   style="text-align: center;">
                                                    <h4 class="h4" style="text-decoration: underline; color:#ffd300; margin-bottom:0;" >Moyenne</h4>
                                                    <span style="color:#ffd300;">Acceptable, mais insufisant.</span>
                                                  </div>
                                                </a>

                                            </td>
                                        </tr>
                                    </tbody></table>
                                </td>
                                <td valign="top" width="180" class="rightColumnContent">
                                    <table border="0" cellpadding="20" cellspacing="0" width="100%" style="border-color:#FFFFFF">
                                        <tbody><tr>
                                            <td valign="top">
                                                <a href="http://demo.smartadserver.com/Shared/happy-customers/vote/21142b09-3eab-4c07-aa64-e09e6924cd89/Unhappy" style="text-decoration: none;outline: none;" title="Mauvaise">
                                                  <img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/unhappy.png" alt="Mauvaise" width="80" height="80" style="border : 0; width:80px; display: block;   margin-left: auto;   margin-right: auto;" hspace="10" />
                                                    <div style="text-align: center; ">
                                                    <h4 class="h4" style="text-decoration: underline; color:#be1e2d; margin-bottom:0;">Mauvaise</h4>
                                                        <span style="color:#be1e2d;">Malheureusement, je n'en suis pas satisfait.</span>
                                                    </div>
                                                </a>
                                            </td>
                                        </tr>
                                    </tbody></table>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
        </table>
    </center>

Спасибо

Так какой HTML вы отправляете? Surreal Dreams
Я добавил оригинальный тег изображения и весь HTML-код, отправленный по почте. Julien
Src не опущен, он удаляется, а затем добавляется Gmail, когда пользователь разрешает изображения в почте, вы можете увидеть его, если вы посмотрите на второй тег Julien
Я отправляю HTML-письма клиентам Gmail без проблем, так что это, безусловно, возможно. Предполагая, что адрес вашего изображения правильный, это правила CSS, которые вызывают ваши проблемы. Ваш код включает атрибут src в тег изображения, верно? Я предполагаю, что вы пропустили это специально. Surreal Dreams

Ваш Ответ

1   ответ
10

а плагином, который использует браузер, в частности плагином AdblockPlus (в его фильтрах smartadserver.com). Ваш HTML отлично работает в Gmail, в противном случае, я попробовал.

Вы можете отобразить его в своем браузере, отключив плагин или удалив smartadserver.com из списка фильтров Adblock.

Однако ... если вы хотите, чтобы это не произошло с другими людьми ...host the images ad another server, so that the domain won't be blacklisted with ad filters.

Также для другого примечания совместимости ... некоторые почтовые клиенты не поддерживали формат изображения png.

Спасибо за ожидание 3 года для меня, чтобы принять этот ответ. Я уверен, что так оно и было. Julien
Или отправьте изображения в линию.

Похожие вопросы