3

There is a horizontal box of one-line height at the bottom with the character "p" in it that I want to get rid of for end users. I don't really care if it is there in the Dashboard Editor for site admins/editors. This line seems to indicate the formatting of the line where the cursor is. End users are providing feedback "so, what's the p?". Can we remove that box?

1

This is how the tinymce statusbar displays on my intsall:

<div id="mceu_34" class="mce-statusbar mce-container mce-panel mce-stack-layout-item mce-last" hidefocus="1" tabindex="-1" role="group">
    <div id="mceu_34-body" class="mce-container-body mce-flow-layout">
        <div id="mceu_35" class="mce-path mce-flow-layout-item mce-first mce-last">
            <div role="button" class="mce-path-item" data-index="0" tabindex="-1" id="mceu_35-0" aria-level="0">p</div>
            <div class="mce-divider" aria-hidden="true"> » </div>
            <div role="button" class="mce-path-item mce-last" data-index="1" tabindex="-1" id="mceu_35-1" aria-level="1">strong</div>   
        </div>
    </div>
</div>

so this suggests hiding it with CSS.

You probably want to keep the statusbar visible but hide the div.mce-path.

The tiny_mce_before_init hook might come useful to target the tinymce editor:

add_filter( 'tiny_mce_before_init', function( $settings )
{
    ?><style>.mce-path{display:none;}</style><?php
    return $settings;
} );

But there must be a native way, so I simply searched for the mce-path keyword and this question on StackOverflow popped up first:

Remove path in status bar in TinyMCE4

There it's suggested by @BeckJohnson to use:

tinymce.init({ elementpath: false });

so we can try that with:

add_filter( 'tiny_mce_before_init', function( $settings )
{
    $settings['elementpath'] = false;
    return $settings;   
});

and that seems to do the trick.

  • you're welcome, glad to hear it worked for you @BJBrowning – birgire Nov 27 '15 at 13:30
0

It's called the Element Path located in the editor's status bar.

You remove it by setting its tinymce.init setting of elementpath to false.

{'elementpath': false}

In Wordpress, that setting can be altered in the tiny_mce_before_init filter.

add_filter('tiny_mce_before_init', function ($init) {
$init['elementpath'] = false;
return $init; });

Make sure you add the filter before you invoke the editor function or it will not take effect.

  • Thank you as well Scriptonomy - this seems to be the code snippet required! – BJ Browning Nov 27 '15 at 13:17
0

It shows what HTML tags are open.

Just tell them what it is and add "if you don't know what that means, just ignore it. It is nothing you need to worry about."

Why go making code changes when they are not needed?

  • because UX is important. In general I agree with you, but if the user cares then it should be fixed. Usually it is faster than trying to educate the user. – Mark Kaplun Nov 13 '15 at 4:56
  • "IT" is not broken so "IT" can't be fixed. As I said, it is a there as an editing/authoring aid.Why not remove the formatting bar, the Add Media link, the word count at the bottom of the editing area, and or the text mode? As to "UX" I assume you mean user experience. I cannot see how encountering something that they don't understand but does not obviously cause any problem for them can't simply be explained as an editing aid that they will likely never need to be concerned with. What is the URL of your site, I'd like to see how the UX is on it. - I stand my my original statement. – SimonT Nov 14 '15 at 2:59
  • Thanks so much for your comments to my question. Our website is still in beta and undergoing redesign, so I don't want to divulge the URL just yet - but it will be awesome! Our end user community will appreciate the online form being really simple; the more streamlined, the more appealing. – BJ Browning Nov 27 '15 at 13:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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