WP HTML Mail Anleitung

Kann ich mit diesem Plugin Newsletter versenden?

Nein, dieses Plugin ist dazu gedacht die WordPress E-Mails zu gestalten, nicht um eigene Nachrichten zu versenden.

Wie kann ich den Abstand im Header von Contact Form 7 emails entfernen?

Gehe zu den Contact Form 7 Einstellungen und stelle den E-Mail Typ von HTML auf Text.

WP HTML Mail kümmert sich dann um die HTML Formatierung.

Wie kann ich den HTML Code des E-Mail Headers bearbeiten?

Es gibt einen Filter um diesen Code zu überschreiben. Füge den folgenden Code in die functions.php deines (Child-)Themes: ein:

add_filter('haet_mail_header', function( $header ){
  return 'hello <strong>world</strong>';
});

Natürlich kannst du damit mehr als nur Text ausgeben.

Wie kann ich den HTML Code der Fußzeile anzeigen?

Es gibt einen Filter mit dem du den Footer der E-Mails anpassen kannst. Füge diesen Code in die functions.php deines (Child-)Themes:

add_filter('haet_mail_footer', function( $header ){
  return 'hello <strong>world</strong>';
});

Wie kann ich eigenen CSS Code einfügen?

Du kannst für Desktop und Mobil getrennten CSS Code einfügen.

Füge dazu diesen Code in die functions.php deines (Child-)Themes ein:

add_filter( 'haet_mail_css_desktop', function( $css ){ 
  $css .= '
    h1{
      border-bottom: 2px solid green;
    }
  ';
  return $css;
});
add_filter( 'haet_mail_css_mobile', function( $css ){
  $css .= '
    h1{
      background:red;
    }
  ';
  return $css;
});

Abgerundeter Rahmen um den E-Mail Inhalt.

Ein Beispiel für eigenen CSS Code wäre ein gerundeter Rahmen um den Content. Beachte dabei allerdings, dass manche E-Mail Programme (wie zB die meisten Outlook-Versionen) die Rundung nicht unterstützen und einen eckigen Rahmen anzeigen werden.

add_filter( 'haet_mail_css_desktop', function( $css ){
    $css .= '  
            td.header{
            	border: 1px solid #ddd;
            	border-bottom: none;
            	border-top-left-radius: 10px;
            	border-top-right-radius: 10px;
            }
            td.content{
            	border: 1px solid #ddd;
            	border-top: none;
            	border-bottom: none
            }
            td.footer-text{
            	border: 1px solid #ddd;
            	border-top: none;
            	border-bottom-left-radius: 10px;
            	border-bottom-right-radius: 10px;
            }
        ';
    return $css;
});

 

Wie kann ich den kurzen Vorschau-Text (Preheader) in manchen E-Mail Programmen anpassen?

Füge dazu diesen Code in die functions.php deines (Child-)Themes ein:

add_filter( 'haet_mail_preheader', function( $pre_header, $email ){
  return 'this is my custom preheader';
}, 10, 2 );