Web Embed Component

Unfortunately will not allow me to add a script :frowning:

I was hoping to embed my HubSpot chat into my page - is there any other way to do this?

1 Like

There is a bit of a trick to that.

This is something I discovered and initially implemented in my own app:

But after some discussion with a couple of other experts, instead of uploading an html document, you could simply create a template column to hold your embed code, and a simple javascript column where you pass in your embed code, and return a URI that you can place in a web embed.

return `data:text/html;charset=utf-8,${encodeURIComponent(p1)}`;
1 Like

Thanks! Not sure I 100% sure I follow this however!

Will take a bit of figuring out! Would you be so kind as to give me a bit more details, I’m still new to glide and JavaScript, this is the code I’m trying to use:

<!-- Start of HubSpot Embed Code -->
  <script type="text/javascript" id="hs-script-loader" async defer src="//js-eu1.hs-scripts.com/xxxxxxxx.js"></script>
<!-- End of HubSpot Embed Code -->

How do I set this up exactly? Thanks!

Create a text column and place your code in that column cell, OR create a template column and put that code in as the template value. The goal is to get your code into one or many cells within your table.

Then create a javascript column and put in the code that I included in my previous post. Set the replacement value for p1 to point to the column that contains YOUR code.

That should be it. Point the web embed component to that javascript column and hopefully it should work.

In theory, it should work. I’m not getting anything to show up with the code you shared, and I’m not sure if I should, but that should be all you need.

This is what I have but doesn’t seem to be working:

That should be it. It’s creating the value you need to use in your web embed.

I wonder where I’m doing wrong! Ok well I’m on the right track at least!

What do you think is wrong? What are you expecting to happen?

Well my little floating chat div should appear!

Are you using the correct code? What you shared is just a script with no HTML elements. Based on a quick google search it seems to me that the code you shared is just for tracking. Is that truly for the chat div?

I guess I really don’t know. I’m just guessing, but it seems like you are missing something in your code. I’m not familiar with hubspot, so I can’t help much there.

It’s also possible that there is some sandboxing going on. Usually javascript and web embeds are sandboxed from the rest of the app, so I don’t know if it’s preventing something from working or not. With what I implemented in my app, I basically created an html document, but there is javascript inside of that html that I know does run, so I feel like it should be possible. I really don’t know how a floating chat would work though.

I think there something blocking it, I really need to add the code into the footer or header of the site. It’s working fine on my WordPress site.

I’m not sure. Maybe it’s not possible in this case.

did you manage to get this to work ?

Couldn’t you just embed it somewhere else that supports that and then add it into Glide? You could also make a data url, but that might not be reliable or work for other people.