0

Pressing the "Clear Formatting" toolbar button removes styles like bold and italics just fine, but it leaves lists and headings (h1, h2, etc.) as-is. Is there a way to include all elements when clearing the formatting of the content? I've searched and searched but can't seem to find any results pertaining to what I want to do.

I'm mostly using an Advanced Custom Fields WYSIWYG field, but I've tried with WordPress' default Classic Editor as well. I found a single post that showed using the removeformat_selector attribute in TinyMCE's initialization, but that doesn't work. This is what I tried: (using ACF's approach to TinyMCE's init customization)

add_action( 'acf/input/admin_footer', function() {
    ?>
    <script type="text/javascript">
        ( function( $ ) {
            acf.add_filter( 'wysiwyg_tinymce_settings', function( mceInit, id, field ) {
                mceInit['removeformat_selector'] = 'ul,li,b,strong,em,i,span,h1,h2,h3,h4,h5,h6,blockquote,pre,code';
                return mceInit;
            } );
        } )( jQuery );
    </script>
    <?php
} );
2
  • 1
    h1 isn't a style though, it has semantic meaning, are you using a TinyMCE plugin such as TinyMCE advanced? Where are you using the TinyMCE editor to do this? Can you make your question more specific/detailed?
    – Tom J Nowell
    Jul 5, 2022 at 16:25
  • @TomJNowell Thanks, I've updated the post with some more info. While H1 isn't a style, I do think it falls under formatting. In the modern versions of TinyMCE (the cloud service) you're able to customize which styles or elements are removed when the button is pressed.
    – Gavin
    Jul 5, 2022 at 18:28

1 Answer 1

0

I need to answer my own question here. I was using the attributes from TinyMCE v3, but it needed to use the v4 format. Here's what works:

add_action( 'acf/input/admin_footer', function() {
    ?>
    <script type="text/javascript">
        ( function( $ ) {
            acf.add_filter( 'wysiwyg_tinymce_settings', function( mceInit, id, field ) {
                mceInit['formats']['removeformat'] = [{ selector: 'h1,h2,h3,h4,h5,h6,ul,li,b,strong,em,i,span,blockquote,pre,code', remove: 'all', split : true, expand : false, block_expand: true, deep : true }];
                return mceInit;
            } );
        } )( jQuery );
    </script>
    <?php
} );

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.