Skip to content

Instantly share code, notes, and snippets.

@dungphanxuan
Last active August 23, 2017 03:59
Show Gist options
  • Save dungphanxuan/07583901947a1ac1faeff7b1202a7281 to your computer and use it in GitHub Desktop.
Save dungphanxuan/07583901947a1ac1faeff7b1202a7281 to your computer and use it in GitHub Desktop.
Yii2 Froala Editor Widget

Config example for Yii 2 Froala Widget

Usage with ActiveForm and model

View

<?php
    echo $form->field($model, 'body')->widget(
        \froala\froalaeditor\FroalaEditorWidget::className(),
        [
            'options'         => [
            ],
            'csrfCookieParam' => '_csrf',
            'clientOptions'   => [
                'toolbarInline'       => false,
                'height'              => 350,
                'imageDefaultWidth'   => 1000,
                'theme'               => 'royal',
                'language'            => 'en_gb',
                //'toolbarButtons' => ['fullscreen', 'bold', 'italic', 'underline', '|', 'paragraphFormat', 'insertImage'],
                'imageUploadURL'      => Url::to(['/file-storage/upload-froala']),
                'fileUploadURL'       => Url::to(['/file-storage/upload-froala']),
                'imageManagerLoadURL' => Url::to(['/file-storage/file-froala'])
            ],
            //'clientPlugins' => [ 'fullscreen', 'paragraph_format', 'image', 'file', 'image_manager' ]
        ]
    )
    ?>

Controller Upload Image

Config with Yii 2 File Kit (https://github.com/trntv/yii2-file-kit)

/*
    * Action Upload File For Froala WYSIWYG HTML Editor
    *
    * @param file $file
    *
    * @return file infor
    * */
    public function actionUploadFroala()
    {
        // Get file link
        $fileName = 'file';
        $logoFile = UploadedFile::getInstanceByName($fileName);
        $filePath = Yii::$app->fileStorage->save($logoFile);
        $baseUrl = Yii::$app->fileStorage->baseUrl;

        $imageUrl = $baseUrl . '/' . $filePath;
        $res = ['link' => $imageUrl];

        // Response data
        Yii::$app->response->format = Yii::$app->response->format = Response::FORMAT_JSON;

        return $res;
    }

Controller For List Image

/*
     * List Image 
     * */
    public function actionFileFroala()
    {
        $dataFileItem = FileStorageItem::find()
            ->limit(10)
            ->all();
        $dataImage = [];
        /** @var FileStorageItem $item */
        foreach ($dataFileItem as $item) {
            if (Yii::$app->fileStorage->getFilesystem()->has($item->path)) {
                $dataDetail = [];
                $dataDetail['url'] = $item->base_url . '/' . $item->path;
                $dataImage [] = $dataDetail;
            }
        }

        $res = $dataImage;
        // Response data
        Yii::$app->response->format = Yii::$app->response->format = Response::FORMAT_JSON;

        return $res;
    }

Result

http://prntscr.com/gbwki8

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment