Can I apply the lazyload image attribute in the Webflow Designer using a regular image module instead of the embed module?

Yes, you can apply lazy loading to regular image modules in the Webflow Designer by adding a custom code snippet to your project. Lazy loading is a technique used to defer the loading of non-critical images on a webpage, resulting in faster initial page load and improved performance.

To implement lazy loading for regular image modules in Webflow, you'll need to follow these steps:

1. Add images to your site using the regular image module in the Designer.
2. Give each image an appropriate alt text and set the desired width and height attributes.
3. In the Designer, navigate to the page where you want to apply lazy loading to the images.
4. Open the page settings by clicking the gear icon in the right-hand panel.
5. Under the Custom Code tab, scroll down to the Footer Code section.
6. Add the following script to enable the lazy loading functionality:

```html

```

7. Save the changes and publish the site.

This script adds a lazyLoad() function that is triggered on page load, scroll, resize, and orientation change. It selects all the `` elements with the `data-src` attribute and assigns the URL stored in `data-src` to the `src` attribute. After the image loads, the `data-src` attribute is removed, indicating that lazy loading has been applied.

By following these steps, you can successfully enable lazy loading for regular image modules in the Webflow Designer, improving the overall performance of your website.