TinyMCE ve Roxy Fileman Entegrasyonu
TinyMCE’de resim veya video ögesi eklenmek istendiğinde, resim veya video linki eklenerek bu yapılabilmektedir. TinyMCE kendi sunucumuza yükleme desteği vermemektedir. Roxy Fileman, TinyMCE resim veya ekleme arayüzünde sunucumuza ulaşabilmemizi sağlıyor.
- Roxy Fileman http://www.roxyfileman.com/download adresinden paketi indirilir ve Sıkıştırılmış paket içinden fileman klasörü çıkartılır, bu klasör sunucuda çalıştırılacak klasöre kopyalanır. (Örneğin: http://localhost/Editor klasörü içine)
- Roxy Fileman’in dosyaları kopyalayacağı klasör oluşturulur. (Örnek: http://localhost/Yuklemeler). Bu klasör varsayılan olarak /kcfinder/upload/ şeklindedir. Yükleme klasörünün yazılabilir özellikte olması gerekir. Linux işletim sisteminde chmod 0777 olarak ayarlanmalıdır.
- Roxy Fileman ayarları fileman klasörü içindeki json dosyasında bulunur.
- FILES_ROOT ayarı ile dosyaların yükleneceği klasör tanımlanır. Burada unutulmaması gereken en önemli durum Roxy Fileman web sunucunun root klasörünü baz alarak çalışmaktadır. Belki de en zayıf noktası da budur. Çalışma Klasörünü istediğimiz gibi değiştiremiyoruz.
- Roxy Fileman’in TinyMCE ile çalışabilmesi için conf.json dosyası içindeki INTEGRATION değerinin kullanılan tinyMCE sürümüne uygun olarak tinymce3 veya tinymce4 olarak değiştirilmesi gerekir.
Roxy Fileman’in ekleneceği editörde (TinyMCE) Roxy Fileman’in ayarlamaları yapılır. TinyMCE’in seçicisinin tanılandığı init() metodunda aşağıdaki satırın tanımlanması gerekir.
file_browser_callback: RoxyFileBrowser
Ayrıca RoxyFileBrowser fonksiyonunun da editör scriptleri içinde tanımlanması gerekir.
Örnek CKEditor Tanımlaması:
</script> $(function() { tinyMCE.init( { selector: '#tinymce', plugins: 'link image', toolbar: "link | image", file_browser_callback: RoxyFileBrowser } ); } ); function RoxyFileBrowser(field_name, url, type, win) { var roxyFileman = 'fileman/index.html'; if (roxyFileman.indexOf("?") < 0) { roxyFileman += "?type=" + type; }else { roxyFileman += "&type=" + type; } roxyFileman += '&input=' + field_name + '&value=' + win.document.getElementById(field_name).value; if(tinyMCE.activeEditor.settings.language){ roxyFileman += '&langCode=' + tinyMCE.activeEditor.settings.language; } tinyMCE.activeEditor.windowManager.open( { file: roxyFileman, title: 'Roxy Fileman', width: 850, height: 650, resizable: "yes", plugins: "media", inline: "yes", close_previous: "no" }, { window: win, input: field_name } ); return false; } </script>