Skip to content
Naoki Sawada edited this page Apr 14, 2016 · 23 revisions

Minimal setup

  1. Download and unzip one of the releases below to your PHP server
  2. Rename /php/connector.minimal.php-dist to /php/connector.minimal.php
  3. Load /elfinder.html in your browser to run elFinder

Configuration explained

jQuery and jQuery UI

jQuery >= 1.8.0, jQuery UI >= 1.9.1 are required. If you use custom jQuery UI build than make sure selectable, draggable, droppable, resizable, dialog and slider are included.

<link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

elFinder

Include elFinder CSS and JS files.

<link rel="stylesheet" type="text/css" media="screen" href="css/elfinder.min.css">
<script type="text/javascript" src="js/elfinder.min.js"></script>

<!-- Mac OS X Finder style for jQuery UI smoothness theme (OPTIONAL) -->
<link rel="stylesheet" type="text/css" media="screen" href="css/theme.css">

Translation

Include optional translation if needed. List of available translations.

<script type="text/javascript" src="js/i18n/elfinder.ru.js"></script>

Initialize file manager

Create elFinder on your page.

<script type="text/javascript" charset="utf-8">
	$().ready(function() {
		var elf = $('#elfinder').elfinder({
			// lang: 'ru',             // language (OPTIONAL)
			url : 'php/connector.php'  // connector URL (REQUIRED)
		}).elfinder('instance');			
	});
</script>

<!-- Element where elFinder will be created (REQUIRED) -->
<div id="elfinder"></div>

More client configuration options available.

See the full html example.

Conntector

TODO

Tips

Auto Language Loader

<script type="text/javascript" charset="utf-8">
(function($){
	var i18nPath = 'js/i18n',
		start = function(lng) {
			$().ready(function() {
				var elf = $('#elfinder').elfinder({
					// Documentation for client options:
					// https://github.com/Studio-42/elFinder/wiki/Client-configuration-options
					lang : lng,
					url	 : 'php/connector.php'	// connector URL (REQUIRED)
				}).elfinder('instance');
			});
		},
		loct = window.location.search,
		full_lng, locm, lng;
	
	// detect language
	if (loct && (locm = loct.match(/lang=([a-zA-Z_-]+)/))) {
		full_lng = locm[1];
	} else {
		full_lng = (navigator.browserLanguage || navigator.language || navigator.userLanguage);
	}
	lng = full_lng.substr(0,2);
	if (lng == 'ja') lng = 'jp';
	else if (lng == 'pt') lng = 'pt_BR';
	else if (lng == 'zh') lng = (full_lng.substr(0,5) == 'zh-tw')? 'zh_TW' : 'zh_CN';

	if (lng != 'en') {
		$.ajax({
			url : i18nPath+'/elfinder.'+lng+'.js',
			cache : true,
			dataType : 'script'
		})
		.done(function() {
			start(lng);
		})
		.fail(function() {
			start('en');
		});
	} else {
		start(lng);
	}
})(jQuery);
</script>

<!-- Element where elFinder will be created (REQUIRED) -->
<div id="elfinder"></div>
Clone this wiki locally