I can remove every single button from the toolbar but not this imagepicker button.
I tried to remove it with removePlugins: 'pickimage,image' and removeButtons: 'Image' plus a few more variations in the config where I could remove the other buttons.
Any hints or help is appreciated.
This Button:
try this in javascript code.
<script type="text/javascript">
$(document).ready(function () {
CKEDITOR.config.removeButtons = 'Image';
});
</script>
Open link and Check it.
enter image description here
The imagepicker in ckeditor 4.* can be removed with this setting:
"removeButtons":"PickImage"
Related
I applied kendo editor on a div element rather using textarea as it's giving some issues in iPad. Now, I don't want the editor to have toolbar to format text.
I tried applying styles as none & set tools to an empty array but still the toolbar appears with a draggable button in it.
<div id="targetdiv" contenteditable="true" style = "resize: none;width:
100%
!important; height:150px; max-height:150px;max-width: 100% !important;">
</div>
<script>
$("#targetdiv").kendoEditor({
tools: []});
</script>
The toolbar appears though the editor it initialized with no tools, as in image below.
Approach 1: (Not working)
<style>
.k-editor-toolbar
{
display:none;
}
</style>
Approach 2: (Not working)
$('.k-editor-toolbar').hide();
Approach 3: (partially works)
Added a select event but still the toolbar appears for an instant and then disappears.
$("#targetdiv").kendoEditor({
tools: [],
//Fires when the Editor selection has changed.
select: function (e) {
let editor = $("#targetdiv").data("kendoEditor");
editor.toolbar.hide();
});
If you don't want to show the toolbar define an empty tools in the KendoUI editor initialization:
$("#editor").kendoEditor({
// Empty tools so do not display toolbar
tools: [ ]
});
If you want to disable the edition, you should use:
$(editor.body).attr('contenteditable',false);
you can try this one as well
.k-editor-toolbar
{display:none !important;}
Finally,
I have to subscribe for the open event of the editor toolbar and prevent its execution. This resolved my issue.
let editor = $("#targetdiv").getKendoEditor();
editor.toolbar.window.bind("open", function (e) {
e.preventDefault();
});
How to make the editor toolbar located just above? I use inline editing, and the toolbar is transferred down if to scroll a site before the end of the page.
Using sharedspace can help you.
You can find a similar issue, and the solution, here:
How to make the inline ckeditor toolbar fixed at the top and not float
The implementation of the plugin would look like this:
<div id="toolbarLocation></div>
<div id="editor" contenteditable="true"></div>
<script>
CKEDITOR.disableAutoInline = true;
CKEDITOR.replace( 'editor', {
sharedSpaces: {
top: 'toolbarLocation'
}
} );
</script>
Can you please tell me how to hide an img tag when it opens on mobile? Please suggest me if there is any css solution or simple javascript.
Thanks
$(document).ready(function() {
var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (isMobile)
$('#imgID').hide();
});
I've successfully set up CKEditor and it works well, but the collapse toolbar button (3) irks me:
Is there any way to hide or remove it? If so, how?
from this source
You can easily disable it in plugins/toolbar/plugin.js
CKEDITOR.replace( 'editor1',
{
toolbarCanCollapse : false
}
);
or
CKEDITOR.config.toolbarCanCollapse = false;
I have a link, after click this link, a modal was displayed. I used ModalDialog with code:
$(document).ready(function() {
//linkTTT is link id
$("a#linkTTT").click(function() {
//content is id of div that contains content
$("#content").modal({ onOpen: function(dialog) {
dialog.overlay.fadeIn('slow', function() {
dialog.data.hide();
dialog.container.fadeIn('slow', function() {
dialog.data.slideDown('slow');
});
});
}
});
}); //end a click
});
Content're contained in a , it includes two tables that containt text and some images.
This application run well in Firefox 3+, Chrome and IE8.
Images here: [http://bian.vn/normal.png]
I'm having problem with IE 6 and IE 7.
In IE 6:
Images here: [http://bian.vn/IE6.png]
In IE 7, content's cleaned after is loaded...
Images here: [http://bian.vn/IE7.png]
You can see screencast at link text
Let me know your answer about this problem
Thanks a lot.
I found solution for my problem :)
In <div> tag that have id="content", I included two tables. After I remove table. It's resolved!
Thanks for viewing :)