alexantr/yii2-tinymce

TinyMCE widget for Yii 2

TinyMCE widget for Yii 2

This extension renders a TinyMCE widget for Yii framework 2.0., _(*1)

, _(*2)

Installation

Install extension through composer:, _(*3)

composer require alexantr/yii2-tinymce

Note: By default, the latest TinyMCE 5 will be installed. But you can install 4.x version manually:, _(*4)

composer require "tinymce/tinymce:^4.8"

Usage

The following code in a view file would render a TinyMCE widget:, _(*5)

<?= alexantr\tinymce\TinyMCE::widget(['name' => 'attributeName']) ?>

Configuring the TinyMCE options should be done using the clientOptions attribute:, _(*6)

<?= alexantr\tinymce\TinyMCE::widget([
    'name' => 'attributeName',
    'clientOptions' => [
        'plugins' => [
            'anchor', 'charmap', 'code', 'help', 'hr',
            'image', 'link', 'lists', 'media', 'paste',
            'searchreplace', 'table',
        ],
        'height' => 500,
        'convert_urls' => false,
        'element_format' => 'html',
        // ...
    ],
]) ?>

If you want to use the TinyMCE widget in an ActiveForm, it can be done like this:, _(*7)

<?= $form->field($model, 'attributeName')->widget(alexantr\tinymce\TinyMCE::className(), [
    'clientOptions' => [
        // ...
    ],
]) ?>

Using presets

To avoid repeating identical configuration in every widget you can create preset in @app/config/tinymce.php. Options from widget's clientOptions will be merged with this configuration., _(*8)

Preset example:, _(*9)

<?php
return [
    'plugins' => [
        'anchor', 'charmap', 'code', 'help', 'hr',
        'image', 'link', 'lists', 'media', 'paste',
        'searchreplace', 'table',
    ],
    'height' => 500,
    'convert_urls' => false,
    'element_format' => 'html',
    'image_caption' => true,
    'keep_styles' => false,
    'paste_block_drop' => true,
    'table_default_attributes' => new yii\web\JsExpression('{}'),
    'table_default_styles' => new yii\web\JsExpression('{}'),
    'invalid_elements' => 'acronym,font,center,nobr,strike,noembed,script,noscript',
    'extended_valid_elements' => 'strong/b,em/i,table[style]',
    // elFinder file manager https://github.com/alexantr/yii2-elfinder
    'file_picker_callback' => alexantr\elfinder\TinyMCE::getFilePickerCallback(['elfinder/tinymce']),
];

You can change default path with presetPath attribute:, _(*10)

<?= alexantr\tinymce\TinyMCE::widget([
    'name' => 'attributeName',
    'presetPath' => '@backend/config/my-tinymce-config.php',
    'clientOptions' => [
        'height' => 1000,
    ],
]) ?>