Print Reseller Scheme
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Google +1 code help

Discussion in 'Website Coding & Programming Forum:' started by Stationery Direct, Dec 2, 2011.

  1. Stationery Direct

    Stationery Direct Administrator Staff Member

    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?

     
  2. Stationery Direct

    Stationery Direct Administrator Staff Member

    Do I put it all in a div and specify something in the CSS?
     
  3. Corrosive

    Corrosive Moderator Staff Member

    That's what I'd do I think. Use a class and wrap both up in a div with the class applied and then specify a bottom margin in your CSS.
     
  4. Stationery Direct

    Stationery Direct Administrator Staff Member

    Could you give me an example of how to do it? :icon_wink:
     
  5. Corrosive

    Corrosive Moderator Staff Member

    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.
     
  6. Stationery Direct

    Stationery Direct Administrator Staff Member

    Worked a treat, thanks Toby :icon_wink:
    :icon_cheers:

    Cheers

    Damon
     
  7. Corrosive

    Corrosive Moderator Staff Member

    You are welcome :icon_smile:
     

Share This Page