elFinder Picker

Enable your website users to select files using elFinder File Browser. You can also use this tool as a file picker module for tinyMCE editor

Demo

Coming soon

Dependencies

• jQuery
• elFinder

Installation

Bower

Run bower install elfinder-picker

Manual Install

Downoad elFinder Picker

Add to Project

Add elFinder Picker to your project

<script src="/path/to/elFinderPicker.js"></script>
<link type="text/css" rel="stylesheet" href="/path/to/elFinderPicker.css">

Configure elFinder Picker as shown

<script>elFinderPicker.config( { url: "path/to/elfinder.html" })</script>

Configure elFinder

{
	url : '/path/to/elfinder/connector.php', 
	getFileCallback : function(file, fm) {
		parent.elFinderPicker.oninsert(file, fm);
	}
}

Usage

Using elFinder Picker Directly

elFinderPicker.open( callback ) The callback function takes two arguments:

Example

<button onclick="elFinderPicker.open( function( url, info ){  $("#input").val( url ) } )">Pick File</button>

TinyMCE Integration

tinymce.init({
	selector: '.text-editor',
	height: 350,
	plugins: [ ],
	file_picker_callback: elFinderPicker.open,
});