2014-10-03 3 views
3

CKeditor에 삽입 된 img 태그에 클래스를 추가하려고합니다. 다양한 방법을 시도했지만이 플러그인의 설정이 어떻게 작동하는지 알 수 없습니다. 톤의 문서가 있지만 코드를 추가해야한다는 점만 언급하고 추가해야하는 곳은 아니며 많은 파일이 있습니다. 내가img 태그에 클래스를 추가하는 CKeditor

/** 
* @license Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved. 
* For licensing, see LICENSE.md or http://ckeditor.com/license 
*/ 

CKEDITOR.editorConfig = function(config) { 
    // Define changes to default configuration here. 
    // For complete reference see: 
    // http://docs.ckeditor.com/#!/api/CKEDITOR.config 

    // The toolbar groups arrangement, optimized for two toolbar rows. 
    config.toolbarGroups = [ 
     { name: 'clipboard', groups: [ 'clipboard', 'undo' ] }, 
     { name: 'editing',  groups: [ 'find', 'selection', 'spellchecker' ] }, 
     { name: 'links' }, 
     { name: 'insert' }, 
     { name: 'forms' }, 
     { name: 'tools' }, 
     { name: 'document', groups: [ 'mode', 'document', 'doctools' ] }, 
     { name: 'others' }, 
     '/', 
     { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] }, 
     { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] }, 
     { name: 'styles' }, 
     { name: 'colors' }, 
     { name: 'about' } 
    ]; 

    // Remove some buttons provided by the standard plugins, which are 
    // not needed in the Standard(s) toolbar. 
    config.removeButtons = 'Underline,Subscript,Superscript'; 

    // Set the most common block elements. 
    config.format_tags = 'p;h1;h2;h3;pre'; 

    // Simplify the dialog windows. 
    config.removeDialogTabs = 'image:advanced;link:advanced'; 
    config.extraPlugins = 'confighelper'; 

    config.stylesSet = 'my_styles'; 

}; 

CKEDITOR.stylesSet.add('my_styles', [ 

    { name: 'Custom Image', element: 'img', attributes: { 'class': 'myClass' }} 
]); 

그래서 didn를 실제 HTML 페이지

<script> 
CKEDITOR.stylesSet.add('my_styles', [ 

    { name: 'Custom Image', element: 'img', attributes: { 'class': 'myClass' }} 
]); 
</script> 

에 추가 시도

작동하지 않았다 config.js의 하단에 추가 시도

어느 쪽이든 작동하지 않는다

그들의 문서 읽기 나는 그것을 전혀 이해할 수 없다. http://docs.ckeditor.com/#!/guide/dev_howtos_styles

편집기를 통해 추가 한 모든 img 태그에 클래스를 추가하는 방법은 무엇입니까?

답변

0

저는 CKEDITOR를 사용하지 않지만 나중에 정의 된 이후로 stylesSet이 CKEDITOR 호출시 선언되지 않을 수 있습니다. editorConfig보다 먼저 CKEDITOR.stylesSet.add을 이동하십시오.

는 또한 첫 번째 코드 블록으로 당신의 스타일을 넣어 :

CKEDITOR.editorConfig = function(config) { 

    ... 
    ... 

    config.stylesSet = [ 
     { name: 'Custom Image', element: 'img', attributes: { 'class': 'myClass' }} 
    ]; 

}; 
</script> 

사용에 대한 몇 가지 더 문서도 있습니다 http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-stylesSet

관련 문제