Google Friend Connect is a gadget that allows you to turn your blog into a social community and gives your viewers the opportunity to engage more deeply with your blog content, with each other and with you.
Another great benefit of Google Friend Connect is that it can give your site “social credibility” by displaying photos of all of your sites GFC members, this helps to create trust and an element of site popularity for your new visitors.
How To Add Google Friend Connect To Your Wordpress Blog
This guide will teach you how to set up Google Friend Connect on your self-hosted Wordpress blog.
Step 1
First of all you will need to go to Google Friend Connect, click on “get started” and sign in with your Google account. If you do not yet have a Google account, click on the image below to get one.
Step 2
When you are signed in, simply click on “Friend Connect for standard websites” link as shown below.
Step 3
On the next sceen, as seen below, click on “continue”.
Step 4
Add your blog title (name of your blog), home page URL (web address of your blog) and “continue”.
Step 5
Download the 2 files as circled below, make sure you remember the location of where you save these files and click “continue”.
Step 6
Once you have rpc_relay.html and canvas.html downloaded, you will need to upload them to your blog’s root directory via an FTP client. If you do not have an FTP client, a popular one is FireFTP which you can download here.
As you can see in the FireFTP screenshot below, firstly log into your blog FTP and click on “public html” which will open up any websites that you have loaded into your FTP account. Once this is done, simply locate the 2 files (from your saved location), then drag and drop both files (rpc_relay.html & canvas.html) onto the website that you are adding Google Friend Connect to (as seen below).
Note: Your FTP setup may look a little different to the screenshot below, if it does, just make sure to upload the 2 files to your root directory.
Step 7
Once you have uploaded both of these files, click on the Google Friend Connect test button, as shown below.
Step 8
OK, now that’s all done, we come to the next important part – Installing the Google Friend Connect gadget onto your wordpress blog. After you have tested your setup, if it has worked correctly, it will take you to the page you see below, click on “get code for members gadget”.
Step 9
On the next screen, you have options to change the size and colour of your Google Friend Connect Gadget, and once you choose your settings, click on “generate code” as shown in the screenshot below.
Step 10
Once “generate code” is clicked, a html code will be displayed, copy and paste that code into a text widget within your Wordpress dashboard, as I have done in the screenshot below.
Your new Google Friend Connect Gadget should now be displayed in the blog sidebar of your self-hosted Wordpress blog!
Once you have a google account, make sure to come back and join my Google Friend Connect on SeanSEO (at the bottom of the page).
Have a most outstanding day.
Sean RasmussenAussie Internet Marketing
www.SeanSEO.com © 2008 - 2010
{ 13 comments… read them below or add one }
Cool! great info, I will add this to my site tomorrow.
Good to hear Jon, using great tools like Google Friend Connect can only help your online presence.
Regards – Sean
Hey Sean, pretty clear and simple steps. Thanks for all the images you have added there…
though whats the benefit of using friend connect??
Hi Harsh,
Glad the post was beneficial for you. As far as the benefits of Google Friend Connect, I have written an article that you may find beneficial at http://seanseo.com/google/google-friend-connect/
Regards – Sean
How come whenever I add it to my blog, it ends up being an empty box with nothing inside.
Any solutions? Thanks
Hi Anna,
I think the problem may be that you are yet to get some members to your GFC. As people join your site through Google Friend Connect, you will start to see their photos appear within the widget. Don’t worry, it can take a bit of time…consider it a work in progress
Regards – Sean
Hello there
Could you please explain to me how to open FireFTP?
I dont know where it is. I downloaded it and add it to firefox…but where is all these things we see in your screenshots?
pls help
Hi Chris,
In firefox, you will find FireFTP by going to the “tools” tab in your browser. Just click on “tools’ then “fireftp”
Regards – Sean
Hi,
I am having problems figuring out how to find where i write the code i have copied?
i can find the widgets category, but where do I add a widget?
Thanks,
A newbie to wordpress..
Hi Henriette,
When you are in the wordpress widgets section, simply add a “text widget” to your sidebar and include the google friendconnect html code into the text widget box. Hope this helps
Remember, this will only work on a self-hosted blog.
Regards – Sean
Thanks ! I succeeded
/Henriette
Great work Henriette, glad it’s all working for you
Regards – Sean
Man, this is crazy. We call tissues – “Kleenex”, packing tape – “Scotch”, photocopy – “Xerox”. And we’re not far from calling the internet – “Google”.