How to Embed a Google+ Badge on Your WordPress Site

How to Embed a Google+ Badge on Your WordPress Site

Before I start blathering on, here is the link to the Google+ Developer web page where you can get your Google+ badge code: https://developers.google.com/+/plugins/badge/.

You remember Google+, right? That social network that we weren’t sure about (see Should You Use Google+?). That was predicted to flounder and die horribly, yet somehow kept keepin’ on and kept growing until you were forced to take it seriously?

I liked Google+ a lot simply because it wasn’t Facebook (which has sort of become “the internet for dummies”—a replacement for what AOL was in the early 90s, essentially an entire interface overlay for the web). But then Google kept adding all this cool stuff: hangouts were improved. Google+ Pages were created for businesses. Communities were created.

Rock the Badge

Google+ Badge

Badge-y goodness!

In my web travels, recently, I started noticing more and more that people were rocking Google+ badges on their sites. And with my increased use of Google+, I thought it was time for the same. But when I looked at the WordPress plugins available for this, I either didn’t like how they looked or I didn’t like how they worked. In addition, you’d think plugins would make adding the Google+ badge to your site less complicated than copying & pasting code into a text widget.

But, no. Not at all. In comparison, a quick copy/pasta is faster, easier, and less complicated. And although appearance is subjective… to me the “official” badge looks better than the display options of the plugins I looked at. That’s when I realized I could make this useful for you, too, and I fired up my screen recording software.

So… that’s what this video is about. I walk you through, step by step, how to create and use the code needed to pop a Google+ badge onto your WordPress widget area.

Note for Headway (affiliate link) users: you are not restricted to using sidebar widgets in WordPress for this. You can use a custom code block anywhere in your design in the Visual Editor.

Although in the video I show the Google+badge for Google+ Pages (for organizations), the steps are identical for both kinds of badges (Pages and regular Google+ accounts).

Quick & Dirty Copy/Pasta is Easy-Peasy

  1. If you’re already logged into your Google account (via Gmail or whatever), just go to this page. You’ll see a badge-maker with a couple options to choose from.
  2. Copy the code and then, in your WordPress dashboard, go to Appearance > Widgets.
  3. Drag a text widget into your sidebar and paste in the code.
  4. Do not check the paragraphs check box.
  5. Put a widget title in if you want one.
  6. Hit the little “Save” button.
  7. Boom, you’re done.

If you want more options, there are attributes you can change in the code if you’re comfortable with such things (height, width, light or dark colors). I show you how in the video. There’s nothing you can do to really screw up or break on your blog with this. If it doesn’t go well, just re-copy the original code and paste it back in, replacing your messed up code.

You’re Invited

And of course I’d be thrilled to have you join me on Google+ by following my page. What that means is that when I post stuff on there you’ll get updates (which can be turned off). I often post links, thoughts and observations there. It’s a great place for content that’s too big for Twitter and too small for a proper blog post. The discussion capabilities are awesome. So please join me there, and if you have your own Google+ page, let us all know in the comments so anyone who visits this post can check out your page.

  • Tiffiny Taylor

    Great video, Thank you!!!!

    • http://remarkablogger.com Michael Martine

      You’re welcome! Glad you liked it. :)

  • Abinash Mohanty

    Thanks Michael for the tips, it worked! :)

  • Alessio Nicolini

    I’ve not the Google + widget. Is there any other way to make it?

Headway ad
Headway