So senden Sie eine interaktive E-Mail

Ich versuche, eine interaktive E-Mail an meine Kunden zu senden. Im unteren Code content.html Seite enthält den Inhalt der E-Mail-Körper, die nur die HTML-und CSS enthält. sendmail.php sendet die E-Mail an die E-Mail-Adresse des Empfängers.So senden Sie eine interaktive E-Mail

E-Mail wird erfolgreich von der sendmail.php gesendet, aber in der E-Mail funktioniert der HTML-Text nicht wie erwartet.

Körper der E-Mail sollten wie in diesem Beispiel funktionieren: https://codepen.io/freshinbox/pen/worqww

Aber die E-Mail, da dies anzuzeigen:

ich mit beiden gmail und hotmail Konten versucht, aber das Ergebnis ist das gleiche.

content.html

<html> 
<head> 
<style> 
.keybox{ 
display:inline-block; 
border:10px solid black; 
} 
.keybox label{ 
width:65px; 
height:55px; 
display:none; 
padding-top:5px; 
font-size:40px; 
text-align:center; 
} 
#key1a:checked ~ .kinetic .box1 label:nth-child(2){ 
display:block; 
} 
#key1b:checked ~ .kinetic .box1 label:nth-child(3){ 
display:block; 
} 
#key1c:checked ~ .kinetic .box1 label:nth-child(4){ 
display:block; 
} 
#key1d:checked ~ .kinetic .box1 label:nth-child(1){ 
display:block; 
} 
</style> 


</head> 
<body> 

<input id="key1a" name="key1" type=radio> 
<input id="key1b" name="key1" type=radio> 
<input id="key1c" name="key1" type=radio> 
<input id="key1d" name="key1" type=radio checked><BR> 
<div class="kinetic"> 
<div class="keybox box1"> 
    <label for="key1a">X</label> 
    <label for="key1b">G</label> 
    <label for="key1c">H</label> 
    <label for="key1d">A</label> 
</div> 
</div>  
</body> 
</html>

sendmail.php

<?php 
if(($Content = file_get_contents("content.html")) === false) { 
    $Content = ""; 
} 

$FromName = "Sample"; 
$FromEmail = "[email protected]"; 
$ReplyTo = "[email protected]"; 
$ToEmail = "[email protected]"; 
$Subject = "Test"; 

$Headers = "MIME-Version: 1.0\n"; 
$Headers .= "Content-type: text/html; charset=iso-8859-1\n"; 
$Headers .= "From: ".$FromName." <".$FromEmail.">\n"; 
$Headers .= "Reply-To: ".$ReplyTo."\n"; 
$Headers .= "X-Sender: <".$FromEmail.">\n"; 
$Headers .= "X-Mailer: PHP\n"; 
$Headers .= "X-Priority: 1\n"; 
$Headers .= "Return-Path: <".$FromEmail.">\n"; 

if(mail($ToEmail, $Subject, $Content, $Headers) == false) { 
    echo "ERRRO!"; 
} 
else{ 
    echo "OK!"; 
} 
?>

Quelle

2017-07-18 chalitha geekiyanage

Sie können in E-Mails keine eingebetteten oder eingebetteten Stylesheets verwenden. Sie müssen es inline haben. Angesichts Ihrer Sachen können Sie auf diese Weise keine interaktiven Inhalte senden. –

Verwenden Sie 'inline-css', um Styling in Ihrem HTML hinzuzufügen. Sie können CSS nicht so verwenden, wenn Sie E-Mails senden. –

@PraveenKumar sehen [this] (https://www.emailonacid.com/blog/article/email-development/code-tutorial-how-to-build-an-interactive-puzzle-in-email?utm_referrer=freshinbox .com) Beispiel. Sie sagen, dass wir interaktive E-Mails senden können. –

Einige Browser einige der CSS-Regeln nicht unterstützen Sie verwendet haben, zum Beispiel:

Google Mail und Outlook unterstützen beide ~ oder :nth-child nicht.

Es gibt einen guten CSS-Unterstützung Guide hier: https://www.campaignmonitor.com/css/

Obwohl dieses Diagramm nicht sagen - ich bin ziemlich sicher, dass Google Mail und Outlook auch nicht :checked unterstützen.

Einige Browser können Sie diese Regeln verwenden, aber es sei denn, Sie bewusst eine bestimmte Gruppe von Benutzern mit einer bestimmten E-Mail-Client-Targeting, gibt es keine sichere Möglichkeit, es richtig zu bekommen für jeden.

Quelle

2017-07-18 08:42:03 Albzi

Ha! Ich suchte nach diesem Link ... Und du hast gepostet. –

@Albzi können Sie mir bitte diesen Wok machen oder gibt es Tutorials, die ich folgen kann, um interaktive E-Mails für jeden E-Mail-Client zu senden –

@chalithageekiyanage Leider sehen Sie, wenn Sie das Diagramm im Link betrachten, dass nicht jeder Browser unterstützt alle Regeln in CSS. E-Mails waren schon immer ein Kampf und leider können Sie keine interaktive E-Mail erstellen, die auf jedem Client funktioniert. – Albzi

So senden Sie eine interaktive E-Mail

Antwort

Verwandte Themen