MCE5 - Как поместить любое изображение в качестве пользовательского значка кнопки в Tiny mce-5?

Question

Я использую TinyMce-5, и мне нужно добавить несколько пользовательских кнопок, кнопки работают отлично, но я не знаю, как добавить изображение в качестве значка на эти кнопки, так как fontawesomes не придумываютэти значки, поэтому мне нужно поместить изображение .png в качестве значка на кнопку.Вот мой код, который я использовал в настройке: параметр

ed.ui.registry.addButton('alignTop', {
    image:'http://localhost/image-process/images/donut_PNG27.png',
    tooltip: 'Align box top',
    onAction: function () {
        $('.shape[data-active=me]').css('top','0px');
    }
});

Answer 1

Мне не понравилось вышеуказанное решение, поэтому я попробовал как показано ниже и работал как шарм !!!!!

ed.ui.registry.addButton('alignTop', {
    text: '<image src="http://localhost/image-process/images/donut_PNG27.png" style="height: 24px;width: 24px;padding: 3px 0px 0px 0px;"/ >',
    tooltip: 'Align box top',
    onAction: function () {
        $('.shape[data-active=me]').css('top','0px');
    }
});

Answer 2

Вот код js

function fixTinyIcons(){
    if($('button[aria-label="Bend down text"]').length > 0 && $('button[aria-label="Bend down text"]').attr('data-bg') != 'done'){
    //console.log('1st found');
    $('button[aria-label="Bend down text"]').html('<img src="images/bottom-bend.jpg" style="height: 20px; width: 20px;">');
    $('button[aria-label="Bend down text"]').attr('data-bg','done');
    st_stop++;
}
$(document).ready(function(){
    WinIntervalCheck = setInterval(fixTinyIcons,100);

});

Вот объяснение на изображении