Adding style to a php html email

Question

I looked all over for this question and all I found on this was to add the following:

$headers  = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";

and

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

I am wanting to send a newsletter type email, so the styling really matters for this. All of the videos I watched were just making html sheets, so I really didn't get that. I want to style the content in my email.

I have this right now:

$to = $newsletter_email;
        $subject = 'Thank you for subscribing';
        $message = '
            <html>
            <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
                <title></title>
            <style>
                #email-wrap {
                background: #151515;
                color: #FFF;
                }
            </style>
            </head>
            <body>
                <div id="email-wrap">
                <p>Hi,</p><br>
                <p>Thank you.</p><br>
                <p>Thank you,</p>
                <p>Administration</p>
                </div>
            </body>
            </html>
                ';

                $from = "[email protected]";
                //$Bcc = "[email protected]";

                // To send HTML mail, the Content-type header must be set
                $headers  = 'MIME-Version: 1.0' . "\r\n";
                $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";

                // Additional headers
                $headers .= 'To: ' .$to. "\r\n";
                $headers .= 'From: ' .$from. "\r\n";
            //  $headers .= 'Bcc: '.$Bcc. "\r\n";

                // Send the email
                mail($to,$subject,$message,$headers);

I have tried taking out the style from this message variable and turning this file into a html styled file, outside of the php:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Newsletter</title>
<style>
#email-wrap {
    background: #151515;
    color: #FFF;
}
</style>
</head>

etc.

The email actually sends, but I cannot figure out how to add style to this. What am I doing wrong??

            $email_from = "[email protected]";

            $full_name = 'Company Name';
            //$from_mail = $full_name.'<'.$email_from.'>';
            $from = $from_mail;

            //$from = "[email protected]";
            //$Bcc = "[email protected]";

            // To send HTML mail, the Content-type header must be set
            $headers .= "From: ".$full_name." <".$email_from.">\r\n";
            and $headers .= "Return-Path: ".$full_name." <".$email_from.">\r\n";
            /*$headers = "" .
                       "Reply-To:" . $from . "\r\n" .
                       "X-Mailer: PHP/" . phpversion();*/
            $headers  = 'MIME-Version: 1.0' . "\r\n";
            $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";

            // Additional headers
            $headers .= 'To: ' .$to. "\r\n";
            $headers .= 'From: ' .$from_email. "\r\n";
        //  $headers .= 'Bcc: '.$Bcc. "\r\n";

            // Send the email
            mail($to,$subject,$message,$headers);

Be aware that your code (and all the posted answers) is vulnerable to header injection attacks, possibly others, and will not encode email contents correctly. Don't roll your own email code, you'll do it wrong, as all this demonstrates; use a library like PHPMailer that you tagged this question with. — Synchro
– Synchro, Commented Feb 27, 2016 at 12:50
Your charsets should agree - you're setting UTF-8 in the HTML, but ISO-8859-1 in the message headers; you can't have both at once - it will break as soon as you have non-ascii text — Synchro
– Synchro, Commented Feb 27, 2016 at 12:52

Peter Wilson · Accepted Answer · 2016-02-27 12:33:59Z

7

You need to use inline style to get it works on your email

    $to = $newsletter_email;
    $subject = 'Thank you for subscribing';
    $message = '
        <html>
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title></title>
        </head>
        <body>
            <div id="email-wrap" style='background: #151515;color: #FFF;'>
            <p>Hi,</p><br>
            <p>Thank you.</p><br>
            <p>Thank you,</p>
            <p>Administration</p>
            </div>
        </body>
        </html>
            ';

            $from = "[email protected]";
            //$Bcc = "[email protected]";

            // To send HTML mail, the Content-type header must be set
            $headers  = 'MIME-Version: 1.0' . "\r\n";
            $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";

            // Additional headers
            $headers .= 'To: ' .$to. "\r\n";
            $headers .= 'From: ' .$from. "\r\n";
        //  $headers .= 'Bcc: '.$Bcc. "\r\n";

            // Send the email
            mail($to,$subject,$message,$headers);

