Search code examples
phppluginsyii2tinymce

Show images from tinymce editor in mail

im using a TinyMCE plugin for yii2 by 2amigos.

I need all the content entered within the editor to be sent by email.

It does a great job with background, heading color text as far I have tested.

But with pictures it shows the tag as shown below:

enter image description here

While in the editor it looks good:

enter image description here

My view:

<?php

/* @var $this yii\web\View */

$this->title = 'My Yii Application';
use dosamigos\tinymce\TinyMce;
use yii\helpers\Html;
use yii\widgets\ActiveForm;
use app\models\SendEmailForm;

$model = new SendEmailForm;

?>
<div class="site-index">


    <div class="body-content">

        <div class="row">
            <?php 
                $form = ActiveForm::begin([
                    'id' => 'sendemail-form',
                    'options' => ['class' => ''],
                    'action' => 'site/enviarcorreo'
                ]) 

             ?>

             <?= $form->field($model, 'correo') ?>

             <?= $form->field($model, 'contenido')->widget(TinyMce::className(), [
    'options' => ['rows' => 30],
    'language' => 'es',

    'clientOptions' => [
        'plugins' => [
           "print preview powerpaste casechange importcss tinydrive searchreplace autolink autosave directionality advcode visualblocks visualchars fullscreen image link media mediaembed template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists checklist wordcount tinymcespellchecker a11ychecker imagetools textpattern noneditable help formatpainter permanentpen pageembed charmap quickbars linkchecker emoticons advtable"
        ],
        'toolbar' => "undo redo | bold italic underline strikethrough | fontselect fontsizeselect formatselect | alignleft aligncenter alignright alignjustify | outdent indent |  numlist bullist checklist | forecolor backcolor casechange permanentpen formatpainter removeformat | pagebreak | charmap emoticons | fullscreen  preview print | insertfile image media pageembed template link anchor codesample | a11ycheck ltr rtl",
        'menubar' => false,
        'convert_urls' => false,
        'file_picker_types' => 'image',
    ]
]);?>

<div class="form-group">
        <?= Html::submitButton('Enviar', ['class' => 'btn btn-primary']) ?>
    </div>
             <?php ActiveForm::end() ?>
        </div>

    </div>
</div>

Controller action:

 public function actionEnviarcorreo()
    {
        $model = new \app\models\SendEmailForm;

         if ($model->load(Yii::$app->request->post()) && $model->validate()) 
         {
            Yii::$app->mailer->compose()
             ->setFrom('darknightedm@gmail.com')
             ->setTo($model->correo)
             ->setSubject('Email enviado desde Yii2-Swiftmailer')
             ->setHtmlBody($model->contenido)
             ->send();
         }
    }

What can I do to make this possible?. Thanks for read.

Solution

  • What you are really asking here are two separate questions...

    1. How do I take Base64 binary images from TinyMCE and store them in an appropriate format?
    2. What is the best way to include images in an HTML email?

    How do I take Base64 binary images from TinyMCE and store them in an appropriate format

    TinyMCE has a built in mechanism to address this via its images_upload_url configuration option. There is an entire page in the TinyMCE documentation on how this works:

    https://www.tiny.cloud/docs/advanced/handle-async-image-uploads/

    The net is that you can have TinyMCE send the image files to an endpoint of your choosing and then convert it to whatever format you need. You don't need to keep it as a Base64 binary and it is very rare that you want the Base64 binary as the permanent format.

    As for the other question...

    What is the best way to include images in an HTML email?

    Ultimately, the real question you need to answer is "what is the best way (for my use case) to insert an image in an email". This is a very broad topic that has been answered many times - a little research should lead you to the most common approaches and their pros/cons:

    https://sendgrid.com/blog/embedding-images-emails-facts/ https://www.campaignmonitor.com/blog/how-to/2008/08/embedding-images-in-email/ https://www.quora.com/Whats-the-best-practices-for-embedding-images-into-HTML-emails

    As there are multiple options it really comes down to how the pro/cons of each stack up against your requirements.