How to set the font size of list item bullets and numbers in tinyMCE?

user_515065 0
Viewed 4127

TinyMCE is a great tool and it has solved many problems for us. However there is a problem that has been difficult to solve. While TinyMCE will change the size of the font of items in a list it doesn't change the size of the bullets (unordered list) or numbers (ordered list) that proceed those items.

What the user winds up with is something that looks like this:

Item fonts change but bullet fonts do not change

As you can see in the image, the size of the fonts in the two lists are different but the size of the bullets is the same.

Does anyone know how to get TinyMCE to change the bullets to match the font?

tinymce
11 Answers

This worked for me

tinymce.init({
            init_instance_callback: function (editor) {
                editor.on('ExecCommand', function (e) {
                    var node = editor.selection.getNode();
                    if (node) {
                        var children = $(node).children("li");
                        if (children) {
                            children.removeAttr('data-mce-style');
                            children.css("font-size", e.value);
                        }
                    }
                });
            }
        });
user_142836080

Following is what works for me, All above failed for me as test required NOT selection but very start of list should be based on Font Size selected

editor.on('ExecCommand', function checkListNodes(evt) {
        var cmd = evt.command;
        var val = evt.value;
        var node = evt.target.selection.getNode();
        var nodeParent = node.parentNode;
        if (cmd === 'FontSize' || cmd === 'FontName') {
            if (node.nodeName === 'SPAN') {//(nodeParent.parentNode.nodeName === 'LI') 
{
                var whileNode = node;
                var count = 1;//dont want to be endless for with no list in editor
                while (whileNode.nodeName !== 'LI' && count<6) {
                    whileNode = whileNode.parentNode;
                    count++;
                }

                editor.dom.setStyle(nodeParent.parentNode, 'font-size', val);
            }
            else if (node.nodeName === 'UL' || node.nodeName === 'OL')
            {
                var li = editor.dom.select('li', node);
                if (cmd === 'FontSize') {
                    editor.dom.setStyle(li, 'font-size', val);
                }
                if (cmd === 'FontName') {
                    editor.dom.setStyle(li, 'font-family', val);
                }
            }
        }
        //if (cmd === 'InsertOrderedList' || cmd === 'InsertUnorderedList') {
        //    var fontSize = $("span.tox-tbtn__select-label:eq(1)").text().replace('pt', '');

        //}
    });
user_36279140
Related