Quick Start Information

Getting Started

Here are some of the basics to get started with Optily.

Getting Started

Using Optily is super easy, but here are the steps to get started!

1. Create Optily Account


2. Publish your Website (Backup optional)

Please publish your site, Optily will only optimize your published items.

Your websites important, save a backup prior to optimization just hit - CTRL + SHIFT + S in the designer.  
We know you will love the results, but we also know peace of mind is valuable. If you're ever not 100% happy with the results, this is a quick and easy undo.

3. View Project Settings

4. Navigate to Integrations

5. Generate & Copy API Token

Here you can generate an API token to use with Optily. You can generate a new API token at any time.
We use your API token once to connect to your site, and since you can generate a new token everytime you use optily, you likely won't need to remember this.

6. Add your API token to Optily and validate the site

7. Select your Website

8. Wait for your estimated image count

Important - Please wait for your estimate image count. Depending on the size of your website this can take some time. Please allow up to 10-15 minutes for very large websites.

This estimate is based on the amount of image fields inside of your collection. You end credit usage may be less than the estimate. This is most often because of empty image fields, unsupported image types etc. We simply count the image fields inside your collections on this step.

9. Let it process and wait for success

Large websites may take some time to process - infact, the largest website we have seen took 2-3 hours to process.
This is a background task and will process regardless of you having the tab open. View your task history for updates

* Here you can see our total was 4 images less than the original estimate. This is because we had 3 image fields without an image and we had 1 image that was a SVG (unsupported)

Optily - Primary Information

Optily is a Webflow Image Optimization Tool that connects to your Webflow sites and provides an incredibly easy way to optimize & compress your Webflow images (jpg/jpeg,png). Optily partners with the TinyPNG API, which is the leading solution, used by millions to reduce image size without loss of quality. Chances are you're already familiar with tinyPNG!

The Optily tool can save you hours of work, by automatically optimizing a webflow site without the need for you to individually save images, upload to an optimizer, download, reupload etc etc etc.

Optily offers two solutions to optimization of your webflow images (a) the optimization of your collection images, like blogs, teams, articles etc. and (b) the optimization of your static images, like the ones you add in the designer to a page. See more details below:

(a) Collection images (CMS / Collections)

Images located inside your collections (CMS) (eg. blogs, teams, listings, case studies etc.) will be automatically optimized and re-published. We will provide an estimated amount of images, based on your total image fields and automatically optimize these, so you won't need to do anything once the process is started.

All items will be republished and you will notice the modification date will update to the time of process.

(b) Static Images (Non CMS Images)

Non CMS Images can be collected and provided to you via a .zip download. Unfortunately due to API restrictions we cannot automatically re-upload and replace these items. We have built a custom tool that uses your sitemap to collect optimize these images and provide an easy download.

Psst - if you have any concerns, remember webflows backup/restore is always there!
We are certain you will be over the moon with results, but you can always just save a backup or use an automatic backup in any case you aren't happy with the results. We say this because as creators we know your sites are closely guarded and we want you to feel 100% confident

Estimated Image Count

Please note that the estimated image count that we provide, is only an estimate and may not reflect your actual credit usage once we process images. In most cases the estimate is very close, and often the estimate we provide will be higher than your actual credit usage.

This is because the estimate is calculated by multipling the amount of image fields (within a collection), by the amount of collection items. So for example, if your blog collection has 50 posts, and each post has 2 image fields - we would estimate 100 images.

The following may be reasons for a lower or higher final credit usage:

- Some image fields may be left empty
- Some images aren't a supported format
- Some images are in drafts or archived (not published)
- Gallery Images vary, our estimate counts gallery images as 1, when it could be up to 20 images.

Here's some recent results, right from our backend

These are real tasks from our backend, taken at random.

If you have any questions about using optily, we're here to help.

Before & After examples of image quality - visit here https://www.optily.co/examples

Example from live customer site

Example from live customer site

Example from live customer site

Example from live customer site

What does this tool do?

