npl Posted November 23, 2011 Share Posted November 23, 2011 Anyone know how to change the appearance of the google plus one button to a square? It is not in the default developer settings. I am at a loss with this one. It needs to be changed to a square to fit in with the rest of my site. http://borealtrek.com Thanks for the help! Quote Link to comment Share on other sites More sharing options...
Guest xaav Posted November 24, 2011 Share Posted November 24, 2011 You will need to take [this](https://ssl.gstatic.com/s2/oz/images/stars/po/Publisher/sprite.png) sprite, then use a photo-editing program to make one of the lines a square. After that, you will need to adjust the .Uu and .Uu .JF classes in a custom CSS file to point to your edited image. Quote Link to comment Share on other sites More sharing options...
npl Posted November 24, 2011 Author Share Posted November 24, 2011 I don't know where I would be with out this forum. Thanks for the help. I think what you said will do the trick just nicely. Quote Link to comment Share on other sites More sharing options...
npl Posted November 25, 2011 Author Share Posted November 25, 2011 I jumped the gun.... I got the sprite done and I tried to put it into the code and it did not work.What would you do? New Sprite http://borealtrek.com/wp-content/uploads/2011/11/g+.png Normal g+ code <!-- Place this tag where you want the +1 button to render --> <g:plusone annotation="none" href="www.borealtrek.com"></g:plusone> <!-- Place this render call where appropriate --> <script type="text/javascript"> (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'http://borealtrek.com/wp-content/uploads/2011/11/g+.png'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script></td> <td> Quote Link to comment Share on other sites More sharing options...
Guest xaav Posted November 25, 2011 Share Posted November 25, 2011 EDIT: I just realized that this isn't going to work because the plus one button is rendered inside an inline frame. However, I may have another solution. First, change that plus one code to back like you had it before. Then, add this CSS between the <head> tags: <style type="text/css"> #___plusone_0 > iframe { opacity: 0 !important; } #___plusone_0 { background: url('http://borealtrek.com/wp-content/uploads/2011/11/g+.png'); } </style> Quote Link to comment Share on other sites More sharing options...
demizide Posted December 3, 2011 Share Posted December 3, 2011 EDIT: I just realized that this isn't going to work because the plus one button is rendered inside an inline frame. However, I may have another solution. First, change that plus one code to back like you had it before. Then, add this CSS between the <head> tags: <style type="text/css"> #___plusone_0 > iframe { opacity: 0 !important; } #___plusone_0 { background: url('http://borealtrek.com/wp-content/uploads/2011/11/g+.png'); } </style> Well, if you'd do that then it won't change like it did at first, and you won't know that you've +'ed the page, and people will think it's broken. Quote Link to comment Share on other sites More sharing options...
xwinuser Posted December 4, 2011 Share Posted December 4, 2011 The Google+ button on your page is in the shape of a square. Quote Link to comment Share on other sites More sharing options...
demizide Posted December 5, 2011 Share Posted December 5, 2011 The Google+ button on your page is in the shape of a square. He wasn't talking about the G+ button, he was talking about the +1 button, it's kinda the G+'s version of FB like- Quote Link to comment Share on other sites More sharing options...
xwinuser Posted December 5, 2011 Share Posted December 5, 2011 The +1 button that shows up in search results? Not sure you can change that. Not like a Favicon. Sorry wish I were more help. Will research more. Quote Link to comment Share on other sites More sharing options...
npl Posted December 5, 2011 Author Share Posted December 5, 2011 I appreciate the help everyone Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.