Did I set the mimetype wrong? or what do I need to do in order to successfully send the email

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}

I'm trying to play around with php, since I'm relatively new to it. I was wondering what do I need to do in order to successfully send an email when the user fills out all the required fields (not shown in this example. Basically if I fill in the fields for "first and last names", "phone number, email, and the message fields" I'm trying to actually send a nice formatted email using html and css to the client (the person whoever is getting the email) But in this case I'm sending the entire html syntax to the user instead of actually sending the "text" that was typed by the user.

 $email_content =

                "

                <!DOCTYPE html>

                <html>

                <head>

                <title>$subject</title>

                <link href="https://fonts.googleapis.com/css?family=Niconne" rel="stylesheet">

                <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

                <link rel="stylesheet" href="https://cdn.iconmonstr.com/1.3.0/css/iconmonstr-iconic-font.min.css">

                <link rel="stylesheet" href="/css/bootstrap-grid.css"> 

                <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">

                </head>



                <body>

                    <div class="container">

                        <div class="row">

                            <div class="col-12 text-center">

                            <a href="https://www.snizzyDragonsTest.com/" target="_blank" class="btn btn-primary ml-auto">Visit Website </a>

                            </div>

                            <br>

                            <br>

                            <br>

                            <div class="col-12 green-color-bg">





                                <p class="text-head" style="font-family: 'Niconne'; "> snizzyDragonsTest</p>



                            </div>

                            <div class="col-12 white-color-bg text-center">

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Name:<span style ="color: #555;">$first $last</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Email: <span style ="color: #555;">$email</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Phone: <span style ="color: #555;">$phone</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Inquiring About: <span style ="color: #555;">$products</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Message: <span style ="color: #555;">$message</span></p>

                            </div>

                            <div class ="col-12 green-color-bg">



                            <div class="footer-copyright text-center  py-3">snizzyDragonsTest &copy;2018 Copyright. All rights reserved.</div>

                            </div>

                        </div>

                    </div>

                </body>

                </html>

                ";















    // Build the email headers.

    $email_headers = "MIME-Version: 1.0" . "rn";

    $email_headers .= "Content-type:text/html;charset=UTF-8" . "rn";



    // Additional headers

    $email_headers .= 'From: $first $last  <$email>' . "rn";







    // Send the email.

    mail($recipient, $subject, $email_content, $email_headers);

OUTPUT(expected output)
enter image description here

OUTPUT(ACTUAL OUTPUT)
enter image description here

edited Nov 16 '18 at 19:49

Ina Plaksin

18713

asked Nov 16 '18 at 18:14

Ibrahim Ayyoub

365

Are email headers case-sensitive? You wrote "Content-type", but it should be "Content-Type".

– Progman
Nov 16 '18 at 18:25

Uhm I tried it, but this time i get no styling and no images which is weird, I dont think its ever accessing the images, and css, because its stored in my computer and not out there online, would that be correct ?

– Ibrahim Ayyoub
Nov 16 '18 at 18:38

1

Correct. You can't use relative URLs for your resources in an email, because there's no root the way there would be in a webpage accessed from a browser. You need to use full, absolute URL paths.

– IceMetalPunk
Nov 16 '18 at 18:41

@IceMetalPunk, so do i go something like snizzyDragonsTest.com/css/styles.css ? like I want to specifically use my css/html/js files

– Ibrahim Ayyoub
Nov 16 '18 at 18:45

If your server is hosted at that URL, yes; be sure to include the protocol as well (http:// or https:// usually).

– IceMetalPunk
Nov 16 '18 at 18:46

|
show 2 more comments

 $email_content =

                "

                <!DOCTYPE html>

                <html>

                <head>

                <title>$subject</title>

                <link href="https://fonts.googleapis.com/css?family=Niconne" rel="stylesheet">

                <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

                <link rel="stylesheet" href="https://cdn.iconmonstr.com/1.3.0/css/iconmonstr-iconic-font.min.css">

                <link rel="stylesheet" href="/css/bootstrap-grid.css"> 

                <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">

                </head>



                <body>

                    <div class="container">

                        <div class="row">

                            <div class="col-12 text-center">

                            <a href="https://www.snizzyDragonsTest.com/" target="_blank" class="btn btn-primary ml-auto">Visit Website </a>

                            </div>

                            <br>

                            <br>

                            <br>

                            <div class="col-12 green-color-bg">





                                <p class="text-head" style="font-family: 'Niconne'; "> snizzyDragonsTest</p>



                            </div>

                            <div class="col-12 white-color-bg text-center">

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Name:<span style ="color: #555;">$first $last</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Email: <span style ="color: #555;">$email</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Phone: <span style ="color: #555;">$phone</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Inquiring About: <span style ="color: #555;">$products</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Message: <span style ="color: #555;">$message</span></p>

                            </div>

                            <div class ="col-12 green-color-bg">



                            <div class="footer-copyright text-center  py-3">snizzyDragonsTest &copy;2018 Copyright. All rights reserved.</div>

                            </div>

                        </div>

                    </div>

                </body>

                </html>

                ";















    // Build the email headers.

    $email_headers = "MIME-Version: 1.0" . "rn";

    $email_headers .= "Content-type:text/html;charset=UTF-8" . "rn";



    // Additional headers

    $email_headers .= 'From: $first $last  <$email>' . "rn";







    // Send the email.

    mail($recipient, $subject, $email_content, $email_headers);

OUTPUT(expected output)
enter image description here

OUTPUT(ACTUAL OUTPUT)
enter image description here

edited Nov 16 '18 at 19:49

Ina Plaksin

18713

asked Nov 16 '18 at 18:14

Ibrahim Ayyoub

365

Are email headers case-sensitive? You wrote "Content-type", but it should be "Content-Type".

– Progman
Nov 16 '18 at 18:25

Uhm I tried it, but this time i get no styling and no images which is weird, I dont think its ever accessing the images, and css, because its stored in my computer and not out there online, would that be correct ?

– Ibrahim Ayyoub
Nov 16 '18 at 18:38

1

Correct. You can't use relative URLs for your resources in an email, because there's no root the way there would be in a webpage accessed from a browser. You need to use full, absolute URL paths.

– IceMetalPunk
Nov 16 '18 at 18:41

@IceMetalPunk, so do i go something like snizzyDragonsTest.com/css/styles.css ? like I want to specifically use my css/html/js files

– Ibrahim Ayyoub
Nov 16 '18 at 18:45

If your server is hosted at that URL, yes; be sure to include the protocol as well (http:// or https:// usually).

– IceMetalPunk
Nov 16 '18 at 18:46

|
show 2 more comments

 $email_content =

                "

                <!DOCTYPE html>

                <html>

                <head>

                <title>$subject</title>

                <link href="https://fonts.googleapis.com/css?family=Niconne" rel="stylesheet">

                <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

                <link rel="stylesheet" href="https://cdn.iconmonstr.com/1.3.0/css/iconmonstr-iconic-font.min.css">

                <link rel="stylesheet" href="/css/bootstrap-grid.css"> 

                <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">

                </head>



                <body>

                    <div class="container">

                        <div class="row">

                            <div class="col-12 text-center">

                            <a href="https://www.snizzyDragonsTest.com/" target="_blank" class="btn btn-primary ml-auto">Visit Website </a>

                            </div>

                            <br>

                            <br>

                            <br>

                            <div class="col-12 green-color-bg">





                                <p class="text-head" style="font-family: 'Niconne'; "> snizzyDragonsTest</p>



                            </div>

                            <div class="col-12 white-color-bg text-center">

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Name:<span style ="color: #555;">$first $last</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Email: <span style ="color: #555;">$email</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Phone: <span style ="color: #555;">$phone</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Inquiring About: <span style ="color: #555;">$products</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Message: <span style ="color: #555;">$message</span></p>

                            </div>

                            <div class ="col-12 green-color-bg">



                            <div class="footer-copyright text-center  py-3">snizzyDragonsTest &copy;2018 Copyright. All rights reserved.</div>

                            </div>

                        </div>

                    </div>

                </body>

                </html>

                ";















    // Build the email headers.

    $email_headers = "MIME-Version: 1.0" . "rn";

    $email_headers .= "Content-type:text/html;charset=UTF-8" . "rn";



    // Additional headers

    $email_headers .= 'From: $first $last  <$email>' . "rn";







    // Send the email.

    mail($recipient, $subject, $email_content, $email_headers);

OUTPUT(expected output)
enter image description here

OUTPUT(ACTUAL OUTPUT)
enter image description here

edited Nov 16 '18 at 19:49

Ina Plaksin

18713

asked Nov 16 '18 at 18:14

Ibrahim Ayyoub

365

 $email_content =

                "

                <!DOCTYPE html>

                <html>

                <head>

                <title>$subject</title>

                <link href="https://fonts.googleapis.com/css?family=Niconne" rel="stylesheet">

                <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

                <link rel="stylesheet" href="https://cdn.iconmonstr.com/1.3.0/css/iconmonstr-iconic-font.min.css">

                <link rel="stylesheet" href="/css/bootstrap-grid.css"> 

                <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">

                </head>



                <body>

                    <div class="container">

                        <div class="row">

                            <div class="col-12 text-center">

                            <a href="https://www.snizzyDragonsTest.com/" target="_blank" class="btn btn-primary ml-auto">Visit Website </a>

                            </div>

                            <br>

                            <br>

                            <br>

                            <div class="col-12 green-color-bg">





                                <p class="text-head" style="font-family: 'Niconne'; "> snizzyDragonsTest</p>



                            </div>

                            <div class="col-12 white-color-bg text-center">

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Name:<span style ="color: #555;">$first $last</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Email: <span style ="color: #555;">$email</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Phone: <span style ="color: #555;">$phone</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Inquiring About: <span style ="color: #555;">$products</span></p>

                                <p class="text-head-email green-text greys-color-bg " style="font-family: 'Roboto';  " >Message: <span style ="color: #555;">$message</span></p>

                            </div>

                            <div class ="col-12 green-color-bg">



                            <div class="footer-copyright text-center  py-3">snizzyDragonsTest &copy;2018 Copyright. All rights reserved.</div>

                            </div>

                        </div>

                    </div>

                </body>

                </html>

                ";















    // Build the email headers.

    $email_headers = "MIME-Version: 1.0" . "rn";

    $email_headers .= "Content-type:text/html;charset=UTF-8" . "rn";



    // Additional headers

    $email_headers .= 'From: $first $last  <$email>' . "rn";







    // Send the email.

    mail($recipient, $subject, $email_content, $email_headers);

OUTPUT(expected output)
enter image description here

OUTPUT(ACTUAL OUTPUT)
enter image description here

php html css web-development-server

edited Nov 16 '18 at 19:49

Ina Plaksin

18713

asked Nov 16 '18 at 18:14

Ibrahim Ayyoub

365

edited Nov 16 '18 at 19:49

Ina Plaksin

18713

asked Nov 16 '18 at 18:14

Ibrahim Ayyoub

365

edited Nov 16 '18 at 19:49

Ina Plaksin

18713

edited Nov 16 '18 at 19:49

Ina Plaksin

18713

edited Nov 16 '18 at 19:49

Ina Plaksin

18713

asked Nov 16 '18 at 18:14

Ibrahim Ayyoub

365

asked Nov 16 '18 at 18:14

Ibrahim Ayyoub

365

asked Nov 16 '18 at 18:14

Ibrahim Ayyoub

365

Are email headers case-sensitive? You wrote "Content-type", but it should be "Content-Type".

– Progman
Nov 16 '18 at 18:25

Uhm I tried it, but this time i get no styling and no images which is weird, I dont think its ever accessing the images, and css, because its stored in my computer and not out there online, would that be correct ?

– Ibrahim Ayyoub
Nov 16 '18 at 18:38

1

Correct. You can't use relative URLs for your resources in an email, because there's no root the way there would be in a webpage accessed from a browser. You need to use full, absolute URL paths.

– IceMetalPunk
Nov 16 '18 at 18:41

@IceMetalPunk, so do i go something like snizzyDragonsTest.com/css/styles.css ? like I want to specifically use my css/html/js files

– Ibrahim Ayyoub
Nov 16 '18 at 18:45

If your server is hosted at that URL, yes; be sure to include the protocol as well (http:// or https:// usually).

– IceMetalPunk
Nov 16 '18 at 18:46

|
show 2 more comments

Are email headers case-sensitive? You wrote "Content-type", but it should be "Content-Type".

– Progman
Nov 16 '18 at 18:25

Uhm I tried it, but this time i get no styling and no images which is weird, I dont think its ever accessing the images, and css, because its stored in my computer and not out there online, would that be correct ?

– Ibrahim Ayyoub
Nov 16 '18 at 18:38

1

Correct. You can't use relative URLs for your resources in an email, because there's no root the way there would be in a webpage accessed from a browser. You need to use full, absolute URL paths.

– IceMetalPunk
Nov 16 '18 at 18:41

@IceMetalPunk, so do i go something like snizzyDragonsTest.com/css/styles.css ? like I want to specifically use my css/html/js files

– Ibrahim Ayyoub
Nov 16 '18 at 18:45

If your server is hosted at that URL, yes; be sure to include the protocol as well (http:// or https:// usually).

– IceMetalPunk
Nov 16 '18 at 18:46

Are email headers case-sensitive? You wrote "Content-type", but it should be "Content-Type".

– Progman
Nov 16 '18 at 18:25

Uhm I tried it, but this time i get no styling and no images which is weird, I dont think its ever accessing the images, and css, because its stored in my computer and not out there online, would that be correct ?

– Ibrahim Ayyoub
Nov 16 '18 at 18:38

Correct. You can't use relative URLs for your resources in an email, because there's no root the way there would be in a webpage accessed from a browser. You need to use full, absolute URL paths.

– IceMetalPunk
Nov 16 '18 at 18:41

@IceMetalPunk, so do i go something like snizzyDragonsTest.com/css/styles.css ? like I want to specifically use my css/html/js files

– Ibrahim Ayyoub
Nov 16 '18 at 18:45

If your server is hosted at that URL, yes; be sure to include the protocol as well (http:// or https:// usually).

– IceMetalPunk
Nov 16 '18 at 18:46

|
show 2 more comments

0

active

oldest

votes

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53343318%2fdid-i-set-the-mimetype-wrong-or-what-do-i-need-to-do-in-order-to-successfully-s%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

0

active

oldest

votes

0

active

oldest

votes

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Ndtyjky