[MUSIC PLAYING]
JEREMY WALKER: Hi.
My name's Jeremy Walker.
Welcome to YouTube Developers Live.
Today is all about WordPress.
We're actually to talk about a plug-in that we've kind of
released under the radar called the YouTube Upload
Widget plug-in.
And today, actually, I have Pete Mall with
me today from Range.
Say hi, Pete.
PETE MALL: Hi.
JEREMY WALKER: So Pete actually wrote the code for
the plug-in itself to take advantage of the widget.
And I think that's all in PHP, right?
PETE MALL: Yeah, all PHP.
JEREMY WALKER: Yeah.
So what we're going to actually do is Pete's going to
talk a little bit about WordPress in case any of you
don't know about it who live under a rock.
And he's going to talk a little bit about Range.
And then I'm going to give a little bit of history of what
our new plug-in does and how we came about it.
And we're going to go into a demo, and then some code.
So why don't we get started.
Why don't you tell us about WordPress.
PETE MALL: So for this of you who don't know WordPress, it's
a content management system.
It started about 10 years ago as a blogging system, a
blogging platform.
And I guess over the years, it's not
just for blogs anymore.
We can see full-blown sites as well as even apps that are
being powered by WordPress on the back end now.
JEREMY WALKER: Great.
So what is Range?
And how does that come into play with WordPress?
PETE MALL: So Range is a full-service design and
development agency that I started last year with a
couple of other WordPress core contributors.
And we've just been doing WordPress work for the last
year, including plug-ins and custom sites for people.
JEREMY WALKER: Great.
So for any of you that don't know, we obviously have the
YouTube APIs that let you do a lot of the
things you do on YouTube.
Via APIs, maybe even in your apps, one of those things is
uploading video.
And what we did a little while ago is, we decided we wanted
to make uploading video much easier.
So we made the YouTube Upload Widget, which not only allows
you to choose a file to upload to YouTube, but it also allows
you to record a video from your webcam and upload
directly to YouTube.
So we wanted to take advantage of that widget and expose it
to the WordPress folks so that they can use it within their
environment without having to go and mess around in YouTube.
So that's where we came into contact with you, through some
of the WordPress folks.
And you guys took it from there and built out a nice
little plug-in using this widget.
And why don't we just dive into and have
a look at it live?
PETE MALL: Yeah.
So, real quick, the plugin lives on WordPress.org.
If you go there, look under Plug-ins.
You'll be able to search for the YouTube Upload Widget.
And for those of you who are not familiar with WordPress,
this is how the dashboard looks like.
So the first thing I'm going to do is go ahead and install
the plug-in.
And I'm searching for the plug-in.
And it should be the first one.
And looks like it's already installed for me.
So I'm just going to go ahead and create a new post so I can
test out the functionality.
So WordPress, by default, ships with this media manager
that lets you insert images, galleries, either from your
computer or from another source on the web.
And we just wanted to flow the same UI and make it that easy
for you to use your YouTube videos or just record a video
from inside WordPress without ever having to log into
another site.
So we have this YouTube button here.
If you click that, it opens a similar pop-up.
And the first thing it's going to ask you is a title for the
new video that you're trying to record.
I'm just going to say Test Video.
And you can have a description there which
flows through to YouTube.
And you can have keywords that are going to be attached to
your video.
JEREMY WALKER: I noticed you guys are installing the
reference to the blog, which is really helpful.
So if someone finds your video on YouTube, they can click on
this, and it'll take them to the post related to that.
So it drives traffic both ways.
PETE MALL: And you can always edit this description.
You can add more to it and still leave the link in there,
so it's easy to go back and forth between your blog and
your YouTube account.
So I'm just going to go ahead and click on
the Record from Webcam.
And that pops up the YouTube Upload Widget
that you guys created.
And it tells me I'm logged in as Pete
Mall, which is my account.
And it gives me a button to record for my webcam.
JEREMY WALKER: Now, if he hadn't logged in already, he
would have gotten an authorization window coming up
to authorize.
PETE MALL: Yeah.
It's the same OAuth window that pops up.
You log in.
You give it permissions to the YouTube account
to upload the video.
So I can see myself.
And I can just click Start Recording.
And it's going to say, do you really want to give access to
your webcam to YouTube?
I say yes.
And I can record anything.
It doesn't matter whether it's five seconds
or it's five minutes.
It will just go through.
It's the power of YouTube behind the scenes.
I clicked Stop Recording.
So now I can either go back and look through my video and
see if I like it.
If I need to re-record it, I can.
But if I'm happy with it, I can just click Upload.
And if you look, it's already got the ID for the video.
So I can just directly insert the video into
the post right now.
Or I can wait a few seconds until the video is done
processing.
And then I'll actually see the processed video show up here
and still insert the link.
JEREMY WALKER: Great.
And so I guess while that's uploading, so there's another
way to handle this as well-- oh, there we go.
I'll let you insert it.
PETE MALL: So again, the video's now live.
I can insert it into my post.
And this uses oEmbed support, which is baked into WordPress.
So even if you're not using this, if you want to directly
copy a link to a YouTube video and post it, as soon as you
publish, it will use oEmbed to actually grab that video.
And if I just click on View Post now, I see my new post
with the video that I just recorded in there.
And so I don't need to fumble with any embed codes or
anything else.
I just use the link directly.
JEREMY WALKER: That's great.
So--
and I was actually asking about this just a second ago.
So let's say you want to insert video from YouTube, but
you don't necessarily want to upload or record anything.
Maybe you have something in mind that'll help add some
more color to your post.
PETE MALL: Yeah.
So there's a lot of times when you just
want to record something.
But there's times when you already have something
recorded, or you found a really cool video that you
want to embed.
Or if you're just writing a post and you want to search
for something, you can go to the second tab, which is
Browse YouTube Videos.
And it gives you a field to search.
So I could just say WordPress.
And if I click Find Videos, it'll use the
Feeds API from YouTube.
And it grabs the videos that match my search terms.
And same way, I could go through and preview the video,
or I can just click Insert.
Oh, there's the video from Matt Cutts
about SEO and WordPress.
So we'll insert that one into the post as well.
So again, I can have multiple videos.
Or I could just move my other video.
As soon as I click Update, this goes ahead
and updates my post.
So I have both my videos, and it's right there for you.
JEREMY WALKER: So one thing we always like at Google is
open-source, and the code for the plug-in is all
open-source.
So anyone that's interested in grabbing the code and
extending it can certainly do that.
If you want to show a little bit about that
and talk about it?
PETE MALL: So you touched upon open-source.
WordPress itself is released under a GPL license, which
means it's free.
So you can download it and do anything you want with it as
long as you maintain the GPL restrictions
that come with it.
Also, any plug-in or theme that's built on WordPress has
to either be released under a GPL license or a license
that's compatible under the GPL license.
So it gives you the same freedoms as the creators have.
Again, if you go to WordPress.org and search for
the plug-ins, you can search for the YouTube Upload Widget.
And it will get you to this page.
It has the info on your licensing.
It has the features, installation instructions,
some screenshots, as well as support.
So if you have any issues, you can just click Support, and
you can add a post to it, and someone will
either get back to you.
Or there's a huge community in WordPress where someone would
be able to help you.
The code itself lives on SVN under WordPress.org.
So if you click on the Developers tab, you'll have
access to the development log, the SVN repository, as well as
a browse track, which is one of the bug tracking systems we
use with WordPress.
But if I just want to look at the SVN, I could see that all
of the code base lives there.
JEREMY WALKER: Great.
And so it's pretty basic, the code you wrote.
You just separated it into the pop-up window.
And it's PHP, so there's just a couple files that they can
browse through, correct?
PETE MALL: Yes.
So real quick, I've broken the code up into YouTube.php,
which, if you look through it, it has the WordPress-specific
bootstrap at the top.
It tells us is the plug-in name and a little bit about
the license and everything else.
And this is the file that we use to hook into WordPress, to
add the button, and tell WordPress to open a pop-up
window when someone clicks on it.
And the second file is yt-popup.php.
This is the file that actually powers the pop-up.
It embeds the YouTube Upload Widget, and it's the one that
grabs the search API to show that as the videos for you.
So again, most of the code is HTML, with some sprinkling of
PHP in here.
And it just uses the JavaScript API.
So everyone's more than happy to browse through the code.
If there's any enhancements you guys like, we're more than
happy to send in a request, and we'll look
through your patch.
JEREMY WALKER: Awesome.
Well, thanks again for showing this to us and the great work
you did on it.
We really appreciate it.
If you're interested, check it out.
If you do use WordPress, you should definitely install the
plug-in and start playing with it.
It will definitely make things a little bit
more easy for you.
And we don't have any questions today.
But if any of you are interested in a job it with
YouTube or with YouTube Developer Advocates, please go
to our site-- developers.google.com/jobs--
and check it out.
We're always looking to hire great developers.
And I think that covers it for the show.
Thanks again for coming today.
We really appreciate it.
And yeah, again, check out the WordPress blog.
Thanks, guys.
PETE MALL: CHEERS.
[MUSIC PLAYING]