首页 > 解决方案 > 如何使用 bootstrap-4 以自定义设计在电子邮件正文中发送消息?

问题描述

我正在尝试使用 CodeIgniter-4 框架通过 smtp 发送消息。为此,我使用 bootstrap-4 设计了一个卡片作为消息体,并希望将此消息发送给接收者。我可以成功发送此消息,但该消息在设计时不可见。Bootstrap-4 类不工作。

我想如何显示接收者:

在此处输入图像描述

接收者如何看到它: 在此处输入图像描述

我认为 Bootstrap-4 的 CDN 文件在邮件中不可用,这就是设计不起作用的原因。你能帮我用同样的定制设计通过电子邮件发送吗?

让我向您展示我的代码:

电子邮件.php 文件:

namespace Config;
use CodeIgniter\Config\BaseConfig;

class Email extends BaseConfig

{

/**
 * @var string
 */
public $fromEmail;

/**
 * @var string
 */
public $fromName;

/**
 * @var string
 */
public $recipients;

/**
 * The "user agent"
 *
 * @var string
 */
public $userAgent = 'CodeIgniter';

/**
 * The mail sending protocol: mail, sendmail, smtp
 *
 * @var string
 */
public $protocol = 'smtp';

/**
 * The server path to Sendmail.
 *
 * @var string
 */
public $mailPath = '/usr/sbin/sendmail';

/**
 * SMTP Server Address
 *
 * @var string
 */
public $SMTPHost = 'smtp.office365.com';

/**
 * SMTP Username
 *
 * @var string
 */
// Enter your email id from where you send email
public $SMTPUser = 'exampleMail@gmail.com';


/**
 * SMTP Password
 *
 * @var string
 */
// Enter your email's password
public $SMTPPass = 'myPassword';

/**
 * SMTP Port
 *
 * @var integer
 */
public $SMTPPort = 587;

/**
 * SMTP Timeout (in seconds)
 *
 * @var integer
 */
public $SMTPTimeout = 60;

/**
 * Enable persistent SMTP connections
 *
 * @var boolean
 */
public $SMTPKeepAlive = false;

/**
 * SMTP Encryption. Either tls or ssl
 *
 * @var string
 */
public $SMTPCrypto = 'tls';

/**
 * Enable word-wrap
 *
 * @var boolean
 */
public $wordWrap = true;

/**
 * Character count to wrap at
 *
 * @var integer
 */
public $wrapChars = 76;

/**
 * Type of mail, either 'text' or 'html'
 *
 * @var string
 */
public $mailType = 'html';

/**
 * Character set (utf-8, iso-8859-1, etc.)
 *
 * @var string
 */
public $charset = 'UTF-8';

/**
 * Whether to validate the email address
 *
 * @var boolean
 */
public $validate = false;

/**
 * Email Priority. 1 = highest. 5 = lowest. 3 = normal
 *
 * @var integer
 */
public $priority = 3;

/**
 * Newline character. (Use “\r\n” to comply with RFC 822)
 *
 * @var string
 */
public $CRLF = "\r\n";

/**
 * Newline character. (Use “\r\n” to comply with RFC 822)
 *
 * @var string
 */
public $newline = "\r\n";

/**
 * Enable BCC Batch Mode.
 *
 * @var boolean
 */
public $BCCBatchMode = false;

/**
 * Number of emails in each BCC batch
 *
 * @var integer
 */
public $BCCBatchSize = 200;

/**
 * Enable notify message from server
 *
 * @var boolean
 */
public $DSN = false;
}

控制器:

namespace App\Controllers;
use App\Models\FormModel;
use CodeIgniter\Controller;

class SendMail extends Controller
{

    function check() { 
      $data['title']="Mail";
      echo view('template/header.php',$data);

        $to = 'exampleMail@gmail.com';
        $subject = 'Vehicle Management System';
        $username='Monayem';
        $approver='First Approver';
        $requestId=12;

         $message="<div class='conatiner w-50'>"."<div class='card'>"."<div class='card-header root_bg_color text-white text-center'>"."Vehicle Management System"."</div>"."<div class='card-body'>"."Dear ".$username.", "."<br><br>"."Your vehicle request( ".$requestId." ) is approved by ".$approver."."."Please visit  "."<a href='http://10.12.8.8:8000/vms/public/index.php/Login'>Vehicle Management System</a> to see details."."<br><br>"."Thank You for being with Us"."</div>"."<div class='card-footer root_bg_color'></div>"."</div>"."</div>";

        
        $email = \Config\Services::email();

        $email->setTo($to);
        $email->setFrom('examplemail@gmail.com', 'Vehicle Management System');
        
        $email->setSubject($subject);
        $email->setMessage($message);

        if ($email->send()) 
         {
            echo 'Email successfully sent';
         } 
        else 
         {
            $data = $email->printDebugger(['headers']);
            print_r($data);
        }
   
        echo view('template/footer.php');
    }
}

标签: bootstrap-4smtpemail-attachmentscodeigniter-4

解决方案


仅从引导程序编写类并不能使其具有神奇的风格。

您必须包含来自源服务器的 css 和 javascript,例如 cdnjs。

另一方面,如果最终用户未启用 javascript 执行,则通过消息正文发送 javascript 将显示为文本。将 javascript 发送到电子邮件正文是一种不好的做法。

我会选择样式而不是引导程序,并将您的样式包含在style标签中 有数百个示例创建样式卡片和仅使用 css 的非常酷的电子邮件正文。例如: 酷电子邮件正文


推荐阅读