Support » Plugin: Private Content » Whitespace after upgrade to wordpress 5.70

  • Resolved dastra

    (@dastra)


    My site is showing whitespace after upgrade to wordpress 5.70. This is because the wordpress style css has the following entry:

    p:empty:before {
        content: "​";
    }

    Which was added as part of this PR: https://github.com/WordPress/gutenberg/pull/27995 and others’ issue is described in more detail here: https://wordpress.org/support/topic/empty-spaces-after-wordpress-5-7-update/

    And the private shortcode codebase is creating empty paragraphs before each shortcode:

    <div class="private custom_role_name">
    <p></p>
    <ul><li><a href="https://example.com/admin/index">Admin</a></li></ul>
    <p></p>
    </div>

    Which is generated from this code, created from the gutenberg block editor:

    <!-- wp:shortcode -->
    [private role="custom" custom_role="custom_role_name"]
    <!-- /wp:shortcode -->
    
    <!-- wp:list -->
    <ul><li><a href="https://example.com/admin/index">Admin</a></li></ul>
    <!-- /wp:list -->
    
    <!-- wp:shortcode -->
    [/private]
    <!-- /wp:shortcode -->

    Having looked through the plugin’s codebase and played around with the code (html) view in the wordpress 5.7 editor, I don’t think it’s a problem with your plugin directly but more what is being passed to you from wordpress.

    If I go into the code editor and update the HTML generated by the gutenberg editor to this:

    [private role="custom" custom_role="custom_role_name"]<ul><li><a href="https://example.com/admin/index">Admin</a></li></ul>[/private]

    And click “update” the code is rewritten by wordpress to:

    <p>[private role="custom" custom_role="custom_role_name"]</p>
    <ul>
    <li><a href="https://example.com/admin/index">Admin</a></li>
    </ul>
    <p>[/private]</p>

    which would appear to be the additional paragraphs and what, I suspect, is being passed on to the plugin in the $content variable.

    As a workaround I have overridden the css.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Aldo Latino

    (@aldolat)

    Hello,
    when using elements such as ul inside a Private Content shortcode, it’s better to create a div container, for example:

    [private container="div"]<ul><li><a href="https://example.com/admin/index">Admin</a></li></ul>[/private]

    Thread Starter dastra

    (@dastra)

    Hi Aldo

    Many thanks for your prompt response. I’ve given that a go but I’m still getting those paragraphs I’m afraid:

    <!-- wp:shortcode -->
    [private role="custom" custom_role="custom_role_name" container="div"]
    <!-- /wp:shortcode -->
    
    <!-- wp:list -->
    <ul><li><a href="https://example.com/admin/index">Admin</a></li></ul>
    <!-- /wp:list -->
    
    <!-- wp:shortcode -->
    [/private]
    <!-- /wp:shortcode -->

    Gives generated code:

    <div class="private custom_role_name-content">
    <p></p>
    <ul><li><a href="https://example.com/admin/index">Admin</a></li></ul>
    <p></p>
    </div>

    So those phantom paragraphs passed through from wordpress are still displaying.

    Plugin Author Aldo Latino

    (@aldolat)

    I don’t know why you are getting this code in your post editing screen:

    <!-- wp:shortcode -->
    [private role="custom" custom_role="custom_role_name" container="div"]
    <!-- /wp:shortcode -->
    
    <!-- wp:list -->
    <ul><li><a href="https://example.com/admin/index">Admin</a></li></ul>
    <!-- /wp:list -->
    
    <!-- wp:shortcode -->
    [/private]
    <!-- /wp:shortcode -->

    The correct code in Code Editor screen should be this one:

    <!-- wp:shortcode -->
    [private container="div"]<ul><li><a href="https://example.com/admin/index">Admin</a></li></ul>[/private]
    <!-- /wp:shortcode -->

    while in the Visual Editor is (using the Shortcode block):

    Thread Starter dastra

    (@dastra)

    Hi Aldo,

    I think I know why – I’m using the visual editor for the whole thing (as often the content which I wish to make private is quite a few different blocks). In the visual editor, the code above looks like this:

    https://drive.google.com/file/d/1gvCUinf0KgZd0cp8fqCFU8LNZdIGffxp/view?usp=sharing

    Plugin Author Aldo Latino

    (@aldolat)

    Hi @dastra,
    the full shortcode must be entered in a single row, as explained in my previous post.

    Thread Starter dastra

    (@dastra)

    Thanks very much Aldo; I will bear that in mind in the future. And thanks for your prompt replies!

    • This reply was modified 9 months, 2 weeks ago by dastra.
Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Whitespace after upgrade to wordpress 5.70’ is closed to new replies.