Tiny MCE. The h3 tag is block only

How do I make sure that when I select the h3 format in the button I created, the h3 format is not block, but inline?

The code on the page, now the h3 format is "block".

tinymce.init({
    selector: '#tinymce_editor',
    formats: {
        h3: {
            block: 'h3'
        },
    },
    plugins: [
        "buttons_plugin"
    ],
    toolbar: "bigHbutton",
    setup: function(editor) {

    }
});

Replace

h3: { block : 'h3'      }, 

To

h3: { inline : 'h3'      },  

Doesn't help

The button is connected via the buttons_plugin plugin code of the buttons_plugin plugin.

tinymce.PluginManager.add('buttons_plugin', function(editor) {
    var state;
    // Actions to do on button click  
    function my_action() {
        state = !state; // Switching state  
        editor.fire('bigHbutton', {
            state: state
        });
        tinymce.activeEditor.formatter.toggle('h3');

    }

    function toggleState_MyButton() {
        var self = this;
        console.log('toggleState_MyButton');
        editor.on('bigHbutton', function(e) {
            console.log('on');
            self.active(e.state);
        });
    }

    // Adding the button & command  
    editor.addCommand('cmd_mybutton', my_action);

    editor.addButton('bigHbutton', {
        text: 'H',
        //  image: 'tinymce/plugins/buttons_plugin/img/some16x16icon.png',
        title: 'обвернуть в h3 тэг',
        cmd: 'cmd_mybutton',
        onPostRender: toggleState_MyButton
    });
});
 0
Author: Roman, 2020-09-23

1 answers

The issue was resolved by adding a parameter.

formats: { 
  h3: { inline  : 'span', styles:{'font-size': '1.17em', 'margin-top': '1em','margin-bottom': '1em'}  
 },          
    
 0
Author: Roman, 2020-09-24 08:31:10