šŸš€ [PLUGIN] Advanced iframe / Embed website

Showcase
66

Love the plugin and everything is working great! Is there any way for a Bubble app (parent container) page to know when the URL changes within the advanced iframe? The content within the advanced iframe is my own, from another Web server, but I need to know when the URL changes within the iframe so that the Bubble app can move on to perform other workflow tasks, such as show other form buttons.

67

Unfortunately thatā€™s not possible due to security reasons

68

Hey! How can we make the iframe cover the whole group area instead of going full screen? That way it doesnā€™t over lap on our menu sidebar.

69

Hi there,

I think you need to play with Z-index (probably using custom css).

70

Hello again,

I have been experiencing some issue with your plugin in respect of the scrollbars.
When i place the Iframe in the screen i see 2 scrollbars, one of the iframe and one of the original page. Any way to solve this problem?

Best,
Tomer

71

Hi,

This is probably because the iframe is too big to be rendered without a scrollbar?

You can also add custom css, something like:

.scroll_div {
  -ms-overflow-style: none; /* for Internet Explorer, Edge */
  scrollbar-width: none; /* for Firefox */
  overflow-y: scroll; 
}

.scroll_div::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}
72

Sam,

What causes the trigger when thereā€™s a error with the iframed website? If I want to close the iframe when a form is complete, I guess I can redirect to a invalid website?

73

Hello,

Your plugin allows to set the size.
Is it possible to have a advanced resizing features to crop the top 100 px for exemple (to hide the website nav bar) ?
Hope i am clear
Thanks

Best
E

74

Hi there,
You can try to use custom JavaScript, hereā€™s an example:

Note that this approach will not probably work if the pages are not on the same domain.

76

Iā€™m building a bubble app that requires a user to add a code to their website. Just like Intercom, Drift, Klaviyo and other software that require the website admin to add a piece of code to their website for it to work.

Can I do that with your Plugin?

Thank you

77

Hi @BubbleSam hope you are doing well. I am trying to add a aws quicksight dashboard to my app using the pluggin but unfortunately, it is showing error. Can you please help me with this ?

78

Can someone give an example of how I would use the workflow ā€œiframe url is invalidā€ with a list of urls to automatically hide the iframe when the url is invalid? Right now when Iā€™m toggling through urls it seems to only trigger when the iframe is removed, not added, which means Iā€™m hiding the wrong url. Does that make sense?

79

Hi Sam,

Is it possible to run Whatsapp Web inside an iframe, letā€™s sayā€¦

Tks, in adavance.

80

Hi @BubbleSam how can I inject further iframe attributes as allow=ā€œpaymentā€" the easiest way?

82

Iā€™m seeing strange behaviour of the plugin here. Iā€™m attempting to run a webpage from my site on another one of my pages through the plugin. However, when the plugin is visible the page/plugin keeps refreshing and I see a rate limit error from my own Bubble.io site in the iFrame window? When I tick the ā€œFullscreenā€ box the iFrame seems to work but I do not want the iFrame full screen. @BubbleSam

1 Like
83

Is there a way to hide the scrollbar? I want to allow scrolling, but with an invisible scrollbar. Can I do this via CSS?

84

I have spent a week trying to figure this out on my own with no luck. I have a popup with an Advanced iframe in it. The URL of the iframe is dynamic depending on what a user clicks.

The problem is I can only get the iframe to work the first time in each user session. Based on my research, the iframe doesnā€™t like getting resized, which I assume includes hiding it in a popup. Iā€™ve found potential solutions to use java script to fix this issue [see here - javascript - Whatā€™s the best way to reload / refresh an iframe? - Stack Overflow].

Iā€™ve tried adding a workflow action after I hide the popup to ā€œRun Javascriptā€ and added the script " ```
document.getElementById(ā€˜iframeidā€™).src = document.getElementById(ā€˜iframeidā€™).src

I have zero experience with Javascript so maybe I need to add something else to the script to make it work?

I am open to any alterative solution to make the iframe use dynamic content each time it is opened from a popup.  The one thing I really want to avoid is putting the iframe on a different page or refreshing the whole page...I am building a single page app.  

Any suggestions will be much appreciated
85

Hi @BubbleSam ,
I am using your (wonderful !) plugin to display private file but i have errors in the browser.

image
image900Ɨ232 16.6 KB

Would you have any idea ? I suspect that having private file creates problem of authorization in the iframe then there is a redirect (by your plugin I guess) and then it works. But itā€™s not very clean.

Thanks in avdance for your help !
Sylvie