How to Embed a Live Google+ Hangout on Your WordPress Website - ManageWP

How to Embed a Live Google+ Hangout on Your WordPress Website

As a social media platform, Google+ has come a long way in a short amount of time. It’s now the second largest social media network – even surpassing Twitter in 2013 – and shouldn’t be ignored by bloggers.

Hangouts is a wildly popular feature of the Google+ platform. With Hangouts, users can privately video chat with a small group or live stream videos to the broader public.

Hangouts are separated into two distinct offerings:

  1. Hangouts on Air. This is the type I will refer to in this tutorial. Hangouts on Air are public video streams that can be recorded and added to your website or blog. Hangouts on Air also stream live through your YouTube channel. Because they can be recorded and viewed at a later date, Hangouts on Air are perfect for webinars, workshops, presentations, and Q&As.
  2. Hangouts. A regular hangout is a video chat that is not recorded or shared live on your YouTube channel. Similar to Hangouts on Air, regular hangouts can also be public. However, because of their limited functionality, regular hangouts are normally reserved for a smaller group – like work colleagues who need to collaborate on a private project.

For both types of Hangouts, you can have up to ten active participants over video and microphone but broadcast to an unlimited audience.

Let’s take a look at how to embed Hangouts on Air to stream live over your WordPress site.

How to Embed a Live Google “Hangouts on Air” Onto a WordPress Site

1. Set up a Google+ Account, if you don’t already have one.

Create a Google Account

2. Go to this URL: https://plus.google.com/hangouts/onair.

Click on the “Start a Hangout On Air” button.

Live Hangouts on Air

3. Fill in the required information. You’ll need to name your hangout. You have the option to start the Hangout immediately, or at a time in the future.

Enter details for Hangouts session

Hangouts on Air can be recorded for up to eight hours, which I’d imagine will be plenty of time 😉

4. Verify your YouTube account. If you haven’t already verified and connected your YouTube profile to Google+ Hangouts, you’ll be prompted to go through a two-step verification process.

Verify YouTube

Select text or voice message to receive your special code.

Verify YouTube

You’ll receive the text or call immediately. Input it, and continue.

Verify YouTube Verify YouTube Success

5. Return to the previous tab to start your Hangout. Click share. You’ll then be taken to a page entitled “My Hangout.”

Click on the “Start” button under the Hangout Video.

Start Google Hangouts on Air

This will prompt a new window to pop-up.

From here, you can choose to invite guests from your Google+ circles and restrict the Hangout to guests over 18 years of age. We’ll skip this.

Invite Guests on Google Hangouts

Agree to Google’s terms.

Google Hangouts on Air Terms

6. You’re in, but not live (yet!).

Go to the bottom right of the Hangouts screen and click on “Links.”

Copy/Embed Code

Click on the Video Embed and right click. Select copy.

7. Go to your WordPress Dashboard. Add a new post.

Add Post on WordPress

Name your post.

Click on the “Text” tab. Inside the body, right click and paste the video embed code.

Hangouts on WordPress Text

I recommend changing the dimensions to make the video larger. For my layout, I changed it to 854 x 480 px.

Returning to the “Visual” tab will show a static box like this one:

Hangouts on WordPress Blog

Publish and take a look at your blog. It should look something like this:

WordPress Hangouts on Air

(This is what you’ll see when you press play on the video.)

Once you’re ready to start your broadcast, simply return to your Google+ Hangouts window and click the “Start Broadcast” button.

That’s it! All done. If you get stuck along the way, just let us know in the comments section below.

Tom Ewer

Tom Ewer is the founder of WordCandy.co. He has been a huge fan of WordPress since he first laid eyes on it, and has been writing educational and informative content for WordPress users since 2011. When he's not working, you're likely to find him outdoors somewhere – as far away from a screen as possible!

16 Comments

  1. Thomas Van Geel

    I did a quick little test and I have the same concerns as DEBY AT SO SEW EASY. There is quite a significant delay on the broadcast so it is extremely difficult to interact with the viewers asking the questions. Can we work around this?

    Thanks

  2. Deby at So Sew Easy

    I’m just testing this out now and when embedded into the WP site, I’m not able to see it live. When pressing play on the viewer, it starts playing from the beginning of the broadcast as if it were recorded. So someone joining 5 mins after the start, doesn’t see it live at the 5 min mark, they see it from the start 5 mins ago.
    It’s making it really hard to manage questions, because people are asking questions in their time, which is actually after the broadcast has finished. Do you know what I mean?
    I’m not sure what I can be doing wrong!

  3. Chris McDonald

    Extremely helpful. Creating some trainings on Blogging and was not sure how to host it on my own website. Very clear and love the step by step with pics. Just how I train. Love the addition about changing the dimensions. Thanks again

  4. Brianna Cowan

    Will I need to change the code for every new hangout? Do you know how this works if I’m using Webinarjam to set up my hangouts?

    1. Chris McDonald

      You have to create a new hang out each time and then the embedded code will change as well.
      I have no idea about Webinarjam

  5. Michael

    If you are recording the sermon won’t it have to be hook up to the sound system

  6. Caly

    Can the Hangout video player be used on a membership website with all members able to use it’s functions?

  7. Melinda Orr

    Thanks… very helpful! Interested too in capturing the questions and comments.

  8. Rod

    How to embed the broadcast window to your site while setting it to private in hangouts manager settings. By setting it to private it wouldn’t show the broadcast when embedded. how can it show the embedded video when its set to private with out manually entering every privileged invite to view the video broadcast.

  9. Linda

    How do you capture the comments when you embed your live HOA on your website

  10. Kim Doyal

    LOVE this Tom! I had no idea (clearly I need to host some hangouts :-) ). Thanks for the easy step-by-step instructions. I’ll definitely be doing this!
    Thanks again,
    Kim

    1. Tom Ewer

      You’re welcome Kim! :)

  11. Online Marketing Agency

    That was easy, there are some plugins out there that probably add some functionalities as well.

    1. Tom Ewer

      Probably, but I like to do things without plugins whenever possible :-)

  12. Manoj

    Cool. I was looking for this. thanks a lot for detailed instructions.

    1. Tom Ewer

      Our pleasure Manoj!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Over 17,000 WordPress professionals are already using ManageWP

Add as many websites as you want for free, no credit card required. Sign up and start saving time!

Have questions? Get in touch!

Over 17,000 WordPress professionals are already using ManageWP

Add as many websites as you want for free, no credit card required. Sign up and start saving time!

Have questions? Get in touch!

Over 17,000 WordPress professionals are already using ManageWP

Add as many websites as you want for free, no credit card required. Sign up and start saving time!

Have questions? Get in touch!

Over 17,000 WordPress professionals are already using ManageWP

Add as many websites as you want for free, no credit card required. Sign up and start saving time!

Have questions? Get in touch!