feat: email abstract

src/EmailSender.php

@@ -112,18 +112,26 @@ class EmailSender {
 
     public function send( array $placeholders = [] ) {
         foreach ( $this->get_emails() as $email ) {
-            $content = $this->renderer->render( 'html/' . $email->get_id(), [] );
-            $content = $this->replace_placeholders( $content, $placeholders );
+            $template = $this->get_template( $email, $placeholders );
             if ( $email->get_is_enable() ) {
                 $this->before_wp_mail();
                 wp_mail(
-                    $email->get_recipients(), $email->get_subject(), $this->get_html_content( $content ), $email->get_headers(), $email->get_attachments()
+                    $email->get_recipients(), $email->get_subject(), $this->css_inline( $template ), $email->get_headers(), $email->get_attachments()
                 );
                 $this->after_wp_mail();
             }
         }
     }
 
+    public function get_template( EmailInterface $email, $placeholders = [] ): string {
+        $content = $this->replace_placeholders( $email->get_content(), $placeholders );
+        $output  = $this->renderer->render( 'html/email-header', [] );
+        $output  .= $this->renderer->render( 'html/' . $email->get_id(), [ 'content' => $content ] );
+        $output  .= $this->renderer->render( 'html/email-footer', [] );
+
+        return $output;
+    }
+
     /**
      * @param string $content
      * @param array  $placeholders
@@ -139,10 +147,9 @@ class EmailSender {
      *
      * @return mixed|string
      */
-    private function get_html_content( string $content ): string {
+    private function css_inline( string $content ): string {
         $styles = $this->renderer->render( 'html/styles', [] );
-
-        return HTMLDecorator::style_inline( $content, $styles );
+        $body   = HTMLDecorator::style_inline( $content, $styles );
     }
 
     /**

src/tempates/html/email-footer.php

+<?php
+/**
+ * Email Footer
+ *
+ * This template can be overridden by copying it to yourtheme/woocommerce/emails/email-footer.php.
+ *
+ * HOWEVER, on occasion WooCommerce will need to update template files and you
+ * (the theme developer) will need to copy the new files to your theme to
+ * maintain compatibility. We try to do this as little as possible, but it does
+ * happen. When this occurs the version of the template file will be bumped and
+ * the readme will list any important changes.
+ *
+ * @see https://docs.woocommerce.com/document/template-structure/
+ * @package WooCommerce\Templates\Emails
+ * @version 3.7.0
+ */
+
+defined( 'ABSPATH' ) || exit;
+?>
+															</div>
+														</td>
+													</tr>
+												</table>
+												<!-- End Content -->
+											</td>
+										</tr>
+									</table>
+									<!-- End Body -->
+								</td>
+							</tr>
+						</table>
+					</td>
+				</tr>
+				<tr>
+					<td align="center" valign="top">
+						<!-- Footer -->
+						<table border="0" cellpadding="10" cellspacing="0" width="600" id="template_footer">
+							<tr>
+								<td valign="top">
+									<table border="0" cellpadding="10" cellspacing="0" width="100%">
+										<tr>
+											<td colspan="2" valign="middle" id="credit">
+												<?php echo wp_kses_post( wpautop( wptexturize( apply_filters( 'woocommerce_email_footer_text', get_option( 'woocommerce_email_footer_text' ) ) ) ) ); ?>
+											</td>
+										</tr>
+									</table>
+								</td>
+							</tr>
+						</table>
+						<!-- End Footer -->
+					</td>
+				</tr>
+			</table>
+		</div>
+	</body>
+</html>

src/tempates/html/email-header.php

+<?php
+/**
+ * Email Header
+ *
+ * This template can be overridden by copying it to yourtheme/woocommerce/emails/email-header.php.
+ *
+ * HOWEVER, on occasion WooCommerce will need to update template files and you
+ * (the theme developer) will need to copy the new files to your theme to
+ * maintain compatibility. We try to do this as little as possible, but it does
+ * happen. When this occurs the version of the template file will be bumped and
+ * the readme will list any important changes.
+ *
+ * @see     https://docs.woocommerce.com/document/template-structure/
+ * @package WooCommerce\Templates\Emails
+ * @version 4.0.0
+ */
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit; // Exit if accessed directly
+}
+
+?>
+<!DOCTYPE html>
+<html <?php language_attributes(); ?>>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo( 'charset' ); ?>" />
+		<title><?php echo get_bloginfo( 'name', 'display' ); ?></title>
+	</head>
+	<body <?php echo is_rtl() ? 'rightmargin' : 'leftmargin'; ?>="0" marginwidth="0" topmargin="0" marginheight="0" offset="0">
+		<div id="wrapper" dir="<?php echo is_rtl() ? 'rtl' : 'ltr'; ?>">
+			<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
+				<tr>
+					<td align="center" valign="top">
+						<div id="template_header_image">
+							<?php
+							if ( $img = get_option( 'woocommerce_email_header_image' ) ) {
+								echo '<p style="margin-top:0;"><img src="' . esc_url( $img ) . '" alt="' . get_bloginfo( 'name', 'display' ) . '" /></p>';
+							}
+							?>
+						</div>
+						<table border="0" cellpadding="0" cellspacing="0" width="600" id="template_container">
+							<tr>
+								<td align="center" valign="top">
+									<!-- Header -->
+									<table border="0" cellpadding="0" cellspacing="0" width="100%" id="template_header">
+										<tr>
+											<td id="header_wrapper">
+												<h1><?php echo $email_heading; ?></h1>
+											</td>
+										</tr>
+									</table>
+									<!-- End Header -->
+								</td>
+							</tr>
+							<tr>
+								<td align="center" valign="top">
+									<!-- Body -->
+									<table border="0" cellpadding="0" cellspacing="0" width="600" id="template_body">
+										<tr>
+											<td valign="top" id="body_content">
+												<!-- Content -->
+												<table border="0" cellpadding="20" cellspacing="0" width="100%">
+													<tr>
+														<td valign="top">
+															<div id="body_content_inner">

src/tempates/html/email-styles.php

+<?php
+/**
+ * Email Styles
+ *
+ * This template can be overridden by copying it to yourtheme/woocommerce/emails/email-styles.php.
+ *
+ * HOWEVER, on occasion WooCommerce will need to update template files and you
+ * (the theme developer) will need to copy the new files to your theme to
+ * maintain compatibility. We try to do this as little as possible, but it does
+ * happen. When this occurs the version of the template file will be bumped and
+ * the readme will list any important changes.
+ *
+ * @see     https://docs.woocommerce.com/document/template-structure/
+ * @package WooCommerce\Templates\Emails
+ * @version 4.0.0
+ */
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+// Load colors.
+$bg        = get_option( 'woocommerce_email_background_color' );
+$body      = get_option( 'woocommerce_email_body_background_color' );
+$base      = get_option( 'woocommerce_email_base_color' );
+$base_text = wc_light_or_dark( $base, '#202020', '#ffffff' );
+$text      = get_option( 'woocommerce_email_text_color' );
+
+// Pick a contrasting color for links.
+$link_color = wc_hex_is_light( $base ) ? $base : $base_text;
+
+if ( wc_hex_is_light( $body ) ) {
+	$link_color = wc_hex_is_light( $base ) ? $base_text : $base;
+}
+
+$bg_darker_10    = wc_hex_darker( $bg, 10 );
+$body_darker_10  = wc_hex_darker( $body, 10 );
+$base_lighter_20 = wc_hex_lighter( $base, 20 );
+$base_lighter_40 = wc_hex_lighter( $base, 40 );
+$text_lighter_20 = wc_hex_lighter( $text, 20 );
+$text_lighter_40 = wc_hex_lighter( $text, 40 );
+
+// !important; is a gmail hack to prevent styles being stripped if it doesn't like something.
+// body{padding: 0;} ensures proper scale/positioning of the email in the iOS native email app.
+?>
+body {
+	padding: 0;
+}
+
+#wrapper {
+	background-color: <?php echo esc_attr( $bg ); ?>;
+	margin: 0;
+	padding: 70px 0;
+	-webkit-text-size-adjust: none !important;
+	width: 100%;
+}
+
+#template_container {
+	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1) !important;
+	background-color: <?php echo esc_attr( $body ); ?>;
+	border: 1px solid <?php echo esc_attr( $bg_darker_10 ); ?>;
+	border-radius: 3px !important;
+}
+
+#template_header {
+	background-color: <?php echo esc_attr( $base ); ?>;
+	border-radius: 3px 3px 0 0 !important;
+	color: <?php echo esc_attr( $base_text ); ?>;
+	border-bottom: 0;
+	font-weight: bold;
+	line-height: 100%;
+	vertical-align: middle;
+	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+}
+
+#template_header h1,
+#template_header h1 a {
+	color: <?php echo esc_attr( $base_text ); ?>;
+	background-color: inherit;
+}
+
+#template_header_image img {
+	margin-left: 0;
+	margin-right: 0;
+}
+
+#template_footer td {
+	padding: 0;
+	border-radius: 6px;
+}
+
+#template_footer #credit {
+	border: 0;
+	color: <?php echo esc_attr( $text_lighter_40 ); ?>;
+	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+	font-size: 12px;
+	line-height: 150%;
+	text-align: center;
+	padding: 24px 0;
+}
+
+#template_footer #credit p {
+	margin: 0 0 16px;
+}
+
+#body_content {
+	background-color: <?php echo esc_attr( $body ); ?>;
+}
+
+#body_content table td {
+	padding: 48px 48px 32px;
+}
+
+#body_content table td td {
+	padding: 12px;
+}
+
+#body_content table td th {
+	padding: 12px;
+}
+
+#body_content td ul.wc-item-meta {
+	font-size: small;
+	margin: 1em 0 0;
+	padding: 0;
+	list-style: none;
+}
+
+#body_content td ul.wc-item-meta li {
+	margin: 0.5em 0 0;
+	padding: 0;
+}
+
+#body_content td ul.wc-item-meta li p {
+	margin: 0;
+}
+
+#body_content p {
+	margin: 0 0 16px;
+}
+
+#body_content_inner {
+	color: <?php echo esc_attr( $text_lighter_20 ); ?>;
+	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+	font-size: 14px;
+	line-height: 150%;
+	text-align: <?php echo is_rtl() ? 'right' : 'left'; ?>;
+}
+
+.td {
+	color: <?php echo esc_attr( $text_lighter_20 ); ?>;
+	border: 1px solid <?php echo esc_attr( $body_darker_10 ); ?>;
+	vertical-align: middle;
+}
+
+.address {
+	padding: 12px;
+	color: <?php echo esc_attr( $text_lighter_20 ); ?>;
+	border: 1px solid <?php echo esc_attr( $body_darker_10 ); ?>;
+}
+
+.text {
+	color: <?php echo esc_attr( $text ); ?>;
+	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+}
+
+.link {
+	color: <?php echo esc_attr( $link_color ); ?>;
+}
+
+#header_wrapper {
+	padding: 36px 48px;
+	display: block;
+}
+
+h1 {
+	color: <?php echo esc_attr( $base ); ?>;
+	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+	font-size: 30px;
+	font-weight: 300;
+	line-height: 150%;
+	margin: 0;
+	text-align: <?php echo is_rtl() ? 'right' : 'left'; ?>;
+	text-shadow: 0 1px 0 <?php echo esc_attr( $base_lighter_20 ); ?>;
+}
+
+h2 {
+	color: <?php echo esc_attr( $base ); ?>;
+	display: block;
+	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+	font-size: 18px;
+	font-weight: bold;
+	line-height: 130%;
+	margin: 0 0 18px;
+	text-align: <?php echo is_rtl() ? 'right' : 'left'; ?>;
+}
+
+h3 {
+	color: <?php echo esc_attr( $base ); ?>;
+	display: block;
+	font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
+	font-size: 16px;
+	font-weight: bold;
+	line-height: 130%;
+	margin: 16px 0 8px;
+	text-align: <?php echo is_rtl() ? 'right' : 'left'; ?>;
+}
+
+a {
+	color: <?php echo esc_attr( $link_color ); ?>;
+	font-weight: normal;
+	text-decoration: underline;
+}
+
+img {
+	border: none;
+	display: inline-block;
+	font-size: 14px;
+	font-weight: bold;
+	height: auto;
+	outline: none;
+	text-decoration: none;
+	text-transform: capitalize;
+	vertical-align: middle;
+	margin-<?php echo is_rtl() ? 'left' : 'right'; ?>: 10px;
+	max-width: 100%;
+}
+<?php