Colocar redes sociais ao lado dos anúncios Google Adsense nas páginas do blogge/blogspot

 Para quem usa o programa de afiliados em seu blog como o Google AdSense ou mesmo outro como UOL, HotWord ou similares tem como deixar tudo bem arrumadinho nas páginas das postagens com esse código que deixa mais harmonioso, e mais fácil para seus leitores. É possível colocar mais de um anúncio, caso suas páginas internas tenham espaço para faze-lo.


Vá até o "Modelo de seu blog", clique em "Editar HTML"

  Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo. Essa dica é para o template Simple, do novo Blogger, implementado em julho de 2011

Clique em Expandiir modelos de widgets

Se quiser colocar abaixo dos títulos do post, procure por:


<div class='post-header-line-1'>

ou

<div class='post-header-line-1'/>


Se quiser colocar após a postagem do blog, procure por:
 
<div class='post-footer'>

Abaixo de qualquer dos códigos escolhidos, cole o próximo código, fazendo as modificações necessárias para linkar suas páginas sociais e colar os códigos referentes aos programas de afiliados.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='Adsense-sociais'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td width='708'>

AQUI O CÓDIGO ADSENSE, SE TIVER ESPAÇO, PODE COLAR MAIS DE UM CÓDIGO

</td>
<td>
 <div class='widget' id='counter'>
    <div class='inner clearfix'>
    <div class='box-out'>
    <div class='head box'>
    <p>Inscreva-se e siga NOME DE SEU BLOG</p>
    </div>
    </div>
    <div class='side_cont box-out clearfix'>
    <div class='box clearfix'>
    <div class='email_rss clearfix'>
    <span>Assine nossas atualizações</span>

    <form action='http://feedburner.google.com/fb/a/mailverify' class='clearfix' id='subscribe-form' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=&apos;NICK_FEED_AQUI&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
    <input class='txt' id='newsletter' name='email' type='text'/><input name='uri' type='hidden' value='NICK FEED'/><input name='loc' type='hidden' value='en_US'/><input class='btn' type='submit' value='Assinar'/></form>

    </div>


    <div class='social_links clearfix'>

    <a class='png_bg dysocial' href='ENDEREÇO FACEBOOK' id='side_fb' rel='nofollow' title='Assine nossa página'>Facebook</a>

    <a class='png_bg dysocial' href='ENDEREÇO TWITTER' id='side_tw' rel='nofollow' title='Siga-nos'>Twitter</a>

    <a class='png_bg dysocial' href='ENDEREÇO FEED' id='side_rss' rel='nofollow' title='Inscreva-se via RSS'>RSS</a>

    <a class='png_bg dysocial' href='http://feedburner.google.com/fb/a/mailverify?uri=NICK FEED' id='side_email' rel='nofollow' title='Assine por email'>Email</a>

    </div>
  
    </div>
    </div>
    </div>
    </div>
</td>
</tr>
</table>
</div>
</b:if>

Salve. Agora clique em Layout

Clique em Adicionar um Gadget

Ao abrir, clique em  HTML/Javascript

Cole então o próximo código, depois salve.

