Styling jetpack sharing google plus button
April 26th, 2012 | 1 comment
Nothing profound.
I use jetpack so I wanted to use the provided sharedaddy module.
The google plus button is a new addition and displays the medium button with default annotation.
I don’t have the traffic to display annotations. I want to use the small button.
So per google’s docs, I edited the sharing-sources.php file
from
|
1 2 3 |
public function get_display( $post ) { return '<div class="googleplus1_button"><div class="g-plusone" data-size="medium" data-callback="sharing_plusone" data-href="' . esc_attr( get_permalink( $post->ID ) ) . '"></div></div>'; } |
to
|
1 2 3 |
public function get_display( $post ) { return '<div class="googleplus1_button"><div class="g-plusone" data-size="small" data-annotation="none" data-callback="sharing_plusone" data-href="' . esc_attr( get_permalink( $post->ID ) ) . '"></div></div>'; } |
Better approach
Of course, the above hack reverted the next time I updated jetpack. So, I did this in javascript instead:
|
1 2 3 4 5 6 7 |
function removeCountsFromGooglePlus() { if (jQuery('.googleplus1_button iframe')) { jQuery('.googleplus1_button iframe').attr("src", jQuery('.googleplus1_button iframe').attr("src").replace(/size=/,"annotation=none&size=")); } } |
Note: (9/2012) Google updated their api to change from count=false to annotation=none. Snipped above updated to reflect this…
jQuery(‘.googleplus1_button iframe’).attr(“src”, jQuery(‘.googleplus1_button iframe’).attr(“src”).replace(/count=true/,”count=false”));
Short link: http://jkat.me/Jqtn6X
Comments
Comment from >BandonRandon
Time: October 7, 2012, 7:30 pm
Thanks for this tip. Another option is to create your own button directed for the following url: https://plus.google.com/share?&hl=en&url=YOUR_URL_to_share this can be nice if you don’t want to use Javascript.