Fixing Incorrect Word-Wrapping in Text Modules due to Non-Breaking Spaces

Written by Dan Mossop

If you're having problems with words in your Divi builder text modules wrapping strangely, e.g. moving onto the next line even when there is clearly space for them on the current line, it might be caused by "non-breaking" space characters in the text.

" " is the HTML code for a non-breaking space – which looks like a space, but is treated as part of the adjoining word(s) when it comes to wrapping. These characters are pretty easy to accidentally pick up when copying and pasting text, etc. This is particularly true when using the Divi Theme's visual builder, since it adds non-breaking spaces as a way of representing newlines in the text.

You can use the following PHP code to automatically remove non-breaking spaces from within the text content of your text modules. Note that it leaves nbsp characters which are functioning as newlines in place, to avoid affecting the spacing between paragraphs.

add_filter('et_pb_text_shortcode_output', 'dbc_replace_nbsp_with_spaces');

if (!function_exists('dbc_replace_nbsp_with_spaces')) {
	function dbc_replace_nbsp_with_spaces($content) {
		$nbsp = '(&'.'nbsp;|\xc2\xa0)';
		$not_preceded_by = '<p>';
		$non_newline_nbsp = '(?<!'.$not_preceded_by.')'.$nbsp;
		return preg_replace("/{$non_newline_nbsp}/", ' ', $content);
	}
}

Run PHP Code Directly in your Divi Layouts

Unlock endless customization, automation, and dynamic functionality by seamlessly adding PHP code to your Divi pages and posts with the Divi PHP Code Module. Style, preview, and debug your PHP creations directly in the visual builder with robust error handling and enhanced security. Perfect for resolving text module issues, such as non-breaking spaces in your Divi Builder.

About Dan Mossop

Dan is a Scottish-born web developer, now living in Brisbane with his wife and son. He has been sharing tips and helping users with Divi since 2014. He created Divi Booster, the first Divi plugin, and continues to develop it along with 20+ other Divi plugins. Dan has a PhD in Computer Science, a background in web security and likes a lot of stuff, 

4 Comments

  1. This is so suprisingly great piece of code that I had to come bask here and say: thank you very much! You made my websites so much easier to develop! :)

    Reply
    • Thanks, Michal! Glad it helped :)

      Reply
  2. Thank you for posting this! I have one Divi site out of dozens that has this behavior. I'm not sure why, but your code fixed the problem.

    Reply
    • You're welcome, Pat! Yeah, I'm not quite sure why it happens on some sites and not others. I'm glad that the code helped anyway :)

      Reply

Submit a Comment

Comments are manually moderated and approved at the time they are answered. A preview is shown while pending but may disappear if your are cookies cleared - don't worry though, the comment is still in the queue.

Your email address will not be published. Required fields are marked *.

We may earn a commission when you visit links on our website.

Latest From Divi Booster

How to Add the Post Status in Divi's Dynamic Content

Divi's Dynamic Content feature is great for enhancing your post/page templates with post-specific information. While Divi includes an option to show information such as the Post Created Date using Dynamic Content, there is no equivalent option for the Post Status....

Fix Divi Text Module "Regular" Font Weight Not Working

Are you encountering an issue where the font weights in Divi's Text Module don't seem to apply as expected? In particular, you might find that when you set the text module's body text font weight to "Regular", your font is actually assigned a weight of 500 instead of...

Make the Divi Gallery Module Swipeable

The Divi Gallery Module comes with a slider mode that lets you display images in a slider with clickable left/right arrows to scroll through the images. For mobile / touchscreen users, you can improve the user experience by allowing your user to swipe to navigate to...

How to Use Divi Dynamic Content in Woo Modules Product Selector

Divi's Dynamic Content is a powerful feature that lets you populate your Divi modules and theme builder templates with data pulled in various sources, such as custom fields. This allows for efficient organization and maintenance of your sites.Unfortunately, Divi's...

Random Divi Posts