Итак, я создал пользовательскую тему для TinyMCE, используя метод кнопки на своем веб-сайте. Большинство кнопок, похоже, работают, но кнопки "bullist", "numlist", "link" и "unlink" ничего не делают. Даже при переключении на HTML-представление html не добавляется (т.е. <ul><li></li></ul>
). Я пробовал добавлять плагины для advlist, advlink и т.д., Но никаких изменений. Кажется, не найти ответы на него онлайн.
Вот мой код tinymce:
$('textarea.htmlify').tinymce({
mode: 'textareas',
script_url : host + '/js/admin/tinymce/tiny_mce.js',
content_css: host + '/css/admin/tiny_mce.css',
language: false,
setup: function(editor) {
$('.showPreview', '#' + editor.id + '_preview').click(function(event) {
event.preventDefault();
tinyMCE.execCommand('mceAddControl', false, editor.id);
$('#'+editor.id + '_preview').css('display', 'none');
});
editor.addCommand('showHTML', function(ui, v){
tinyMCE.execCommand('mceRemoveControl', false, editor.id);
$('#'+editor.id + '_preview').css('display', 'block');
});
},
theme: function(editor, target) {
var editorContainer = $(target).after(
'<div>' +
'<div class="mce-toolbar clearfix">' +
'<button class="btn-mce-bold" data-mce-command="bold">Bold</button>' +
'<button class="btn-mce-italic" data-mce-command="italic">Italic</button>' +
'<button class="btn-mce-underline" data-mce-command="underline">Underline</button>' +
'<button class="btn-mce-strikethrough" data-mce-command="strikethrough">Strike Through</button>' +
'<button class="btn-mce-justifyleft" data-mce-command="justifyleft">Justify Left</button>' +
'<button class="btn-mce-justifycenter" data-mce-command="justifycenter">Justify Center</button>' +
'<button class="btn-mce-justifyright" data-mce-command="justifyright">Justify Right</button>' +
'<button class="btn-mce-justifyfull" data-mce-command="justifyfull">Justify Full</button>' +
'<button class="btn-mce-bullist" data-mce-command="bullist">Bullet List</button>' +
'<button class="btn-mce-numlist" data-mce-command="numlist">Number List</button>' +
'<button class="btn-mce-undo" data-mce-command="undo">Undo</button>' +
'<button class="btn-mce-redo" data-mce-command="redo">Redo</button>' +
'<button class="btn-mce-link" data-mce-command="link">Link</button>' +
'<button class="btn-mce-unlink" data-mce-command="unlink">Unlink</button>' +
'<button class="btn-mce-code" data-mce-command="showHTML">HTML</button>' +
'</div>' +
'<div class="htmlify"></div>' +
'</div>'
).next();
$('.mce-toolbar').css('width', $(target).css('offsetWidth'));
// Bind events for each button
$('button', editorContainer).click(function(event) {
event.preventDefault();
editor.execCommand(
$(this).attr('data-mce-command'),
false,
$(this).attr('data-mce-value')
);
});
// setup tabbing
$tabindex = parseInt($('#' + editor.id).attr('tabindex'));
if ($tabindex > 1) {
$('[tabindex=' + ($tabindex-1) + ']').keydown(function(event) {
var $keyCode = event.keyCode || event.which;
if ($keyCode == 9) {
event.preventDefault();
editor.execCommand('mceFocus', false, editor.id);
}
});
} else {
editor.execCommand('mceFocus', false, editor.id);
}
editor.onKeyDown.add(function(ed, event) {
var $tabindex = parseInt($('#' + ed.id).attr('tabindex'));
var $keyCode = event.keyCode || event.which;
if ($keyCode == 9) {
$tabindex++;
while(($("[tabindex='" + $tabindex + "']").length == 0 || $("[tabindex='" + $tabindex + "']:not([readonly])").length == 0) && $tabindex != 150 ){
$tabindex++;
}
if ($tabindex != 150)
$('[tabindex='+$tabindex+']').focus();
}
});
// Register state change listeners
editor.onInit.add(function(ed, event) {
$('button', editorContainer).each(function(i, button) {
editor.formatter.formatChanged($(button).data('mce-command'), function(state) {
$(button).toggleClass('btn-mce-on', state);
});
});
$('#'+ed.id+'_ifr').css('height', '100%');
});
// Return editor and iframe containers
return {
editorContainer: editorContainer[0],
iframeContainer: editorContainer.children().eq(-1),
// Calculate iframe height: target height - toolbar height
iframeHeight: $(target).height() - editorContainer.first().outerHeight()
};
}
});