Support » Fixing WordPress » Gutenberg keeps adding random code!

  • Hello.

    This has been happening ever since the update.

    Whenever I publish a blog on my site, I always check to see how it looks on mobile. 90% of the times when I do publish a blog, I find something like this:

    https://puu.sh/CBUOL/39d48de044.png

    I’m viewing my blog in mobile by using the inspect function when you right click on any page.

    That example isn’t as bad. Sometimes I have 5 words going off the page.

    When I check the code editor in the back end, I usually find this:

    https://puu.sh/CBURP/066f72a5ab.png

    Why do random &nbsp tags keep showing up? I understand that they’re the code for a space, but why does it always show up?

    • This topic was modified 1 year, 10 months ago by andyvnguyen.
    • This topic was modified 1 year, 10 months ago by andyvnguyen.

    The page I need help with: [log in to see the link]

Viewing 15 replies - 1 through 15 (of 16 total)
  • Moderator Samuel Wood (Otto)

    (@otto42)

    WordPress.org Admin

    The nbsp code is a “non-breaking space”. It’s a space that doesn’t allow word-breaks to happen on it.

    It’s generally inserted when you press SHIFT-SPACE. Or if you copy and pasted from some other document that had them in there.

    An nbsp is also inserted when you enter a number of spaces in a row. HTML doesn’t like extra spaces between things, as it collapses them. So when you type in more than one space in a row, every other one becomes an nbsp so that the horizontal space you’re trying to make is preserved.

    It’s just another of WordPress’ annoying habits. It will just throw them in randomly. And now you have to make 2 clicks to access the code editor as the direct link has unhelpfully been removed.

    @otto42 @digbymaass

    I see.

    Well, this is very inconvenient and frustrating to deal with. I had to go back and edit 20 posts because there were random nbsp codes everywhere.

    Is there a way this can be fixed? It’s making my mobile user experience bad!

    If that’s the least that WP throws at you, you are very lucky. I’m not aware of any solution but I haven’t looked. Try Google! Or maybe ask the TinyMCE plugin support if you are using it.

    @digbymaass

    I’ve tried looking for solutions for weeks now. It seems like no one else has reported this problem.

    I’m not using the TinyMCE plugin either.

    Moderator Samuel Wood (Otto)

    (@otto42)

    WordPress.org Admin

    It should not be throwing them in “randomly”. Only when they are actually needed or when something you’re doing is causing them to be input in that manner. The editor doesn’t create them all by itself.

    @otto42

    Well of course.

    What I’m saying is, I’m not doing anything out of the ordinary for the editor to create the tags. I’ve been using WordPress for years and this has only occurred after the Gutenberg update.

    @digbymaass

    I’ll make sure to check these out, thanks!

    Moderator Samuel Wood (Otto)

    (@otto42)

    WordPress.org Admin

    What I’m saying is, I’m not doing anything out of the ordinary for the editor to create the tags. I’ve been using WordPress for years and this has only occurred after the Gutenberg update.

    I get that, but at the same time, you’re not saying what the actual cause is. What are you doing, whether you consider it “ordinary” or not, that causes these non-breaking spaces to be put in the content?

    Because if you just type text, then it shouldn’t have those in there. A space is a space. Are you pasting these texts in from some other editor, for example? That is indeed a perfectly ordinary thing to do, but that would explain where the problem is coming from.

    Finding a solution to the problem means finding the root cause. The new editor has some enhancements about pasting things in from other editors, so knowing what you’re doing there would give us better information on how to solve the problem.

    @otto42

    Let me see what I can come up with.

    1) Whenever I write a blog, I always answer a question or make a summary, in bold. Then, I’ll actually create H2 Headers for each item in the list.

    Here’s an example: https://puu.sh/CCdpr/e58aef75dc.png

    I’ll copy and paste the specific list item and paste it in the Heading block.

    2) I never copy and paste text from another website, so I don’t think that’s an issue. If I’m copying and pasting, it’s content from my own site. And if I do paste, I’ll always paste as plain text.

    This is all I can really think of in terms of copying and pasting.

    I don’t add random blocks here and there nor make random spaces.

    ** An update **

    As I was working on my blog a little earlier, I pressed ctrl+b to start a sentence in bold. By the time I got to the right side of the block, only two letters of my last word was on the same line while the remaining 4 went down to the next line.

    I can’t show you a screenshot because I already fixed it, but let me know if you understand what I just said.

    This is also a common issue I found. To fix this, I have to copy and paste the entire paragraph using the paste as plain text option.

    And no, I’m not doing anything besides typing when these occur.

    • This reply was modified 1 year, 10 months ago by andyvnguyen.

    @andyvnguyen I’ve been having this same issue, it’s so frustrating! It happens for bold text only, so far as I can tell. I will also try copy and paste as plain text to see if that works. Thanks for posting on this, there is no other info about it.

    • This reply was modified 1 year, 9 months ago by tac3022.

    I’m having the same issue. Noticed wordpress randomly adding   to my posts and I can’t figure out why or how to get it to stop. It’s VERY annoying.

    I’m experiencing this issue currently, and it is driving me up the wall.

    Please, for goodness’ sake, take this predictive coding out or give us the option to take it out. Mine is duplicating entire links and divs all over the place.

    I’ll just follow that up with an example of how awful this is. Here is the code I wrote (unfinished – I’m in the middle of working on it):

    <a href="http://sidekickbooks.com/booklab/product-category/ruffian-ready-sale/">
    <div class="shelf" style="background-image: url('/images/ruffianreadysalebanner.jpg'); background-color: white; background-position: left bottom; background-size: 50vw; background-repeat: no-repeat; height: 20vw;">
    </div>;
    </a>

    And here is what happens the moment I click anywhere on the page:

    <a href="http://sidekickbooks.com/booklab/product-category/ruffian-ready-sale/">
    </a>
    <div class="shelf" style="background-image: url('/images/ruffianreadysalebanner.jpg'); background-color: white; background-position: left bottom; background-size: 50vw; background-repeat: no-repeat; height: 20vw;"></div>;
    <a href="http://sidekickbooks.com/booklab/product-category/ruffian-ready-sale/">
    </a><a href="http://sidekickbooks.com/booklab/product-category/ruffian-ready-sale/"></a><a href="http://sidekickbooks.com/booklab/product-category/ruffian-ready-sale/">
    </a><a href="http://sidekickbooks.com/booklab/product-category/ruffian-ready-sale/"></a>

    It is literally impossible for me to actually edit my pages in the way I want to at the moment. As soon as I take this crap out, WordPress adds it in again.

    • This reply was modified 1 year, 9 months ago by focksbot.
    • This reply was modified 1 year, 9 months ago by focksbot.
    Moderator Samuel Wood (Otto)

    (@otto42)

    WordPress.org Admin

    You can’t put a div inside of an a. That’s not valid HTML code.

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘Gutenberg keeps adding random code!’ is closed to new replies.