Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I feel you about the docs and quality, although they are working hard on it and it is improving all the time.</p> <p>I had some recent experience with extending the editor, its quite easy and possible.</p> <p>You have a tools property when declaring the editor. When you put in the name of an integrated tool its just gonna show that tool or you can also pass in an object to define a new tool. Here is my example below where I created a custom "Insert video" tool. The name and tooltip properties are self explanatory. The exec is a property in which you pass in a function that gets executed on clicking your button. The exec in my example opens a custom kendo window which implements the logic for adding a video. It has an interface where you chose either Vimeo or Youtube, paste in the regular link and it pastes the embeded video inside your editor. Basicly when you click ok in my window an event fires up, handles the markup for the embeded video and pastes it in with the editor. The method to paste in your markup in the editor is: $("#editor").data("kendoEditor").paste(someString); where someString is the stuff you want to paste in of course. It gets pasted wherever the cursor currently is.</p> <p>Of course if you want something more robust, you could add more complex code inside your exec function. Like something that would in this case create all the needed markup for the video window, and destroy it after closing or something simillar. </p> <pre><code> $("#editor").kendoEditor({ tools: [ { name: "insertVideo", tooltip: "Insert video", exec: function(){ var window = $("#windasd").data("kendoWindow"); window.center().open(); } },'formatBlock', 'bold', 'italic', 'underline', 'createLink', 'unlink', 'insertImage', 'insertUnorderedList', 'insertOrderedList', "justifyLeft", "justifyCenter", "justifyRight", "justifyFull", ], }); </code></pre> <p>Also if you want a custom icon you are gonna have to add some css. Your button will automaticly get a CSS class based on the name you passed in. it just adds a "k-" prefix to the name so mine would be "k-insertVideo". Just add a background image to that class and you're good.</p> <p>Good luck and hope my post helps and wasnt written in a complicated manner!</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload