I am using CKEditor and would like to resize the editor. I am doing the following:
<head runat="server">
<script src="../../../../../js/jquery-1.10.2.min.js" type="text/javascript"></script>
<script src="../../../../../ckeditor/ckeditor.js" type="text/javascript"></script>
<script src="../../../../../js/ckeditor_initialize.js" type="text/javascript"></script>
<script type="text/javascript">
function ResizeEditor() {
var editor = CKEDITOR.replace('tbEditor');
editor.resize('100', '800');
}
</script>
</head>
<body onload="ResizeEditor();">
<form id="form1" runat="server">
<asp:TextBox class="ckeditor" ID="tbEditor" runat="server" ClientIDMode="Static" TextMode="MultiLine"></asp:TextBox>
</form>
</body>
But it does not seem to work. I think I may be getting the CKEditor Instance incorrectly. Can someone explain what I am doing wrong?
I am using CKEditor 4 with 4.5.
I am using CKEditor and would like to resize the editor. I am doing the following:
<head runat="server">
<script src="../../../../../js/jquery-1.10.2.min.js" type="text/javascript"></script>
<script src="../../../../../ckeditor/ckeditor.js" type="text/javascript"></script>
<script src="../../../../../js/ckeditor_initialize.js" type="text/javascript"></script>
<script type="text/javascript">
function ResizeEditor() {
var editor = CKEDITOR.replace('tbEditor');
editor.resize('100', '800');
}
</script>
</head>
<body onload="ResizeEditor();">
<form id="form1" runat="server">
<asp:TextBox class="ckeditor" ID="tbEditor" runat="server" ClientIDMode="Static" TextMode="MultiLine"></asp:TextBox>
</form>
</body>
But it does not seem to work. I think I may be getting the CKEditor Instance incorrectly. Can someone explain what I am doing wrong?
I am using CKEditor 4 with 4.5.
Share Improve this question asked Dec 18, 2013 at 14:08 LilMokeLilMoke 3,4747 gold badges55 silver badges95 bronze badges4 Answers
Reset to default 2You can set size directly in the CKEDITOR.replace method:
CKEDITOR.replace( 'tbEditor', { width: 800, height: 100 } );
You can resize Ckeditor in the following way:-
var editor = CKEDITOR.instances[id];
editor.config.resize_dir = 'both'; //if you want to enable resizing, else use resize_enabled = false;
editor.config.height = 'your height';
editor.config.width = 'your width';
I needed to resize only one editor and not all editors on the page. This is how I did it in version 4.7.0
CKEDITOR.on('instanceLoaded', function (e) {
if (e.editor.name == 'html_name_of_your_DOM_element') {
e.editor.resize(800, 350);
}
});
here don't work with replace, because I need destroy before and I understand you do not have to do this.
You can resize this way:
var editor = CKEDITOR.instances['tbEditor'];
if (editor) {
editor.resize(100, 800);
}