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!

Views: 1591

Replies to This Discussion

@ Teri Sometimes you have to wait for the cache to roll around usually 10 mins and then sign out of your site and it should be above the Sign in box

Did you use Jen's codes or google?

Great!  It's their now!

 

Thanks!

Teri

Great, thanks!
Oh my God, this is a cool tip!  Thank you Jen.  Ben
LOL, Ben! Do notice a lot of people are saying the Google +1 isn't working in several versions of IE, anywhere the button is installed, not just Ning sites.
Nice one :)

Thanks, glad you like it! I've got to spend some time tomorrow formatting the look better.

;-)

Thanks for the tip Jen, class as normal. One thing, am trying to delete or reduce the facebook Like text and fit the +1 next to that so they only occupy one line. It would be great to have all four Icons and options as you have here too, is that in your premium group?

 

Cheers,

mark.

Hi Mark,

Yes, you guessed right. The four are in the premium group. How far have you come with the 2 occupying one line?

Nite nite for me. I'll check on you tomorrow.

Jen

I don't know if there is another posting concerning the Google +1 Button. Today I added this custom code to add this button before the twitter and FB like button:

 

<!-- G +1 All Pages before Twitter and FB Like -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
<script type="text/javascript" language="javascript">
x$(".share-links").before("<div align=left id='custom_g1'></div>");
var g1_html = '<g:plusone></g:plusone>';
x$("#custom_g1").html(g1_html);
</script>

Hi Jens!

Thank you for sharing! Yeah, I have a premium tip like what's on JenSocial, and a free tip for just the +
1 and FB buttons.

Good job!

Jen

Thank you so much, Jen. You Rock!

RSS

Members

© 2024   Created by JenSocial.   Powered by

Badges  |  Report an Issue  |  Terms of Service

Home
VIP Ning Tips