How to insert embed code that includes javascript?

For example, if a web service provides embed code like…

<!-- Start of Meetings Embed Script -->
<div class="meetings-iframe-container" data-src="https://meetings.hubspot.com/whatever?embed=true"></div>
<script type="text/javascript" src="https://static.hsappstatic.net/MeetingsEmbed/ex/MeetingsEmbedCode.js"></script>
<!-- End of Meetings Embed Script -->

How would you make this work on an FMBetterForms page?

Copy - paste the <script> into DOM Insertions, and rest into HTML element.

See docs for example on using 3rd party libraries as its nearly the same.

One thing to note, not all lib JS behaves the same, it may look for the iframe container when it starts up, which could be on another page.

For those scenarios, you need to run that script in the onFormLoad with something like this:

$.ajax({
  url:'https://static.hsappstatic.net/MeetingsEmbed/ex/MeetingsEmbedCode.js',
  dataType: "script"
});

ref:
https://api.jquery.com/jquery.getscript/

1 Like