<!--BloggingeHow Subscription Widget-->

     <style>
    body {
        color: #434343;
        font: 12px/20px Arial,Helvetica,sans-serif;
    }
    #sidebar .widget {
        background-color: #000000;
        margin: 15px 0;
        padding: 4px;
        position: relative;
    }


    #sidebar .widget .head {
        text-shadow: 0 1px 0 #FFFFFF;
    }
    #sidebar .widget .box {
        background: #ccc;
        padding: 8px;
    }
    #sidebar .widget .box-out {
        background-color: #FFFFFF;
        border-bottom: 1px solid #E5E5E5;
        padding: 1px;
    }
    .clearfix:after {
        clear: both;
        content: " ";
        display: block;
        font-size: 0;
        height: 0;
        line-height: 0;
        visibility: hidden;
        width: 0;
    }
    #sidebar .widget .box {
        background: #ccc;
        padding: 8px;
    }
    .clearfix {
        display: block;
    }
    .clearfix {
        display: inline-block;
    }
    .clearfix:after {
        clear: both;
        content: " ";
        display: block;
        font-size: 0;
        height: 0;
        line-height: 0;
        visibility: hidden;
        width: 0;
    }
    .email_rss {
        border-bottom: 1px solid #E5E5E5;
        margin-bottom: 5px;
        position: relative;
    }
    .social_links, .email_rss {
        padding: 5px 0 10px;
        width: 100%;
    }
    .clearfix {
        display: block;
    }
    .fan_box {
        background-color: #F5F5F5;
        margin: 15px 0;
        padding: 4px;
        position: relative;
    }
    .fan_box .full_widget {
        background-color: #FFFFFF;
        border: 1px solid #E5E5E5;
    }
    .fan_box .full_widget .connect_top {
        background: url("http://3.bp.blogspot.com/-HRLwwHESa7E/UDipbPeTd6I/AAAAAAAAF64/JYE8V3mtgZs/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
        padding: 8px;
    }
    .fan_box .full_widget .connections {
        background-color: #FFFFFF;
        border-bottom: 1px solid #E5E5E5;
        padding: 5px 1px 1px;
    }
    .fan_box .full_widget .connections_grid {
        background: url("http://3.bp.blogspot.com/-HRLwwHESa7E/UDipbPeTd6I/AAAAAAAAF64/JYE8V3mtgZs/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
        padding: 6px;
    }
    .fan_box .full_widget .connections .total {
        margin: 4px 0 4px 8px;
    }
    .fan_box .profileimage {
        background-color: #FFFFFF;
        border: 1px solid #E5E5E5;
        display: inline;
        margin-right: 10px;
        padding: 5px;
    }
    .fan_box .full_widget .connections_grid a img {
        border: 1px solid #FFFFFF;
    }
    .fan_box .full_widget .connections_grid a img:hover {
        border: 1px solid #000000;
    }
    .social_links, .email_rss {
        padding: 5px 0 10px;
        width: 100%;
    }
    .social_links a {
        background-image: url("http://4.bp.blogspot.com/-JJL5i3WAtEA/UDip4G3DxhI/AAAAAAAAF7A/fa1vmnxMt38/s1600/social.png");
        background-repeat: no-repeat;
        color: #999999;
        display: inline;
        float: left;
        font-size: 11px;
        margin-bottom: 0;
        padding-top: 45px;
        text-align: center;
        text-decoration: none;
        width: 67px;
    }
    .social_links a:hover {
        color: #000000;
        text-decoration: underline;
    }
    a#side_fb {
        background-position: -173px 0;
    }
    a#side_tw {
        background-position: -81px 0;
    }
    a#side_rss {
        background-position: 8px 0;
    }
    a#side_email {
        background-position: -267px 0;
    }
    #geek {
        background: url("4.bp.blogspot.com/-JJL5i3WAtEA/UDip4G3DxhI/AAAAAAAAF7A/fa1vmnxMt38/s1600/social.png") no-repeat scroll -387px -363px transparent;
        bottom: -1px;
        display: block;
        height: 117px;
        position: absolute;
        right: -22px;
        text-indent: -9999em;
        width: 94px;
    }
    .email_rss {
        border-bottom: 1px solid #E5E5E5;
        margin-bottom: 5px;
        position: relative;
    }
    .email_rss span {
        font-size: 11px;
    }
    #subscribe-form {
        margin-top: 5px;
    }
    #subscribe-form #newsletter {
        border: 1px solid #CCCCCC;
        padding: 5px;
        width: 150px;
    }
    #subscribe-form #newsletter:focus {
        background-color: #F5F2D3;
        border: 1px solid #000000;
    }
    #subscribe-form .btn {
        background-color: #7EB4CF;
        border: 1px solid #2F6A89;
        box-shadow: 3px 3px 0 #6DA5C1 inset, -3px -3px 0 #6DA5C1 inset;
        color: #FFFFFF;
        cursor: pointer;
        display: inline;
        float: right;
        font-size: 12px;
        font-weight: 900;
        line-height: 12px;
        padding: 5px 8px;
        position: relative;
        text-shadow: 0 1px 0 #000000;
        z-index: 999;
    }
    #subscribe-form .btn:hover {
        background-color: #4E9CC4;
    }
    #subscribe-form span {
        background-color: #F5F5F5;
        display: inline;
        float: left;
        margin-right: 10px;
        padding: 3px;
    }

    h3 {
    font-family: MgOpenModata;
    
        font-weight: 400;
    }
    #sidebar .widget .head p {
        color: #999999;
        font-size: 11px;
        line-height: 15px;
        padding: 0;
    }
    </style>

Créditos: Blogging How