Optily connects to your webflow sites, and provides an automatic way to optimize your webflow images without impacting their quality.

Optimizing your images can reduce their size by up to 80% and without quality loss, providing significant benefits for your SEO and UX.

Unless proactively completed prior to development, this can be a very manual process that requires webflow users to save images, run batch optimizing, download images, and replace them on each item. Trust us, it's not a fun task and it's important it's done properly.

We partner with the leading image optimization team at TinyPNG to deliver great results with ease.

a) Collection images (CMS)

Images located inside your Collection Lists (CMS) (eg. Blogs, Teams, Listings, Case Studies etc) will be automatically optimized and published upon completion. Please note we only optimize images that are published and a supported format.

b) Page images (Non-CMS)

Non CMS Images can be collected and provided to you via a .zip download. Unfortunately due to API restrictions we cannot automatically re-upload and replace these items. We have built a custom tool that uses your sitemap to collect optimize these images and provide an easy download.

This won't impact any of your settings, you can simple replace these 1:1 and enjoy the lighter version of the image.

What if I don't like the results? Can I backup before?

We believe you will notice no difference between the quality of images before and after optimization. The service uses smart technology to only optimize without detriment to the image. In fact, we're super transparent about everything - we use tinyPNG API, and you can test an image for free on their site.

We also built this page to show you examples directly - https://www.optily.co/examples

Please note - You are responsible for ensuring the integrity of your files, there is no warranty included with this service. You should ensure you have proper backups before using the service. Webflow offers incredibly robust backup service, and you can force save and learn more about this here

Under NO circumstances will Optily be liable to you for any cost arising from your use of the service.

How do I connect my website and start the process?

Once you have created an account, you simply need to Generate an API token from your Webflow Project Settings. We will use this key to capture your images, optimize them and replace. Please ensure you have published your website as we will only optimize images that are published. Learn more about this above.

How much does it cost?

Optily starts at $29.99 giving you 2,000 image credits.

2,000 credits covers a LOT of websites - in fact, most large websites have about 500-700 images.

For power users, we offer 15,000 credits for $99.99. This is really great value for those who plan to stick it out with Webflow and will be building large sites, serving clients etc.

👉 We may offer discounts to students or those living in countries with a struggling dollar. Just contact us :)
👉 If you're a maker with over 1,000 followers on a platform, we can provide credits for a small shoutout

How long does it take? Can I close the tab?

It's very possible that some of your images are HUGE, or that you have a significant amount of them. Small business sites on average take between 5-20 minutes, where as very large sites could take much longer. 

Once you start the process we will run the operation in the background. You don't need the tab open, or your computer even on for that matter. We will run the process in the background and you will be able to see the modified date updated as we process images.

You can also continue working on your website while the process is in operation.

What are the results like?

Results vary on the images individually, but optily can provide up to 80% size reduction without quality loss.

See some examples we compiled here

You can also see some real customer results in the quick start area.

We believe you will notice no difference between the image quality before and after optimization. We use tinyPNG API which is the leading platform for this type of image optimization. Plus - you can always save a backup prior to optimization if you have concerns

Can I optimize all my images? What are the limitations?

Yes, we provide optimization for both your collection (CMS) and page images (added in designer).

Please note collection images (CMS) will be automatically optimized, replaced and republished as we process your site. For page images (Non CMS), we will provide you with a downloadable zip that contains all your optimized page images. You can access this from the task history after site process is complete.

Please note that we will only optimimize published images, and supported file types PNG, JPG/JPEG image files.

Supported Image Fields:

1. Image Fields (Collections)
2. Gallery Fields (Collections)
3. Ecommerce Images Fields (Collections)
4. Image Elements (Pages / Non-CMS)

Currently Limited by API:

1. Rich Text Images

The following advanced features are on the roadmap for Optily. We welcome feature suggestions!

Custom Collection Control ✅ Added

Task History to display dates, names and status ✅ Added

Display data saving (eg 32% reduction) ✅ Added

URL connected symbol for page images ✅ Added

Improve connection process for static images ✅ Added