Adding Codepen with Babel (JS) as Website Hero not loading

k-oranje · 2020-07-28T15:43:44.508Z

Hi there,

I found this Codepen VIEW HERE but am unable to get the JS part working for the Hero to be placed in an HTML element.

I took the HTML and added the “style tag” for the CSS to it and place the script tag on the top with the code that is in the Babel (JS) part.

It does not seem to work or load…And I can’t seem to figure it out. I know there is one library involved so not sure how to add the source of it to the HTML. A simple <script src “”> does not work.

Can anyone help out? Really want to get the hang of this

Thank you!

lottemint.md · 2020-07-28T17:53:52.221Z

Hello,

Try to add the following one on a Page’s header:
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.1.3/TweenMax.min.js"></script>

In short, this library should be initialized before when you’re trying to use it.
If you use it before initialization, you will have errors.

Also, please user your browser’s console to manage errors.

k-oranje · 2020-07-28T18:27:25.102Z

Hi,

Tried to add it but got this error:

“1595960384374x394690370132599400”

I added the script in the page header bit it still does not work…

Do you have time to look at it?

https://bubble.io/page?name=index&id=voiceuserjapan&tab=tabs-1

Thank you!

lottemint.md · 2020-07-28T18:47:56.100Z

It works now. Check it out, please.

The problem is that you cannot use the HTML header on a free plan.
So, in that case, you need to place the JS code of the library.

image1372×814 40.8 KB

k-oranje · 2020-07-28T19:22:38.485Z

Perfect, thank you so much! So if I have a paid app I can just add the source link in the header of the page?

lottemint.md · 2020-07-29T09:48:00.028Z

You’re welcome!

k-oranje:

So if I have a paid app I can just add the source link in the header of the page?

Yup.

system · 2020-10-06T15:43:44.612Z

This topic was automatically closed after 70 days. New replies are no longer allowed.