Did you know that you can paste images directly from the clipboard into Webflow's Rich Text elements, when you're in Editor mode?
But... at least on Windows... there's a catch... You can only paste images that you have copied from a public webpage.
If you've taken a local screen capture, you're out-of-luck.
Here's why, and here's how to overcome that limitation.
Why I care
Personally, I like to do my final editing work in the Editor's WYSIWYG mode, so that I can see exactly how my content will be presented on a desktop.
In fact right now, as I'm writing this, I'm working in Webflow's editor mode.
But one of the biggest challenges here has been adding images quickly and easily. Images thwarted this process, because they needed to be screen captured, saved, and then uploaded.
What a pain.
One day I noticed that if I copy content from a webpage, Webflow is able to import those images directly into the rich text content - and it does so in a legit way, so that they become part of Webflow's own assets hosting.
What is this magic?
So I searched, and I came across this...
Pasting images into rich text fields now just works
The Problem
The problem is that this solution only works if you're pasting HTML, and the images are referenced within that HTML. Then, Webflow downloads them, stores them, and integrates them into your pasted content.
Sweet.
But incomplete.
If I have an image or a screen capture on my clipboard that I've captured locally, I cannot just paste it. Nothing happens at all.
The Solution
Here's how to work around this...
- Capture your screenshot using whatever tool you like. My current fav is SnagIt.
- Then paste it into an online service that support pasting and displaying images. For me, I like snipboard.io.
- Once the image is visible there, right-click copy it, and you'll get HTML on the clipboard.
- Paste into the Webflow editor.
Someday I'll automate this.
Important
I haven't yet tested this technique in every possible edit mode for the Rich Text element, since I'm mainly in the WYSIWYG Editor when I do this.
But I think it should work in
- + Editor on-canvas
- Editor in-CMS
- Designer on-canvas ( would only be possible for RTEs that are not CMS-bound )
- Designer in-CMS
