feat: improve the lazy loading tab

[Soare-Robert-Daniel]

All Submissions:

• Have you followed the Optimole Contributing guideline?
• Does your code follow the WordPress' coding standards?
• Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

Reorganize the lazy load and scaling settings:

• Modify the Lazy Loading tab based on the wireframes
• Modify the PHP code for the new viewport|fixed option
• Clean up other tabs
• Notice when trying to disable settings related to lazy and scaling https://github.com/Codeinwp/optimole-service/issues/1551

Current status

Closes https://github.com/Codeinwp/optimole-service/issues/1559

How to test the changes in this Pull Request:

1. Check if the changed settings are still working

Other information:

• Have you added an explanation of what your changes do and why you'd like us to include them?
• Have you written new tests for your changes, as applicable?
• Have you successfully ran tests with your changes locally?

[Soare-Robert-Daniel]

@selul @ineagu, here is how it looks for the Formbricks survey integration with the modal notice when a user tries to disable an important lazy load option.

Issue Reference: https://github.com/Codeinwp/optimole-service/issues/1551
Development Mode Survey: https://app.formbricks.com/environments/clo8wxwy044olpm0gn83ihta6/surveys/cmfv2kgzt0o2lvq019y7vh9y4/responses?referer=true

2025-09-22_15-38-15.mp4

[ineagu]

@Soare-Robert-Daniel can't we embed somehow the survey in the popup? if not it's fine

2. The Keep enabled button, should be " keep enabled and get help" which would open in a new tab : https://optimole.com/contact/, prefilled with user site + subject : [Lazy load issue] which "lazy load" is the setting he is trying to disable.

What do you think?

[selul]

we should call this if viewport is enabled + optimization is not done for the current url || viewport is disabled.

[Soare-Robert-Daniel]

@Soare-Robert-Daniel can't we embed somehow the survey in the popup? if not it's fine

I tried to use the embedded form of Formbricks, but it's pretty wacky. I do not recommend.

2. The Keep enabled button, should be " keep enabled and get help" which would open in a new tab : https://optimole.com/contact/, prefilled with user site + subject : [Lazy load issue] which "lazy load" is the setting he is trying to disable.

I see Gravity Forms has a nice feature in which we can prefill with just the URL: https://docs.gravityforms.com/allow-field-to-be-populated-dynamically/

[ineagu]

okay, we can keep it as you are doing now.

[Soare-Robert-Daniel]

@ineagu, here are the interactions with the new changes (including the notice with prefilling)

2025-09-23_16-39-37.mp4

For the skip lazy load number input selector, I had to put it separately from the text since the embedding was creating a weird focus issue.

[pirate-bot]

Plugin build for 8c9de99 is ready 🛎️!

• Download build
• Download dev

[rodica-andronache]

• from what I understand, Smart Image Scaling should be removed from the Resize panel, as right now it's duplicated, both in Resize and Lazyload

[rodica-andronache]

@Soare-Robert-Daniel

• there are some small differences from the suggested texts

• on smaller screens, the notice looks like this, not sure if it's ok

[Soare-Robert-Daniel]

• there are some small differences from the suggested texts

Fixed

• on smaller screens, the notice looks like this, not sure if it's ok

Yes. This is how the Gutenberg component behaves, which can also be verified in https://wordpress.github.io/gutenberg/?path=/docs/components-modal--docs, like in the screenshot below:

[Soare-Robert-Daniel]

I added the Lear Mode link for https://github.com/Codeinwp/optimole-service/issues/1515 as part of the toggle description.

[rodica-andronache]

from what I've tested, it's working well