Text flow around an image
In the classic editor, this was easy. But most of us are using the WordPress (Gutenberg) editor now.
How to have your text flow around an image? By “flowing,” I really mean flowing, no fixed columns that look ugly once the screen size changes.
Making text flow around an image in the WordPress (Gutenberg) editor is a lot easier than you think! – I’ll show you!
How to make text flow around an image
- Select a Group block (yes, the native one).
- Set it to Group (not one of the other options).
- Add an image block (native) and choose a nice image.
- Add a Paragraph block (native) and provide some text (lore ipsum)
- Still looks a bit odd, doesn’t it?
- Now set the image block to left alignment (or right).
- Done.
PS: Flow around only works with left or right alignment; centered won’t work (and might be hideous).
This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor.
Same setup, but with a Kadence image block and Kadence text block, in the same Group block.
This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor. This is just paragraph text to show you how to have text flowing around an image within the Gutenberg editor.