CKEditör kullanıcıları varsayılan olarak karakter sınırlaması özelliğini kullanamıyorlar. Bu basitçe biz hazırlayabiliyoruz. Kopyala yapıştır yaparak bir plugin sayesinde artık editörünüze yazılacak yazılara limit koyabilirsiniz. Üstelik göstergeli ;)
Öncelikle config.js dosyasını açın ve alttaki satırı yapıştırın.
config.extraPlugins = 'charcount';
Alttaki gibi configürasyon fonksiyonu içine yerleştirmelisiniz;
CKEDITOR.editorConfig = function( config ) { // Define changes to default configuration here. For example: config.language = 'tr'; // config.uiColor = '#AADC6E'; config.extraPlugins = 'charcount'; config.extraPlugins = 'syntaxhighlight'; config.toolbar_Full.push(['Code']); };
CKEditor plugin klasörüne girin ve yeni bir klasör oluşturun. İsmi charcount olsun.
Oluşturduğunuz charcount klasörü içine girin ve plugin.js adında bir js dosyası oluşturun.
Alttaki kodları buraya yapıştırın
CKEDITOR.plugins.add( 'charcount', { init : function( editor ) { var defaultLimit = 'unlimited'; var defaultFormat = '<span class="cke_charcount_count">%count%</span> of <span class="cke_charcount_limit">%limit%</span> characters'; var limit = defaultLimit; var format = defaultFormat; var intervalId; var lastCount = 0; var limitReachedNotified = false; var limitRestoredNotified = false; if ( true ) { function counterId( editor ) { return 'cke_charcount_' + editor.name; } function counterElement( editor ) { return document.getElementById( counterId(editor) ); } function getEditorData(editor) { data = $.trim(editor.getData().replace(/<.*?>/g, '').replace(/\n/g, '').replace(/\r/g, '').replace(/ /g, '').replace(/ /g, '')); return data; } function updateCounter( editor ) { //var count = editor.getData().length; // custom curData = getEditorData(editor); curDataLength = curData.length; //newData = curData.substring(0,lastcount); //if(curDataLength < 0) //{ // curDataLength = curDataLength + 2; //} count = curDataLength; if( count == lastCount ){ return true; } else { lastCount = count; } if( !limitReachedNotified && count > limit ){ limitReached( editor ); } else if( !limitRestoredNotified && count < limit ){ limitRestored( editor ); } var html = format.replace('%count%', count).replace('%limit%', limit); counterElement(editor).innerHTML = html; } function limitReached( editor ) { limitReachedNotified = true; limitRestoredNotified = false; editor.setUiColor( '#FFC4C4' ); // custom /* realData = editor.getData(); realDataLength = realData.length; curData = getEditorData(editor); curDataLength = curData.length; difference = curDataLength - limit; //alert('curDataLength: ' + curDataLength + ' , but the limit is: ' + limit + ' and the difference is: ' + difference ); newData = realData.substring(0, realDataLength - difference - 6); editor.setData(newData, function(){ count = getEditorData(editor).length; lastCount = count-1; }); */ } function limitRestored( editor ) { limitRestoredNotified = true; limitReachedNotified = false; editor.setUiColor( '#C4C4C4' ); } editor.on( 'themeSpace', function( event ) { if ( event.data.space == 'bottom' ) { event.data.html += '<div id="'+counterId(event.editor)+'" class="cke_charcount"' + ' title="' + CKEDITOR.tools.htmlEncode( 'Character Counter' ) + '"' + '> </div>'; } }, editor, null, 100 ); editor.on( 'instanceReady', function( event ) { if( editor.config.charcount_limit != undefined ) { limit = editor.config.charcount_limit; } if( editor.config.charcount_format != undefined ) { format = editor.config.charcount_format; } }, editor, null, 100 ); editor.on( 'dataReady', function( event ) { //var count = event.editor.getData().length; //var count = getEditorData().length; var count = $.trim(event.editor.getData().replace(/<.*?>/g, '').replace(/\n/g, '').replace(/\r/g, '').replace(/ /g, '').replace(/ /g, '')).length; if( count > limit ){ limitReached( editor ); } updateCounter(event.editor); }, editor, null, 100 ); editor.on( 'key', function( event ) { //updateCounter(event.editor); }, editor, null, 100 ); editor.on( 'focus', function( event ) { editorHasFocus = true; intervalId = window.setInterval(function (editor) { updateCounter(editor) }, 1000, event.editor); }, editor, null, 100 ); editor.on( 'blur', function( event ) { editorHasFocus = false; if( intervalId ) clearInterval(intervalId); }, editor, null, 100 ); } } });
Kaydedin. Karakter kıısıtlaması yapacağınız editörünüzün kodları arasına şu etiketleri yerleştirin.
extraPlugins : 'uicolor',
extraPlugins: 'charcount',
Örnek;
<script type="text/javascript"> CKEDITOR.replace( 'editor1', { extraPlugins : 'uicolor', extraPlugins: 'charcount', charcount_limit: 250, height: 100, toolbar : [ [ 'Bold', 'Italic', '-', 'Undo','Redo'], ] }); </script>
Alıntı: http://cksource.com/forums/viewtopic.php?f=11&t=18032
İlk yorumu siz yazın !..