froala / wysiwyg-cake

CakePHP Plugin for Froala Javascript WYSIWYG Rich Text Editor.

Froala WYSIWYG Editor Plugin for CakePHP 3

CakePHP Plugin for Froala Javascript WYSIWYG Text Editor. For CakePHP >=3.0.

See froala/wysiwyg-cake2 for CakePHP version 2.

About

The purpose of placing Froala WYSIWYG Editor in a plugin is to keep it separate from a themed view, the regular webroot or the app in general, which makes it easier to update and overall follows the idea of keeping the code clean and modular.

Installation

To use Froala WYSIWYG Editor you need to clone git repository:

git clone git://github.com/froala/wysiwyg-cake.git Plugin/Froala

Or if your CakePHP application is setup as a git repository, you can add it as a submodule:

git submodule add git://github.com/froala/wysiwyg-cake.git Plugin/Froala

Or open terminal/command prompt (windows) type composer require froala/wysiwyg-cake

Alternatively, you can download an archive from the master branch on Github and extract the contents to Froala plugin.

Make sure that you load the plugin routes by adding to your bootstrap file(bootstrap.php) in config folder:

Plugin::loadAll(); or Plugin::load('Froala'); This will load all plugins at once or only the Froala plugin.

Usage

The Froala helper is basically just a convenience helper that allows you to use php and CakePHP conventions to generate the configuration for Froala and as an extra it allows you to load configs.

// Loads Froala Editor javascript also will load all the plugins and css for the plugins
<?= $this->Froala->plugin();?>

// Will target one specific html selector on which the editor will be init.
// Second paramenter is mix can be array/object of options that the Froala Editor will take.

<?= $this->Froala->editor('#froala', array('option' => value));?>

How to use the helper

Since CakePHP 3.0 it is necessary to activate the plugin in your application. To do so, edit app/Config/bootstrap.php and add the line CakePlugin::load('Froala'); at the bottom. If you already have CakePlugin::loadAll(); to auto-load all plugins then you may skip this step.

Wherever you want to use it, load it in the controller

open AppController.php (your project/src/controller/AppController) Declare variable public $helpers = array('Froala.Froala');

class AppController extends Controller
{
	...
	
	public $helpers = array('Froala.Froala');
	
	...
}

In the view page (template) add

<?= $this->Froala->editor('#froala-editor'');?>

This is a simple init example with no options for the Froala Editor. Include the below statement in your view template to integrate the plugins in your editor

$this->Froala->plugin();
$this->Froala->editor('selector');

This will instruct Froala to convert the matched element on the page to Froala editor.

A complete list of Froala configuration options are on the website.

Default options

If you want a quick way to configure default values for all the Froala Editors of an application, you could use the 'Froala.editorOptions' configuration.

Here is an example of a line you could have in bootstrap.php:

Configure::write('Froala.editorOptions', array('height' => '300px'));

It will make all editors to have a 300px height and apply line braker tags. You may want to override this value for a single editor. To do so, just pass the option to the editor() method and it will override the default value.

Usage examples

Example of init using array of options

// '#comment'  Represents the html element selector.
// 'array()'   Represents the list of options that are passed to the editor.

$this->Froala->editor('#comment', array('minHeight => '200px', 'maxHeight' => '400px'));
                  

Requirements

• PHP version: PHP 5.2+

License

The CakePHP Froala WYSIWYG Editor project is under MIT license. However, in order to use WordPress Froala WYSIWYG Editor plugin you should purchase a license for it.

Froala Editor has 3 different licenses for commercial use. For details please see License Agreement.

wysiwyg-cake's Issues

Wrong namespace in the FroalaController

Hi,

please fix the right namespace for the FroalaController at:

vendor\froala\wysiwyg-cake\src\Controller\FroalaController.php

line 2, replace:
namespace App\Controller;
by :
namespace Froala\Controller;

thx;

best regards.

Ability to load in block or on page load event

I have load jQuery and many other scripts at the end of my page. It's a good parctice to speed up page being ready for user.
So i need to run all scripts wrapped in

window.onload = function(){
};

block.

this can be quickly implemented if editor() and plugin() methods will pass options to CakePHP HtmlHelper methods used.

Composer install falling because a composer.json typo

On composer.json require's FontAwesome like this:
"fontawsome/font-awesome": ">=4.4.0"
But the correct is:
"fortawesome/font-awesome":">=4.4.0"

cake4

cakePHP4 is online and pretty much compatible to cake greater than 3.5 .. I am pretty sure that this would run with cake4, so could you please adjust the composer settings?!

Thank you

Awesome plugin. Keep going :)

image uploads

how do you manage the image uploads?

Froala namespace

namespace must be a Froala\Controller instead of App\Controller

Also i believe it must extend Controller insead of AppController

Cakephp 3 - Install error

Hello guys,

i use the following command in the main project folder (C:\xampp\htdocs\projectous)
git clone git://github.com/froala/wysiwyg-cake.git Plugin/Froala

After git the plugin, i'm trying to load it, in the bootstrap.php.

Plugin::load('Froala', ['bootstrap' => true]);

So, i receive the following error ..

The tutorial is a little bit confusing, can anyone help me please?

Thanks, in advance.

Peter