• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Google +1 code help


Stationery Direct

Administrator
Staff member
#1
Hi guys, after a bit of help here, see this page > Printing of Business Cards, Letterheads, Flyers - Stationery Direct

How do I make the gap below the google +1 button the same as the gap above the Facebook like button? I tried adding 'padding-bottom:' to the google code but it didn't do anything, if that was the right way to do it? Out of my depth here, anyone?

<!-- Facebook -->
<iframe src="http://www.facebook.com/plugins/like.php?app_id=207088675993575&amp;href=http%3A%2F%2Fwww.stationery-direct.co.uk&amp;send=false&amp;layout=button_count&amp;width=169&amp;show_faces=false&amp;action=recommend&amp;colorscheme=light&amp;font=tahoma&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:169px; height:30px;"></iframe>
<!-- Place this tag where you want the +1 button to render -->
<g:plusone size="small" annotation="inline" width="169" href="http://www.stationery-direct.co.uk"></g:plusone>
<!-- Place this render call where appropriate -->
<script type="text/javascript">
window.___gcfg = {lang: 'en-GB'};
(
function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src =
'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
 

Corrosive

Well-Known Member
#5
HTML:

Code:
[B]<div class="social">[/B]
<!-- Facebook -->
<iframesrc="http://www.facebook.com/plugins/like.php?app_id=207088675993575&amp;href=http%3A%2 F%2Fwww.stationery-direct.co.uk&amp;send=false&amp;layout=button_coun t&amp;width=169&amp;show_faces=false&amp;action=re commend&amp;colorscheme=light&amp;font=tahoma&amp; height=21"scrolling="no"frameborder="0"style="border:none; overflow:hidden; width:169px; height:30px;"></iframe>
[B]</div>[/B]
[B]<div class="social">[/B]
<!-- Place this tag where you want the +1 button to render -->
<g:plusonesize="small"annotation="inline"width="169"href="http://www.stationery-direct.co.uk"></g:plusone>
<!-- Place this render call where appropriate -->
<scripttype="text/javascript">
window.___gcfg = {lang: 'en-GB'};
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
[B]</div>[/B]
CSS

Code:
.social {margin: 0 0 10px 0;}
Although there is a caveat round this that iframes are a tad unpredictable as you have no control over the content as such. Perhaps have a play with margins etc until it looks right.