2017-11-05 11 views
0

私はLaravelアプリのメール用に非常に基本的なHTMLレイアウトを設計しましたが、Sparkメールクライアント(フォーマットはありません)では正しく表示されず、Apple Mailではプレビューペインにテキストの代わりにHTML。HTMLメールが正しくレンダリングされない

Apple Mail preview

私は、できるだけ簡単なHTMLを維持し、CSSのインラインのすべてをレンダリングしました。

このレンダリングを正しく行うには何が欠けていますか? HTMLの前に追加する必要のある特別なタグや追加の書式がありますか?

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta name="viewport" content="width=device-width"> 
    <link href="https://fonts.googleapis.com/css?family=Pacifico|Open+Sans" rel="stylesheet"> 
    <title>Notification</title> 
</head> 
<body style="padding: 10px; background-color: #f6f6f6" bgcolor="#f6f6f6"> 
    <table cellpadding="0" cellspacing="0" border="0" style="width: 100%; border-radius: 3px; background-color: #ffffff; border: 1px solid #e9e9e9"> 
     <tbody> 
      <tr> 
       <td style="border-radius: 3px 3px 0 0; background-color: #7266ba; padding: 40px 0"> 
        <p style="font-family:'Pacifico', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 2em; color: #ffffff; text-align: center"> 
         Alert Message Goes Here 
        </p> 
       </td> 
      </tr> 
      <tr> 
       <td style="padding: 40px; color:#7266ba"> 
        <p style="font-family:'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> 
         Body goes here 
        </p> 
        <p style="font-family:'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 30px"> 
         &mdash; Company 
        </p> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
</body> 
</html> 
+0

Laravelのどのバージョンで、メールを送信しているコードを提供できますか? – CUGreen

+0

@CUGreenメールテストツールで送信しても正しく表示されないため、Laravelとは関係がないとは思わない。 – timgavin

+1

本当ですか?私のためにうまく動作します。このメールをどのように送っているかについて、さらに詳しい情報を提供する必要があります。 – CUGreen

答えて

0

これがわかりました。

いくつかの例では、テキストを表示するのに<p>タグしか使用していませんでした。一度テーブルの中にそれらの<p>タグを置くと、すべてが正しく表示され始めました。

関連する問題