Display your Google+ Feed in your blog with images

Google+ Feed WidgetGoogle+ is the next big thing in Social Media. According to statistics its growth has been explosive. With loads of never before seen features and Facebook trying to copy them blankly ,its popularity has just increased by the day. But unlike Twitter and Facebook as of now it doesn’t have a Widget to display your latest posts. To do this we will be combining two services. Lets get started

Demo

Step 1: Go to Your G+ Profile and from the Address bar copy your Google+ ID

Google+ Profile URL

Step 2: Go to Zipl.us and select a nickname and paste that Google+ ID. Then press GO

Zipl.us homepage

Step 3: After that you will get your Short URL ,copy it

Zipl.us completion

Step 4: Now go to Widgetbox . firstly register if you haven’t already.

widgetbox homepage

Step 5: After signing in, go to Widgets menu in the header and then click the Blog/Feed Icon

widgetbox create widget

Step 6: Firstly choose the Basic setting (because its free) and paste the URL you got from Zipl.us in the myblogurl field. Here one thing to note is that you will have to add /feed after the URL you got for this widget to work.

widgetbox widget customize

Step 7: Now after Clicking Make Widget ,you will be presented with loads of options to customize your widget according to your wishes. All options are self explanatory. This is how my widget looked after the process:

save widget

Step 8: After completing  the customization Click the Save Blidget and after accepting their Terms and Conditions , Save it.

accept terms

Step 9: In the next screen click the Get Widget and you will be presented with the Code to integrate it into your blog. Now just copy it.

copy widget code

Step 10: Back in Blogger Dashboard create a HTML/JavaScript Widget and paste the code and Save it . You will see your latest post on G+ in your blog/website.

Having problems , feel free to ask

Demo

6 Replies to “Display your Google+ Feed in your blog with images”

    1. Just add the following code after the widget code

      <div style="width: 200px;position: relative;z-index: 99999;height: 30px;top: -23px;background: url('IMAGE_URL');" ></div>

      Put a IMAGE_URL same as the Sidebar background image

Leave a Reply

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