Bold Formatting Issues
I am experiencing strange formatting issues on my site. Sometimes the side bar and the footer appear bold and other times its not. Bold formatting may also appear in my post excerpts or within posts.
This issue could be caused by a couple of reasons. Read on below to see if either provides a solution for your issue.
Partial Formatting Code in Article Summary
This issue is usually limited to the home page and does not occur on individual posts. Acabado automatically pulls the first 300 characters from an article to create the article summary on the home page. If the first 300 characters of the article contains bolded text that continues on after the summary, the beginning bolded formatting code will get copied but not the end tags. Without these end tags the bold formatting will bleed over into other text on the homepage.
As in the example below, the first 300 characters of the top post contains a bolded sentence that continues in article. Acabado has grabbed the text (which included the code to start bolding) but the end bolding tag is left behind. Now all articles below this one and all sidebar text is appearing bold.
To correct this issue, simply open the offending post and remove all bolded text from the first 300 characters. You may need to repeat the process if there are multiple articles when bolded text. After removing the bolded text in the sample article, the bolding formatting no longer appears on the home page.
Lingering Code From Other Formats
Many text editors have default formats for type within their interface. This code goes unseen within the native platform, but can cause lingering formatting errors when the text is copy/pasted to another format. If you have created content in another source (like Microsoft Word, Google Docs, etc) and then copied that content into WordPress Gutenberg blocks you could have inadvertently introduced formatting code to your site. These code tags, while unseen in the standard visual editor, can alter the formatting of your content. Because these formatting scripts may have only partially copied it can also cause formatting issues that span beyond the copied content and bleed into other areas.
These easiest way to avoid this issue is by typing directly into the Gutenberg block editor. However, for some users, this is not optimal. If you do need to copy/paste from another location try this tutorial for pasting without formatting.
To correct the issue, you’ll need to find and remove the offending lingering code tags. There are two ways to search for and remove these tags.
1: Clear Initial 300 Characters
Often the lingering impartial tags appear within the first 300 characters of content. At the beginning of the section that appears bolded simply delete, save, and then re-type and save the text. This should remove the tags hidden in the content. You may need to clear your cache to notice changes. This is option works well for sidebars, author bios, excerpts and other areas that do not have coded text visual options.
2: Search Post Code Editor
In your WordPress dashboard, open a published post where you have copy/pasted content from another source. If possible look for posts added when you first started experiencing formatting issues on your site. Go to Posts > All Posts. Then ether click the Post Name or the “Edit” button under it.
To search out the errant code, change from the Visual Editor to the Code Editor by clicking the column of dots in the top right corner. Then select “Code editor” from the drop down.
This will change your post editor to show all code associated with this post. Now you want to look for any of the following:
- Orphaned or rogue scripts (these typically have a tag)
- All <span> tags. These can conflict with WordPress and create all kinds of formatting issues within posts.
- Incomplete formatting tags. For example a bolded word should have both opening & closing tags. Therefore THIS would appear as <strong> THIS </strong> in the code editor. If the either tag is missing the result can be continued formatting issues.
After deleting out the errant code tags, switch back to the “Visual Editor” and verify that your content is still intact. Then click “Publish” or “Update” to save your changes.
You may need to clear your cache and repeat the process on multiple posts depending on how frequently you move text from another location.