Optily

How to integrate Optily with Webflow

Large image files slow down page loads and hurt Core Web Vitals scores. Manually compressing images before uploading to the Webflow CMS adds friction to content workflows, especially for sites with hundreds of blog posts or product pages.

Optily connects to Webflow through the Optily marketplace app, which uses OAuth authorization to process CMS images in the background without requiring custom code or site republishing.

Use the Optily marketplace app

The Optily marketplace app connects directly to Webflow sites through OAuth authorization, requiring no API keys or custom code implementation. This method works for all Webflow plan tiers and processes images through Optily's web interface. The app is designed specifically for CMS images and does not optimize static site assets like logos, hero images outside CMS, or icons.

Install the app from the Webflow Apps marketplace, then authorize the OAuth connection to grant Optily access to your CMS collections. The authorization flow follows Webflow's standard security protocols, requesting only the permissions necessary for image access and optimization. Once connected, select which site to optimize and choose between quality-focused compression or WebP format conversion. 

Note: Embed elements cannot be retained when optimizing rich text field images, so test this functionality carefully if your content relies heavily on embedded media.

The app supports the following capabilities:

• CMS image field optimization across all collection types
• Gallery field support for optimizing multiple images in a single operation
• Rich text image processing with compression (embed elements cannot be retained due to API limitations)
• Ecommerce product image optimization for product photos and variant images
• Batch processing across entire collections rather than individual images
• Task monitoring through Optily's dashboard with email notifications on completion

The optimization runs in the background without requiring site republishing, updating only images located inside Webflow CMS collections (not static assets outside CMS).  

Optily only optimizes images stored in CMS collections. Static assets uploaded to Webflow, background images in CSS, and assets in the general asset panel remain unaffected. For comprehensive site optimization, combine Optily with Webflow's native image conversion tool, which handles conversion of static assets to AVIF or WebP formats.

What you can build

Integrating Optily with Webflow enables automated CMS image optimization workflows that improve site performance through image compression and WebP format conversion.

• High-volume CMS blog platforms: Batch-process images across entire collections to reduce bandwidth consumption and improve load times for text-heavy articles with multiple inline images (Optily only optimizes CMS-hosted images, not static assets outside collections)
• Ecommerce product catalogs: Optimize product photos and variant images automatically through Webflow CMS image optimization, improving checkout page performance where speed directly affects conversion rates
• Agency client sites: Standardize image optimization across multiple client Webflow projects through a single Optily dashboard, maintaining consistent performance standards without per-site manual work
• ‍Portfolio websites: Maintain professional visual quality for high-resolution work samples while reducing file sizes through WebP conversion, enabling faster page loads without compromising the visual fidelity required for portfolio display