افزودن CSS دلخواه به ایمیل های ارسالی ووکامرس

برای اعمال و افزودن CSS دلخواه به ایمیل های ارسالی ووکامرس کافیست کد زیر به فایل فانکشن قالب وب سایت خود اضافه کنید و استایل های مد نظر خود را در ادامه کد درج نمایید. دقت کنید که این استایل به تمامی ایمیل های ارسالی ووکامرس اعمال می شود.

/**
 * @snippet    Add CSS to WooCommerce Emails
 * @Source     https://wpwave.ir/
 */
 
add_filter( 'woocommerce_email_styles', 'wpwave_add_css_to_emails', 9999, 2 );
 
function wpwave_add_css_to_emails( $css, $email ) { 
   $css .= '
      h2 { color: red }
      h3 { font-size: 30px }
   ';
   return $css;
}

آموزش ویرایش فایل فانکشن وردپرس [Function.php]

در صورتی که می خواهید استایل مورد نظر صرفاً به یکی از ایمیل های ارسالی اعمال شود می بایست در کد ID ایمیل را نیز مشخص کنید. بنابراین می توانید از کد زیر استفاده نمایید.

/**
 * @snippet    Add CSS to WooCommerce Emails
 * @Source     https://wpwave.ir/
 */
 
add_filter( 'woocommerce_email_styles', 'bbloomer_add_css_to_new_order_email', 9999, 2 );
 
function bbloomer_add_css_to_new_order_email( $css, $email ) { 
   if ( $email->id == 'new_order' ) {
      $css .= '
         h2 { color: red }
         h3 { font-size: 30px }
      ';
   }
   return $css;
}

در کد بالا بجای if ( $email->id == ‘new_order’ ) می توانید از ID های دیگر استفاده کنید. لیست ID ایمیل های ووکامرسی را در ادامه مشاهده خواهید کرد.

if ( $email->id == 'cancelled_order' )
if ( $email->id == 'customer_completed_order' ) 
if ( $email->id == 'customer_invoice' ) 
if ( $email->id == 'customer_new_account' ) 
if ( $email->id == 'customer_note' ) 
if ( $email->id == 'customer_on_hold_order' ) 
if ( $email->id == 'customer_refunded_order' ) 
if ( $email->id == 'customer_reset_password' ) 
if ( $email->id == 'failed_order' ) 
if ( $email->id == 'new_order' )