How to enable images upload from computer using Tinymces text editor?

Question

Tinymce!,

Dear Exert,

I'm currently used Tinymce text editor for my web design but it doesn't work with images upload from computer. below is source code that I copy from other tutorial But I don't know how to modify or to enable images upload from computer when user edit or insert some images to my database Please check it and help

<script type="text/javascript">
        tinymce.init({

            selector: "textarea",
            theme: "modern",
            width: "630",
            height: "auto",
            plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount,advlist,autosave,paste,fullscreen,noneditable,contextmenu",
            theme_advanced_buttons1_add_before : "newdocument,separator",
            theme_advanced_buttons1_add : "fontselect,fontsizeselect",
            theme_advanced_buttons2_add : "separator,forecolor,backcolor,liststyle",
            theme_advanced_buttons2_add_before: "cut,copy,paste,pastetext,pasteword,separator,",
            theme_advanced_buttons3_add_before : "tablecontrols,separator",
            theme_advanced_buttons3_add : "flash,advhr,separator,fullscreen",
            theme_advanced_toolbar_location : "top",
            theme_advanced_toolbar_align : "left",
            extended_valid_elements : "hr[class|width|size|noshade]",
            file_browser_callback : "image",
            paste_use_dialog : false,
            theme_advanced_resizing : true,
            theme_advanced_resize_horizontal : true,
            apply_source_formatting : true,
            force_br_newlines : true,
            force_p_newlines : false,
            relative_urls : true,
            toolbar: "insertfile | image| responsivefilemanager| undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image" || "print preview media | forecolor backcolor emoticons",
            plugins: "image",
            image_advtab:true,  
            image_list: [
                {title: 'My image 1', value: 'public_html/upload/'},
                {title: 'My image 2', value: 'public_html/upload/'}
            ]
            });
    </script>

It is work fine with text feature but it don't work for images upload Example: When I click on insert images/edit images->popup load than click on image icon for choosing a image but it doesn't show any thing

Thanks for help

Answer 1

tinyMCE.init({
    // General options
    mode : "textareas",
    theme : "advanced",

    //plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,wordcount",
    editor_selector : "tiny",
    plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,images,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",

    // Theme options
    theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
    theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,images, cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
    theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
    theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true,
});