JenSocial: Social Web Directory and Ning Tips

Social Web Directory :: Social Network Directory :: Ning Tips and Ning Support

Add Google +1 Above Ning Sign-In / Add Facebook Above the Google +1

To add the Facebook Like Button and Google's new +1 (Plus One) button to your Ning Network, add the following code to your Custom Code Box, via My Network/Tools/Custom Code;

Google +1 Button Only
<!-- G +1 All Pages Above Sign-In -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
<script type="text/javascript" language="javascript">
x$("#xg_module_account").before("<div align=center id='custom_g1'></div>");
var g1_html = '<g:plusone></g:plusone>';
x$("#custom_g1").html(g1_html);
</script>

Both Buttons (Facebook Like and Google +1) - - this is my code. Be sure to change your facebook settings as you want them. If that makes no sense, not to worry. Just use this code:

<!-- Facebook All Pages Above Sign-In -->
<script type="text/javascript" language="javascript">
x$("#xg_module_account").before("<div align=center id='custom_fb'></div>");
var fb_html = '<iframe src="http://www.facebook.com/plugins/like.php?href='+window.location+'&layout=standard&show_faces=false&width=180&action=like&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="padding-top:15px; border:none; overflow:hidden; width:180px; height:50px"><\/iframe>';
x$("#custom_fb").html(fb_html);
</script>
<!-- End FB All Pages Above Sign-In -->
<!-- G +1 All Pages Above Sign-In -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
<script type="text/javascript" language="javascript">
x$("#xg_module_account").before("<div align=center id='custom_g1'></div>");
var g1_html = "<g:plusone></g:plusone><br>Don't forget to Like and +1 us!";
x$("#custom_g1").html(g1_html);
</script>
<!-- End G +1 -->

Where to find the Google Plus One Code if you need it:

http://www.google.com/webmasters/+1/button/

Enjoy!

1 member favorited this

Replies to This Discussion

Permalink Reply by Phuze'mthonjeni on June 29, 2011 at 12:58am

Thank you for the codes Jen.
How to add Twitter button in the same position?

Permalink Reply by JenSocial on June 30, 2011 at 12:15pm

The code that includes the Twitter button scripts is part of the VIP Ning Club, and a VIP Tip.

http://jensocial.com/page/join-jens-premium-ning-tips

Best Regards,

Jen

Permalink Reply by Neuerotica on July 18, 2011 at 7:56am

Like a charm. Thanks.

Permalink Reply by MyPoppedArt on July 23, 2011 at 12:01am

On mine, The facebook like where is says "so and so and 100 something others like this" overlaps the plus one sign. Is there some way to move it over to the left a little so it doesn't overlap?

Permalink Reply by JenSocial on July 24, 2011 at 12:22am

Casey,

I'd have to see the live code to know what is needed. For example, are "we" using the shortest version of the like button? I don't remember. If you add the code back, wait until Monday evening. I'll be gone for the most part until then - - and send me a private message to let me know it's live. Also, I need to know if you're using the VIP version (like mine), or this one above.

Best,

Jen

Permalink Reply by Caribbean People Online on January 7, 2012 at 2:11pm

Hi Jen Sorry, I added the code or maybe I added it wrong I keep seeing it below the footer of my pages...

See the code file

Attachments:

.html, 1 KB

Permalink Reply by JenSocial on January 8, 2012 at 9:53am

The code you added here is trashed. I looked at your site and didn't see it. BTW, in FireFox your site jumps around, really unnerving. I think it may be the counter or snow, but not sure.

Best,

Jen

Permalink Reply by Caribbean People Online on January 8, 2012 at 11:55am

Oh yes thanks Jen, it is for my other site which is http://www.caribso.com I am seeing the Google plus sign but it is only at the bottom of the site.. After I noticed it didnt work, I went ahead and use on the code that they gave me... It is working but only at the bottom at the footer it shows up, I want it work as urs, can you give me the exact fix please?

Permalink Reply by JenSocial on January 8, 2012 at 12:04pm

I think this is the VIP tip you need:

http://jensocial.com/group/premiumningtipsbyjen/forum/topics/add-fa...

Best Regards,

Jen

Permalink Reply by Trieu Thanh Tuan on February 21, 2012 at 11:28pm

Hi There,

Thank you so much for sharing the codes, it works greatly in my site (above photo). I do not like the following text after Facebook like button, I love the button like photo below, but I do not know how to change the code. Can you please help me? Thank you so much.

Tuan.

Permalink Reply by Phuze'mthonjeni on December 4, 2012 at 9:17am

Hi Jen

I can't seem to find the tip that helped with the sharing buttons above sign-in box. I have changed from 3 column to 2. I have tried to make buttons to fit but they are still overlapping. Please check if you can help. http://phuzemthonjeni.com

Permalink Reply by JenSocial on December 4, 2012 at 11:26am

Phuze,

We need to allow room for more likes, and thinking your 4 buttons may not fit. I'll play around with the formatting, and get back to you.

Best,

Jen