If I embed a block on my website, modal windows opened from that block do not work properly. They pop up in the middle of the embedded block – rather than in the middle of the viewscreen – and scrolling is next to impossible.
Video: Apply to Join the Mental Health Moonshot Community — StartUp Health
Is this a known bug with an estimated time to solve it? Or do I need to open things in new tabs instead? (A less desirable UX than a properly behaving modal.)
Modal behavior has been an afterthought for Softr. Their functionality seems to be limited to details blocks only. For instance:
Modals would be a great feature, if they followed through with them.
Thanks for the feedback. Good to know.
Same problem here. The modal on an embedded page can’t get the location info from the parent window and is unusable. (Basically, the modal always open in the middle of the page and locks scroll. So if the iframe is a bit long the modal will open out of view and can’t be scrolled to). Customer service not helping. As anyone found a custom code way to fix this ?
I was about to post about this same issue. I am using the grid view to display various participants in events using block embeds to a Wordpress site. When you have more than 12 or so grid cards, this becomes a noticeable issue. I am switching to the list view with expandable second section for the time being, but the grid / card view is more what I am looking for. One workaround I did find was to add a child / parent listening custom code in your website and softr gallery footers to instruct the embed blocks to move up to the modal pop up. However, I found this behavior to be a little inconsistent and would take further coding work to function properly.
EG: When you embed a Softr gallery in WordPress using iFrameResizer, modals (like image lightboxes or detail popups) open way up at the top of the iframe instead of where the user is scrolled.
Potential Solution: Use a simple parent/child listener setup so the Softr page can “tell” the parent page when a modal opens, and the parent scrolls the iframe into view.
How it works:
Softr (child) watches for a modal to appear and sends a message.
WordPress (parent) listens and scrolls the correct iframe into view.
Works with multiple Softr embeds on the same page.
Result: Modals are visible to the user without breaking iFrameResizer’s auto-height.
Hi Matt, Thanks for posting this, it’s the direction I’ve been trying to go, but to no avail. Could you share the code used to set it up ?
Has this modal issue been solved as of yet, we too experience the issue where, if the page size is too big, the modal functionality does not work correctly (placement of the modal popup is too low or too high on the page).
Also has major issues (modal) on mobile browsers, to the point that is essentially unusable in most cases?
Why have this functionality available to use, if, it doesn’t work correctly? It does work correctly if you do not embed the page in another page, so, if you use it native to a SOFTR based website itself, model works fine, it is only an issue (for us at least) when using it with pages that are embedded in another site (99% of what we use SOFTR for).