Since the recent theme/wordpress updates, our images are not rendering correctly.
The default space between an image and the next paragraph is no longer present. This happens whether it is a single image or an inserted gallery.
We can manually get around this issue by adding a custom bottom margin to the image block, but as we typically publish a lot of images, the workaround is not ideal.
Any help getting this resolved would be much appreciated.
Hello,
Please provide a link to your post when this issue appears.
Also, please provide some screenshots of the content posted in the editor.
Thank you!
Hi Anamaria,
Here is one example. Third image down, no space between image and text starting “Plumbed with a 320W TGP…”
Here it is in the editor.
This happens on every inserted image or gallery, though manually adding a caption circumvents the issue.
Hi,
This is strange, normally the settings should apply to all images inside the post content.
Did you add an extra class for that image?
Thank you!
Hi Anamaria,
No extra class. The same issue applies to all our existing articles; they used to render just fine but following the latest updates we have no gap between image and paragraph.
We are running the latest versions of Newspaper and WordPress.
Hi,
Please use this custom code CSS ->
.tagdiv-type figure img {
margin-bottom: 21px;
}
Set the code in the Theme Panel -> Custom Code -> Custom CSS.
Thank you!
Hi Anamaria,
The custom CSS helps, thank you.
Any idea what might have caused the issue, and is this something that’s likely to be fixed in the next release?
The reason I ask is that the blanket CSS workaround causes issues in other areas. For instance, if we use a rich layout ‘media and text’ block, the image has a forced 21px bottom border, making the background colour visible. Here is an example.
Hi,
I don’t know exactly what the problem is. Maybe in the last update of WordPress, new options were added for create pages and layouts and maybe interfered with the theme.
Thank you!
I hope it is something that will be looked into more extensively, as correct image rendering is crucial for any theme.
Turns out this issue is also affecting the mobile plugin. When viewed from a phone, images are also missing the relevant spacing.
Hi,
I added this issue on our list.
You can use this custom code until the problem is solved.
.td-post-content figure img{
margin-bottom: 21px;
}
Set the code in Theme Panel -> Mobile Theme -> Custom Code -> Custom CSS.
Thank you!
Hi Anamaria, thank you for adding the issue to your list. Was there any news on permanent fix?
Hello,
Both are working; you can use the code that you want.
Thank you!
Just a quick update to say this seems to have been fixed in version 12.2. Thank you.
Hello,
Yes, it was fixed.
For updates, please do a full backup of all files and databases, and if you have a plugin for security, please deactivate them during the update process.
Thank you!
@theheritagelab I may have jumped the gun slightly. While it does appear to be fixed on desktop, the spacing issue remains on mobile when using the mobile plugin.
@Anamaria it would be great to have this fixed on mobile too.
Hello,
This fix should apply also to the mobile theme.
Thank you!