For the second part of your question you can use something like this

$to = '[email protected]';
$email_from = "[email protected]";

$full_name = 'Best Buy';
$from_mail = $full_name.'<'.$email_from.'>';
$from = $from_mail;
$headers = "" .
           "Reply-To:" . $from . "\r\n" .
           "X-Mailer: PHP/" . phpversion();
$headers .= 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n"; 
$headers .= 'From: ' . $from_email . "\r\n";       
mail($to,$subject,$message,$headers);

edited Feb 27, 2016 at 12:33

answered Feb 27, 2016 at 9:13

Peter Wilson

4,3175 gold badges40 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

13 Comments

Ralph Over a year ago

Do you know why my name is coming up as newsletter when sending this? I assumed it was because of my header. So I tried doing this $headers .= 'From: Company'"\r\n"; and it breaks the code

Peter Wilson Over a year ago

@Ralph do you mean it appears as newsletter instead of [email protected]

Ralph Over a year ago

No, when you go into gmail or whatever mail client you use, next to the subject line, where it shows who the email is from, mine says newsletter. I am wanting it to say my Company Name. So if I was Best Buy, I would want it to say Best Buy.

symlink Over a year ago

I believe the from param in a PHP header is looking for an email address.

Peter Wilson Over a year ago

You need to Change you variable $from to be $from = "Best Buy"; instead of $from = "[email protected]";

|

Ankit vadariya · Accepted Answer · 2016-02-27 09:34:08Z

Just try to make it like template.

Here is the little bit example may be helpful.

Create my_template.html file & add following code in that file.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Newsletter</title>
<style>
#email-wrap {
    background: #151515;
    color: #FFF;
}
</style>
</head>
<body>
<p>Hi {{USERNAME}}</p>
<p>Please click on below link </p><br>
{{LINK}}
</body>
</html>

now Write send email function where you want. and follow the step :

1) Read HTML file you recently created.

$html = file_get_contents('my_template.html');

2) Replace Variables

$link = "<a href='LINK YOU WANR TO PLACE'>Click Here </a>";
$html =  str_replace("{{USERNAME}}",$username,$html);
$html =  str_replace("{{LINK}}",$link,$html);

3) Finally send email.

            $from = "[email protected]";
            $headers .= 'To: ' .$to. "\r\n";
            $headers .= 'From: ' .$from. "\r\n";
            $headers .= 'Bcc: '.$Bcc. "\r\n";

            // Send the email
            mail($to,$subject,$html,$headers);

bhrached · Accepted Answer · 2016-02-27 09:16:05Z

1

Indeed, the emails that you send will be opened in different ways, either through an email client installed on the machine that will integrate an HTML rendering engine propriéaitre, or an online e-mail client that will your emails in a rather special roping and withdraw some HTML attributes. The table proposed by Campaign Monitor gives you a very quick overview of the extent of damage and we note that, according to the email clients, rules are completely different.
link : https://www.campaignmonitor.com/css/
However there are tools such as inline-gulp-css that can turn your HTML styles making them "online".
link : https://www.npmjs.com/package/gulp-inline-css

answered Feb 27, 2016 at 9:16

bhrached

1371 silver badge9 bronze badges

Comments

Omari Victor Omosa · Accepted Answer · 2016-02-27 09:16:20Z

-1

TRY

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>


</head>
<body>
                <div style="background:#151515; color: #FFF;">
                <p>Hi,</p><br>
                <p>Thank you.</p><br>
                <p>Thank you,</p>
                <p>Administration</p>
                </div>
</body>
</html>

answered Feb 27, 2016 at 9:16

Omari Victor Omosa

2,8794 gold badges27 silver badges51 bronze badges

Collectives™ on Stack Overflow

Adding style to a php html email

4 Answers 4

13 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

13 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related