样式化 php 电子邮件以允许 Microsoft Outlook 阅读样式

Posted 2023-03-06

技术标签:

【中文标题】样式化 php 电子邮件以允许 Microsoft Outlook 阅读样式【英文标题】：Styling php email to allow Microsoft Outlook to read style 【发布时间】：2018-11-14 03:34:21 【问题描述】：

我遇到了 Microsoft Office 无法读取我创建的任何内联样式或类的问题。起初，我只是设置了内联样式，但读到 Outlook 不读取这种类型的代码。然后我尝试了类方法，但仍然没有任何运气。我正在使用 phpMailer 发送电子邮件。

有没有人在我的代码中看到任何会阻止它工作的东西？

我特别更改的部分是“.emailHeader”和“.Logo”。其余的仍然是内联样式。

$mail->ishtml(true);                                  // Set email format to 

    $mail->Subject = $subject;
    $mail->Body    = '
        <head>
        <style>
        .logo 
            width: 200px;
            height: auto;
        
        .emailHeader 
            max-width: 600px;
            height: auto;
            margin: auto;
            display: block;
            padding: 20px 0;
        
        </style>
        </head>
        <body>
            <div id="header-background" style="background:#16597B;width:100%;max-width:100%;height:auto;">
                <div class="emailHeader">
                    <div class="logo"><a href=""><img src="Logo.png" style="width:200px;height:auto;text-align:center"></a></div>
                    <div style="clear:both;"></div>
                    <div id="email-to" style="color:#FFF;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:bold;font-size: 2.5em;margin-top:35px;">Hi Team,</div>
                        <div id="email-header-description" style="font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1.4em;color:#d0dde4;margin-top:45px;">
                            You have received a new inquiry<br><br>
                        </div>
                    </div>
                </div>
                <div id="email-link" style="width:100%;padding:15px;height:auto;background:#EBEBEB;position:relative;">
                    <div id="email-link-container" style="width:600px;height:auto;margin:auto;text-align:left;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform: translate(-50%, -50%);width:600px; font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1.1em;">
                        <p>Name: ' . $first_name . ' ' . $last_name . '</p>
                        <p>Email: ' . $client_email . '</p>
                        <p>Phone: ' . $client_phone . '</p>
                        <p>Company: ' . $company . '</p>
                        <p>Contact Details: ' . $details . '</p>
                    </div>
                </div>
            </div>
        </body>
    ';

【问题讨论】：

真的很难； Outlook 完全不适合 HTML 样式。它充满了小故障和特质。 @Synchro 这就是我读到的。我正在创建的电子邮件将非常简单。例如我上面显示的代码，我只是想让徽标的大小合适。目前，它的格式为width: 100% 【参考方案1】：

尝试删除最后一个</div>。当我尝试代码时，它给了我错误

【讨论】：

感谢您的收获。不幸的是，这对风格没有帮助。【参考方案2】：

您没有包含周围的标签，以及其他常见的头标签，如元字符集。所有这些都可以在 PHPMailer->Body 中使用。

对于最近的一个项目，我仔细查看了其中一个 Cerberus 模板，最后复制并粘贴了基本大纲并填写了我自己的内容。查看下面的 Cerberus 模板：

https://raw.githubusercontent.com/TedGoas/Cerberus/master/cerberus-fluid.html

【讨论】：

以上是关于样式化 php 电子邮件以允许 Microsoft Outlook 阅读样式的主要内容，如果未能解决你的问题，请参考以下文章

使用 CSS 样式化电子邮件链接 / href="mailto:"

php 调整FacetWP的寻呼机html以匹配Genesis标记。这允许它继承Genesis主题样式。与[facetwp pager =“true”]一起使用