Page 1 of 1

integrating pdw_file_browser into tinymce wysiwyg editor

Posted: Thu Jun 02, 2011 6:50 pm
by r6xual
Hello all,

I have successfully integrated tinyMCE into hesk to use as a WYSIWYG editor. My next step is to add pdw_file_browser to tinymce so we are able to insert images into the kb articles.

http://www.neele.name/filebrowser/

Here is the steps that pdw_file_browser says to integrate.

Code: Select all

========================
CONFIG.PHP
========================
Edit the config.php file to specify your upload folder, default language and default view layout and many more.


========================
TinyMCE installation
========================

Add the following setting to the TinyMCE configuration:
--------------------------------------------------------------------------
file_browser_callback: "filebrowser",


Add the following function to your javascript (for example below the configuration settings)
--------------------------------------------------------------------------
function filebrowser(field_name, url, type, win) {
		
	fileBrowserURL = "/path/to/file/browser/index.php?filter=" + type;
			
	tinyMCE.activeEditor.windowManager.open({
		title: "PDW File Browser",
		url: fileBrowserURL,
		width: 950,
		height: 650,
		inline: 0,
		maximizable: 1,
		close_previous: 0
	},{
		window : win,
		input : field_name
	});		
}
I am fairly certain that i have setup config.php with the correct information. However, when insert the code where i think it should be, the tinymce diappears entirely and all that is left is a blank box. here is how i have the code setup.

Code: Select all

tinyMCE.init({
        mode : "textareas",
        theme : "advanced",
        plugins : "emotions,spellchecker,advhr,insertdatetime,preview", 
                
        // Theme options - button# indicated the row# only
        theme_advanced_buttons1 : "newdocument,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,fontselect,fontsizeselect,formatselect",
        theme_advanced_buttons2 : "cut,copy,paste,|,bullist,numlist,|,outdent,indent,|,undo,redo,|,link,unlink,image,|,code,preview,|,forecolor,backcolor",
        theme_advanced_buttons3 : "insertdate,inserttime,|,spellchecker,removeformat,|,emotions,file_browser_callback: "filebrowser",
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_resizing : true
		
});

function filebrowser(field_name, url, type, win) {
		
	fileBrowserURL = "C:/inetpub/wwwroot/admin/tinymce/jscripts/tiny_mce/plugins/pdw_file_browser/index.php?filter=" + type;
			
	tinyMCE.activeEditor.windowManager.open({
		title: "PDW File Browser",
		url: fileBrowserURL,
		width: 950,
		height: 650,
		inline: 0,
		maximizable: 1,
		close_previous: 0
	},{
		window : win,
		input : field_name
	});		
}
You will see that i added file_browser_callback: "filebrowser", to the end of the third row. Sorry this was kindof vague, but has anyone had any success with this?

Thanks,

Re: integrating pdw_file_browser into tinymce wysiwyg editor

Posted: Sat Jun 04, 2011 11:30 am
by Klemen
TinyMCE will be included by default in Hesk 2.3, but until it is I am afraid I cannot provide support for custom modifications.