How can I obtain the dynamically generated CDN URLs for the images in my Webflow CMS?

Published on
September 22, 2023

To obtain dynamically generated CDN URLs for the images in your Webflow CMS, you can follow these steps:

  1. Access your Webflow project: Log in to your Webflow account and navigate to the project where the CMS images are stored.

  2. Go to the Collection Editor: In the Editor, click on the "Collection" tab in the top-right corner of the screen. This will take you to the Collection Editor.

  3. Navigate to the Image field: In the Collection Editor, find the Collection that contains the images you want to obtain the CDN URLs for. Click on the field name of the image field. This will bring up the field settings on the right-hand panel.

  4. Enable dynamic URL: In the field settings panel, toggle on the "Enable dynamic URLs" option. This will allow you to use the image URLs dynamically.

  5. Retrieve the image URL: In your website's code or CMS design, you can now use the field name wrapped in curly braces, followed by ".url." For example, if your image field is called "image", you can use {{image.url}} to retrieve the dynamically generated CDN URL for the image.

  6. Apply the URL to the relevant element: Use the obtained URL to apply it to the "src" attribute of your HTML "img" element, or wherever else you intend to utilize the image URL.

By following these steps, you will be able to obtain dynamically generated CDN URLs for the images in your Webflow CMS. This allows you to have greater control over how the images are displayed and accessed on your website.

Example:

<img src="{{image.url}}" alt="Image">

This code snippet will insert the dynamically generated CDN URL for the image into the "src" attribute of the "img" tag.

Now, your images will be served from the Webflow CDN, ensuring fast and optimized delivery to your website visitors.

Additional Questions:

  1. How do I enable dynamic URL for other fields in Webflow CMS?
  2. How can I optimize images for better performance on Webflow?
  3. Can I use custom domains with Webflow's CDN for serving images?