修改WordPress邮件通知样式

作者:matrix 发布时间:2013-12-10 分类:Wordpress 兼容并蓄

邮件样式

邮件通知,每当有评论回复时系统会发送一封邮件告知被评论者。

WordPress上免插件实现的方法:http://www.cmhello.com/wordpress-comments-email-code.html

我选的第一种:所有回复都发送邮件通知。

$message='发送的邮件内容以及样式代码';

上面为邮件内容。

样式如上图,把发送的邮件内容以及样式代码改为下面代码:

<TABLE cellSpacing="0" cellPadding="0" width="618" align="center">
    <TBODY>
    <TR>
        <TD style="FONT-FAMILY: Tahoma,Helvetica,Arial,sans-serif; ">
            <TABLE style="FONT-SIZE: 12px; MARGIN: 0px auto; OVERFLOW: hidden; HEIGHT: auto" cellSpacing="0"
                   cellPadding="0">
                <TBODY>
                <TR>
                    <h1 id="logo">'.get_option('blogname').'</h1>
                </TR>
                <TR>
                    <TD style="OVERFLOW: hidden; BORDER-TOP-STYLE: none; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: auto; BORDER-BOTTOM-STYLE: none">
                        <TABLE style="PADDING-RIGHT: 25px; MARGIN-TOP: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN-LEFT: 27px; WIDTH: 588px; BORDER-TOP-STYLE: none; PADDING-TOP: 0px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none"
                               cellSpacing="0" cellPadding="0" border="0">
                            <TBODY>
                            <TR>
                                <TD style="BACKGROUND: url(http://a.xnimg.cn/imgpro/mail/edm-hot-bg-middleLeft.png); WIDTH: 17px"></TD>
                                <TD style="BACKGROUND: #fff">
                                    <DIV><IMG
                                            style="DISPLAY: block; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none"
                                            src="http://a.xnimg.cn/imgpro/mail/edm-hot-bg-middleTop.png"></DIV>
                                    <TABLE style="MARGIN-TOP: 10px; MARGIN-LEFT: 13px; WIDTH: 500px" cellSpacing="0"
                                           cellPadding="0" border="0">
                                        <TBODY>
                                        <TR>
                                            <TD style="BACKGROUND: #fff" width="500"><H2
                                                    style="MARGIN-TOP: 10px; FONT-WEIGHT: bold; FONT-SIZE: 14px; MARGIN-LEFT: 0px">
                                                '.trim(get_comment($parent_id)->comment_author).' , Hello!</H2>
                                                <P style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; PADDING-BOTTOM: 0px; MARGIN-LEFT: 0px; LINE-HEIGHT: 12px; PADDING-TOP: 0px">
                                                    您曾在《'.get_the_title($comment->comment_post_ID).'》留言:</P>
                                                <p style="color: #777;border: 1px solid #DDD;padding: 5px 8px 5px 8px;background-color: #FCFCFC;border-radius: 3px 3px 3px 3px;font-size: 12px;line-height: 22px;font-family: Consolas,Courier,minispace,Lucida Console;">
                                                    '.trim(get_comment($parent_id)->comment_content).'
                                                </p>
                                                <P style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; PADDING-BOTTOM: 0px; MARGIN-LEFT: 0px; LINE-HEIGHT: 12px; PADDING-TOP: 0px">
                                                    '.trim($comment->comment_author).'给您的回复:
                                                </P>
                                                <p style="color: #777;border: 1px solid #DDD;padding: 5px 8px 5px 8px;background-color: #FCFCFC;border-radius: 3px 3px 3px 3px;font-size: 12px;line-height: 22px;font-family: Consolas,Courier,minispace,Lucida Console;">
                                                    '.trim($comment->comment_content).'
                                                </p>
                                                您可以点击<a href="'.htmlspecialchars(get_comment_link($parent_id)) .'"
                                                        target="_blank">查看回复的完整內容</a>
                                        </TR>
                                        <TR>
                                            <TD style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 15px; PADDING-TOP: 15px"
                                                colSpan="2"><IMG
                                                    style="DISPLAY: block; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none"
                                                    src="http://a.xnimg.cn/imgpro/mail/edm-hot-line.png"></TD>
                                        </TR>
                                        </TBODY>
                                    </TABLE>
                                    <DIV><IMG
                                            style="DISPLAY: block; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none"
                                            src="http://a.xnimg.cn/imgpro/mail/edm-hot-bg-middleTop.png"></DIV>
                                </TD>
                                <TD style="BACKGROUND: url(http://a.xnimg.cn/imgpro/mail/edm-hot-bg-middleRight.png); WIDTH: 17px"></TD>
                            </TR>
                            </TBODY>
                        </TABLE>
                    </TD>
                </TR>
                <TR>
                    <TD style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 15px; OVERFLOW: hidden; WIDTH: 100%; COLOR: #999; LINE-HEIGHT: 14px; PADDING-TOP: 15px; TEXT-ALIGN: center">
                        这是系统发给<A style="COLOR: #336699; TEXT-DECORATION: none">'.trim(get_comment($parent_id)->comment_author).'</A>的讯息,请勿回复。
                        欢迎再度光临 <a href="'.get_option('home') .'">'.get_option('blogname') .'</a>
                    </TD>
                </TR>
                </TBODY>
            </TABLE>
        </TD>
    </TR>
    </TBODY>
</TABLE>
<style type="text/css">
    body {
        font-size: 14px;
        font-family: arial, verdana, sans-serif;
        line-height: 1.666;
        padding: 0;
        margin: 0;
        overflow: auto;
        white-space: normal;
        word-wrap: break-word;
        min-height: 100px
    }

    td, input, button, select, body {
        font-family: Helvetica, \'Microsoft Yahei\', verdana
    }

    pre {
        white-space: pre-wrap;
        white-space: -moz-pre-wrap;
        white-space: -pre-wrap;
        white-space: -o-pre-wrap;
        word-wrap: break-word
    }

    th, td {
        font-family: arial, verdana, sans-serif;
        line-height: 1.666
    }

    img {
        border: 0
    }

    header, footer, section, aside, article, nav, hgroup, figure, figcaption {
        display: block
    }

    #logo {
        text-align: center;
    }

</style>

说明:

若出现问题,请尝试转换中文标点为英文的。

之前出现乱码,所以用的utf-8编码。

样式来自人人网邮件,

人人网邮件样式

图片素材都打包了,方便以后的本地化:

下载:http://www.400gb.com/file/42884686

http://pan.baidu.com/s/1xjiZ7

参考:http://www.cxsir.com/wordpress-email-style.html