Ckeditor custom toolbar item

Hello there,
I have been using vaadin for a while but havnt customized any addon. Could any anyone please tell me how can I customize the addon for CKEditor so that I can add multiple new items on its toolbar.

I want to add a functionality to search and select the image from our own application.Please can anyone guide me through how to go about it.Thanks,


I’m not very familiar with the CKEditor but i don’t think that there is a way to do this kind of customization from the server side.
You would probably have to extend the client/GWT side of the CKEditor Component and look if you can make your modifications there by adding GWT components to the CKEditor layout (That’s at least what i’m guessing how the ckeditor is built: a gwt layout with gwt components on top) and exposing some of their functions and listeners to the server side.

Did you look at CKEditor Connector add-on? I’ve not used it, but I think it does this with a native Vaadin UI.

Our Open eSignForms application makes use of a simple JSP to select images from our server, so you could see how that’s done there: The JSP is called ckeditorImageBrowser.jsp (and a related ckeditorFileBrowser.jsp). And the CKEditorConfig.setupForOpenESignForms() method sets it up for us, but you can just make the calls yourself to setFilebrowserBrowseUrl() and/or setFilebrowserImageBrowseUrl().