Jak zachować wymiary obrazów w szablonach Mailchimp

Question

Tworzę szablon w Mailchimp do wysyłania newsletterów. Szablon zawiera powtarzalną sekcję z obrazem o wstępnie ustalonym rozmiarze. Z jakiegoś powodu usuwa wartości width = "" i height = "" z elementu img i uwzględnia je tylko wtedy, gdy ręcznie ustawisz je w ustawieniach obrazu dla każdego obrazu. Oznacza to, że jeśli użytkownik przesyła obraz o innym rozmiarze i nie wprowadza ręcznie poprawnych wymiarów, wówczas w programie Outlook obraz jest wyświetlany w pełnym rozmiarze.

Aby uczynić go jeszcze mniej przyjaznym dla użytkownika w edytorze projektu, używa stylów css o szerokości/wysokości, aby pokazać rozmiar obrazu, więc mówi (na przykład) o szerokości 350 pikseli i wysokości 234 pikseli i można przesłać o wiele więcej image i wyświetla go w szerokości 350 pikseli (co sprawi, że użytkownik uzna, że ​​jest poprawny). Jednak nie obejmuje ona wartości szerokości/wysokości html img, chyba że ręcznie je określisz, co oznacza, że ​​rozmiar obrazu jest nieprawidłowy w programie Outlook.

Czy ktokolwiek wie o tym, aby wymusić co najmniej zmienną szerokości html automatycznie dołączaną do elementu img? W przeciwnym razie użytkownicy muszą ręcznie ustawić tę samą szerokość/wysokość dla każdego obrazu ręcznie, a jeśli zapomną, to nie wyświetli się poprawnie w Outlooku?

Dzięki,

Dave

Answer 1

Dla innych odwoływać Mam teraz rozmawiał MailChimp i używając kombinacji kodu w https://www.snip2code.com/Snippet/25348/HTML-Email-Template--max-width-hack-for- (poniżej) i max-width/wartości css max-height dla IMG poprawek problem w Outlook:

<!--[if (gte mso 9)|(IE)]> 
<center> 
    <table> 
    <tr> 
     <td width="600"> 
     <![endif]--> 
     <div style="max-width: 600px; margin: 0 auto;"> 
      <p>This text will be centered and constrained to 600 pixels even on Outlook which does not support max-width CSS</p> 
     </div> 
     <!--[if mso]> 
     </td> 
    </tr> 
    </table> 
</center> 
<![endif]--> 

Answer 2

Aby obejść ten problem, trzeba mieć max-width określony temat samego obrazu rzeczywistego, i upewnić się, że inlined na znaczniku jak ten:

<img mc:edit="image" src="image.jpg" width="200" style="max-width:200px;"> 

To się nie liczy, jeśli jest uwzględnione w CSS w głowie.

Ze znacznikiem powyżej edytor MailChimp dodaje szerokość = "200" PO edycji zdjęcia przez użytkownika. Ale jeśli użytkownik nie edytuje obrazu, niestety nie zostanie dodana żadna szerokość, więc powyższe poprawki warto wypróbować.