Forum Academy Marketplace Showcase Pricing Features

Complete Guide on How to Build Chrome Extensions and Website Widgets in Bubble

Idea
#42

@matteo is this just iFrame based? Or will we learn how to build something that does a “javascript” style widget embed?

So this …

<div id="poryApp" data-domain="https://embedtest.pory.app" ></div>
<script src="https://pory.app/widget.js"></script>

Rather than…

<iframe src="https://embedtest.pory.app" style="border:0px #ffffff none;" name="myiFrame" scrolling="no" frameborder="1" marginheight="0px" marginwidth="0px" height="400px" width="600px" allowfullscreen></iframe>

Or is the widget actually an Iframe in a fancy costume? :slight_smile:

#43

This is massive. I have created Chrome Extensions using WebdGap… and it works, but it can’t read anything about where it is in terms or URL/Page data etc

1 Like
#44

You’ll use an iFrame to load the Bubble app!
Then the course is focused on how to communicate between the bubble app and the JS file (which actually has access to the DOM) where the iframe is defined (and added to the page)
M

#45

Do you know how to do the javascript widget?

1 Like
#46

If I correctly understood the question, YES. That’s what I do with Heyhi, join the 71 Lines private Slack Group so we can continue the conversation or schedule a quick call :slight_smile:

1 Like
#47

Hey bubblers,
My course on How to build Chrome extensions and website widgets with Bubble is now available!

Here a couple of reviews I received from happy customers:

  • Chirs says: " I love this course — Backend Workflows, Workflow API, CORS, would take me ages to figure out this stuff!"

    chris review
    chris review710×434 51.1 KB

  • Pablo says: " In 3 hours I learnt how to create a website widget from scratch… handling all the complicated stuff you need help with! "

    pablo review
    pablo review710×438 61.5 KB

And these are the projects that I cover if you buy the Bundle:

  • Chrome Extension that lets you save Twitter threads and read them later (after authentication). It also makes you interact with the current web page’s DOM (change page background, change/add/remove HTML divs)

  • Website widget to install on your website that let your website’s visitors book a call with you (picking a date from a calendar and leaving their emails);

Basically all the things that I needed to learn to build Heyhi :slight_smile:

PS On the website it’s available a limited discount package for early adopters :package: