CMS | Rich Text | How to use non-webflow asset image?

Design help CMS
1

I can’t figure out how to add an image hosted on my CDN to a blog post (Webflow CMS collection). The only obvious options are image (which prompts for a direct upload) or “Paste a link to embed rich content” – which results in an error message when you link to a PNG or JPEG.

I just want to put an tag and style it a bit. Why is this so not obvious?

Here is my public share link: LINK

1 Like
2

Maybe it’s not THAT obvious, but it’s fairly simple as you’ll see.

You’re not going to use a Webflow image element, but a custom code component.

Your custom code component MUST be placed inside of a Collection list OR inside of a CMS Template Page.

Inside of your collection, you’ll add a URL field if you want to use the complete URL (ie: http://www.mysupercustomCDN/images/image.jpg) or, if most of the URL is predictable (doesn’t change), a text field. In the URL field you’ll put the complete address for the image (http://www.mysupercustomCDN/images/image.jpg), and on the text field, if you chose it, you’ll only put the name of the file (image.jpg).

http://vincent.polenordstudio.fr/snap/3i27w.jpg

Let’s consider you’re using the text field and add only the name of the image to the CMS items.

Drag a custom code component inside of the Collection List or Template Page.

Add an HTML code for an image

http://vincent.polenordstudio.fr/snap/bom6h.jpg

Select the part of the code that will change (the file name) and click on +Add field, then select your CMS field

http://vincent.polenordstudio.fr/snap/mzq62.jpg

Now you have a dynamic URL that will display your CDN image referenced in the CMS collection

http://vincent.polenordstudio.fr/snap/0mszq.jpg

You want to easily style this in Webflow? Add a class in the code.

http://vincent.polenordstudio.fr/snap/utayg.jpg

Now drag any image in the Designer and add the class to it

http://vincent.polenordstudio.fr/snap/zmzjw.jpg

Style it as desired and delete it. Your CDN image will be styled the same way.

3

Thank you for your efforts, but this does not address the question. This uses pre-defined fields which are modifications to the template. To put it in template terms, the images occur inline with the article content and vary in number, style, and type – they are not part of the template’s rigid arrangement, but it’s flexible “rich text” content.

Why is it so difficult to do basic blog/help/support articles with Webflow? That is the original use case for CMS’s. That’s why CMS’s exist.

As a point of order… (because I’ve been at this too long and I no longer have sufficient impulse control :wink:

  • There is no definition of obvious that makes your procedure compliant to that definition, so stating that it isn’t “THAT obvious” is also not correct. It’s simply not obvious/not possible.
  • Stating that it’s simple doesn’t make it so. It actually has to be simple to qualify.
  • Any solution that begins with “your… going to use… a custom code component” is, by definition, a worse process with Webflow involved than without it (if I’m just going to code everything, why fight against the Webflow UI?).

Sorry. I really want Webflow to be great. It’s got so much potential. Please don’t turn in to another “website builder”.