Seamless embed with no scrollbars: what's our best option as developers on Wix?

Ask the community
,
1

Question:

Hi gang! We make a product that has an “embed in your website” feature. Need advice on how to make it work here.

It works great on plain old HTML sites. I’m unfortunately a little baffled at how to translate it into wix & the variety of developer platforms/frameworks/etc proprietary to wix.

Our “embed” feature can be used in either of two ways:

  1. “iframe method”: Dump an <iframe>, pointing to our hosted url, on your page; or
  2. “script method”: Dump a <div id="some-special-id /><script src="some-url"></script> tag on your site

The challenge: We want our wix customers to be able to embed our product without extra scrollbars. In other words, the flow of the page should just have a single (master/document-level) scroll bar). T

Our ideas:

  • <iframe> method: In plain old HTML, an iframe can only have a fixed height (say 600px or 100% or 100vw). Embedded javascript that is a peer of this iframe could dynamically resize the height of this iframe after content layout.
    • Wix-specific challenge: Not sure we can embed an iframe and a script together as peers.
  • <script> method: In plain old HTML, our script populates the special div with content and everything is laid out inline.
    • Wix-specific challenge: It seems like <script> embeds are constrained to a wix-managed “sandbox” iframe, so we’re back to problem 1.

The question: What’s the best way to achieve this on Wix? Thank you!

2

Hi, mikeybot !!

How about trying to write a CSS style to hide the scrollbar for now? :thinking:

3

No, the content is of dynamic height. So if scrollbars are showing, it means the enclosing iframe is not big enough (see “our ideas” #1).

4

So, the issue is that the height of the Wix HTML Component cannot be dynamically adjusted, correct? :thinking:

Generally, it’s not possible to dynamically change the height of an HTML Component in Wix. While it can be forced, it’s not a practical solution. The only other way to use regular HTML on a Wix page is by utilizing a “Custom Element.” :smiley:

You could create a Custom Element, include an <iframe> tag within it, and load your code there. This approach might help resolve the scrollbar issue and offer more control. :raised_hands: