Bubble's Youtube Plugin - shortened link & full video embeds?

Right now on Nucode.co/learn we allow anyone to upload a Lesson for the community via Youtube embeds using the Video ID for that video (normal Bubble Youtube plugin)

Not great for UX. :sweat_smile:and I can’t seem to find a good alternative for what I need.

To make it easier for creators, I’d like to allow them to add new videos via:

  1. Shortened link apps like Bitly.

or

  1. Allow them to give me the full links. Is there a regex formula I should use as a conditional? Any way to split up Bitly Link vs Video ID vs Full Youtube Link?

Cheers!

3 Likes

I can’t seem to find the link, but there was a post in this forum that helped me solve option 2 on your list (at least the part about adding full YouTube links).

You could allow users to paste the full YouTube link and save the link in your db. Then, dynamically enter the video id into the property editor as follows:

(whatever the full YT link is):truncated from end to 11

Hope this helps!

1 Like

thanks Jacob!

Ideally I’d love to allow any of the 3 links to be put in, and we’d be able to pull it even if it’s a shortened link that directs to Youtube.

The biggest plus with that is when a creator updates a video on Youtube, they normally just change the link in bitly/other app and it updates everywhere they’ve uploaded (i.e Nucode)

Hoping someone has an answer to this.

Would also be cool if Bubble updated their plugin to allow this naturally @erik.bubble. :sunglasses: Lots of future video-based platforms will be built on Bubble.

2 Likes

I’ll pass the idea along!

1 Like

Yes, please @erik.bubble! @joe5, What did you end up doing here? I’d love to follow your progress as I’m looking to implement something similar. :beers:

well I’m able to add some conditional formatting with a regex formula someone posted here in the forum. Other than that, still just using the regular plugin for nucode.co/learn

Otherwise still hoping the Bubble team could update to just pull a youtube video based on any link, even shortened!

That really would be a great addition. For the time being, I’m using the following Regex to pull ID’s from Youtube links. (It should be noted that I’m NOT very familiar with Regex, so this might be garbage, but seems to handle most use cases pretty well):

/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/

Cheers!

Huge help Jacob~ :truncating from end to 11 worked well!

Could you explain how 11 was the needed number for the truncation? Why not, 12 or any other digit.

Would love to understand, thanks for the help!

Best,

@nbourdon1 Glad it worked for you :slight_smile: 11 is just the length of the video id parameter, which always comes at the end of the url when watching a youtube vid.

1 Like

Oh okay! So 11 is the max length. Cool! You taught me something new!

Thanks a lot Jacob!

1 Like

Actually, there ARE other parameters in YouTube video “watch” URLs that sometimes come after the video id parameter. In particular, the start time – which might not be a big deal most of the time. But there may be others.