Codewaggle 的回答让我开始了，我也看过Reinmar 的回答，但我不能把它放在一起。
我想创建一个具有五个自定义跨度（更正、删除、建议...等）的插件，然后我可以将其添加到我的 CSS 中，并有一个按钮来使用 Drupal 7 中的 CKeditor 应用每种样式。
我不想为样式使用下拉菜单，而是更喜欢为每个添加的类添加带有图标的按钮。
我使用 basicstyles 插件作为起点，但我之前从未在 javascript 中做过任何事情，所以我真的一头雾水。
我已经添加了
config.extraPlugins = 'poligoeditstyles';
到配置文件并根据CKeditor上的指南设置我的插件的文件结构。
我假设如果一切都按计划进行，我应该会看到一个按钮拖到我的工具栏中，但是，唉！没有喜悦。当我添加内容或在 Drupal 的配置页面上时，我看不到任何添加到我的 CKeditor 工具栏的内容：
admin/config/content/ckeditor/edit/Advanced
我错过了什么吗？任何帮助，将不胜感激！
这是我的插件代码：
/**
* POLIGO edit styles plug-in for CKeditor based on the Basic Styles plugin
*/
CKEDITOR.plugins.add( 'poligoeditstyles', {
icons: 'correction,suggestion,deletion,commendation,dontunderstand', // %REMOVE_LINE_CORE%
init: function( editor ) {
var order = 0;
// All buttons use the same code to register. So, to avoid
// duplications, let's use this tool function.
var addButtonCommand = function( buttonName, buttonLabel, commandName, styleDefiniton ) {
// Disable the command if no definition is configured.
if ( !styleDefiniton )
return;
var style = new CKEDITOR.style( styleDefiniton );
// Listen to contextual style activation.
editor.attachStyleStateChange( style, function( state ) {
!editor.readOnly && editor.getCommand( commandName ).setState( state );
});
// Create the command that can be used to apply the style.
editor.addCommand( commandName, new CKEDITOR.styleCommand( style ) );
// Register the button, if the button plugin is loaded.
if ( editor.ui.addButton ) {
editor.ui.addButton( buttonName, {
label: buttonLabel,
command: commandName,
toolbar: 'poligoeditstyles,' + ( order += 10 )
});
}
};
var config = editor.config,
lang = editor.lang;
addButtonCommand( 'Correction', 'That's a mistake', 'correction', config.coreStyles_correction );
addButtonCommand( 'Suggestion', 'That's OK, but I suggest...', 'suggestion', config.coreStyles_suggestion );
addButtonCommand( 'Deletion', 'You don't need that', 'deletion', config.coreStyles_deletion );
addButtonCommand( 'Commendation', 'Great job!', 'commendation', config.coreStyles_commendation );
addButtonCommand( 'Dontunderstand', 'I don't understand what you mean', 'dontunderstand', config.coreStyles_dontunderstand );
}
});
// POLIGO Editor Inline Styles.
CKEDITOR.config.coreStyles_correction = { element : 'span', attributes : { 'class': 'correction' }};
CKEDITOR.config.coreStyles_suggestion = { element : 'span', attributes : { 'class': 'suggestion' }};
CKEDITOR.config.coreStyles_deletion = { element : 'span', attributes : { 'class': 'deletion' }};
CKEDITOR.config.coreStyles_commendation = { element : 'span', attributes : { 'class': 'commendation' }};
CKEDITOR.config.coreStyles_dontunderstand = { element : 'span', attributes : { 'class': 'dontunderstand' }};