TinyMCE Image Uploader & Manager

Image manager files

Extract the plug-in zip package into your TinyMCE /plugins directory. It should create a /lioniteimages directory - if not, move the files manually into that directory (/plugins/lioniteimages).

Add the image manager to the TinyMCE configuration

The plug-in name is 'lioniteimages' and needs to be added to the plug-in list:

tinyMCE.init({
    ...
    plugins : "bold,italic,underline,strikethrough,|,lioniteimages",
    ...
});

Image manager configuration

The image manager is packaged with a PHP connector which needs to be configured for the directory structure of your application. If you are using a different server-side language, you will need to port the connector to your language to use the plug-in.

To change the configuration, edit the config.php file that's inside /lioniteimages/connector/php:

// The URL that points to the upload folder on your site. 
// Can be a relative or full URL (include the protocol and domain)
$imageURL = '/demos/http/uploads';

// Full upload system path. Make sure you have write permissions to this folder
$uploadPath = '/var/www/demos/http/uploads';

The image URL value would be used in the HTML 'src' attribute of inserted images, so change it accordingly. Depending on your application, you might separate directories for different users. You can add a dynamic part to the directory names based on user identifier. For example:

$userId = Auth::getId();
$imageURL = '/uploads/' . $userId;
$uploadPath = '/var/www/project/public/uploads/' . $userId;

Authentication

In some cases you want to limit access to image management. Implement your authentication logic inside the isAuth() function.

function isAuth() {
    //Perform your own authorization to make sure user is allowed to upload
    return true; //Return true when authenticated, false when denied
}

I cannot upload images

Make sure the value of the upload path parameter is correct and that you have permissions to write to the target directory. Also, in case you have URL rewriting that is affecting the folder containing the plugin, you need to allow requests to reach the connector by disabling rewriting inside the plugin folder (or any folder above it).

Images do not appear when inserted into the editor

Make sure that your image URL value is correct. It should be a publicly accessible directory under your document root folder. Also, if you have URL rewriting enabled (such as Apache's mod-rewrite), you might need to disable it inside the directory (using an .htaccess file with the directive 'RewriteEngine off' in Apache).

Changing styles and markup

The plugin styles are located in the /css/styles.css file. You can control the basic look of the plug-in from there. If you want to perform more extensive changes and add / change markup, you can edit the lioniteimages.htm file. Please make sure to leave existing classes as the Javascript functionality depends on it.

Changing images

All the icons (including the TinyMCE interface icon) are located inside the /img directory. The plugin icon used is taken from the famfamfam icon pack (/img/icon.png).

The plug-in is provided with a PHP connector. To use the plug-in with other server-side languages, you will need to translate the PHP connector scripts to your required language. If you are willing to contribute your code back to the component, I will reimburse your license fee via Paypal (even if you purchased the sublicesnable license).

Connector scripts

There are four connector scripts included with the plug-in:

• config.php - Directory configuration and authentication logic
• upload.php - Upload handling and thumbnail generation
• gallery.php - Gallery generation script. Reads all uploaded files from the configured directory and builds a list of images.
• remove.php - Image removal