novo Modelo-de compartilhamentos criado para o Blogger.

Eu aproveitei algumas possibilidades do serviço

Your content. Everywhere.
(Seu conteúdo. Em todo lugar)

 

para customizar e criar um exclusivo gadget para Blogger. e resolvi compartilhar com vocês. Esse modelo de botões para compartilhar com os serviços mais usados e mais comuns e que acredito que poderão ser mais eficientes e termos de conversões para seu conteúdo. Fica semelhante a isso

A primeira coisa a fazer é registrar-se (gratuitamente) no serviço. Isso é importante, pois vamos precisar de seu nome de usuário para fazer funcionar o gadget para Blogger. Registrar-se também é importante para ter acesso às possibilidades de personalização.

já tem a opção de compartilhar inclusive no novo serviço do Google Buzz, enviar para o Link Ninja, tem um encurtador de URLs e até a possibilidade de traduzir seu blog para mais de 40 idiomas. Esse gadget tem 280px de largura e vou mostrar como colocar na barra lateral do Blog ou no rodapé de seus artigos. Então preste atenção aos espaços onde vai colocar isso

Passo 1 – Adicionando o seu CSS no template.

Abra o painel do Blogger, clique no menu “Layout” ~> “Editar HTML” lembrando de marcar a caixa do “Expandir modelos de widgets” e  procure pela linha “]]></b:skin>” e imediatamente ACIMA disso cole

.addthis_toolbox .two_column
{
    width: 276px;
    padding: 10px 0 10px 0px;
    border: 3px solid #eee;
    background-color: #fff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.addthis_toolbox .two_column a
{
    padding: 4px 0 4px 34px;
    position: relative;
    width: 106px;
    display: block;
    text-decoration: none;
    color: blue;
}

.addthis_toolbox .two_column a:hover
{
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background: #B4D3F8;
    text-decoration: none;
}

.addthis_toolbox .two_column span
{
    position: absolute;
    left: 14px;
    top: 4px;
}

.addthis_toolbox .two_column  .top
{
    padding: 0 0 10px 0;
    border-bottom: solid 1px #eee;
    margin-bottom: 10px;
    margin: 0 20px 10px 20px;
}

.addthis_toolbox .two_column  .more
{
    border-top: solid 1px #eee;
    padding: 10px 0 0 0;
    margin: 10px 20px 0 20px;
    text-align: center;
}

.addthis_toolbox .two_column  .more a
{
    padding: 4px 0;
    width: auto;
}

.addthis_toolbox .two_column .more span
{
    display: none;
}

.addthis_toolbox .two_column .column1
{
    width: 130px;
    float: left;
}

.addthis_toolbox .two_column .column2
{
    width: 130px;
    float: left;
}

.addthis_toolbox .two_column .clear
{
    clear: both;
    padding: 0;
    display: block;
    height: 0;
    width: 0;
}

Passo 2 –  a prosseguir Agora no HTML.

Recomendo que adicione esse modelo no rodapé dos artigos, imediatamente abaixo do texto. Para fazer isso procure pela linha.

<p class='post-footer-line post-footer-line-1'>

Ou algo bem semelhante a isso e ABAIXO cole o seguinte trexo só modificando o que for indicado.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="addthis_toolbox">
    <div class="two_column">
        <div class="column1">
            <a class="addthis_button_twitter">Twitter</a>
            <a class="addthis_button_facebook">Facebook</a>
            <a class="addthis_button_buzz">Google Buzz</a>
            <a class="addthis_button_orkut">Orkut</a>
            <a class="addthis_button_live">Live</a>
            <a class="addthis_button_technorati">Technorati</a>
        </div>
        <div class="column2">
            <a class="addthis_button_favorites">Favoritos</a>
            <a class="addthis_button_googlereader">Reader / Feed</a>
            <a class="addthis_button_linkninja">Link Ninja</a>
            <a class="addthis_button_googletranslate">Translate</a>
            <a class="addthis_button_print">Imprimir</a>
            <a class="addthis_button_bitly">Encurtar URL</a>
        </div>
        <div class='clear'/>
    </div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=NOME_USUÁRIO"></script>
</div>
</b:if>

Agora pegue seu nome de usuário que você cadastrou no Add This e coloque onde está marcado de vermelho no código. Salve e veja o resultado em seu blog, lembrando que isso só aparecerá no rodapé dos artigos e apenas nas páginas dos posts individualmente.

Note que no código acima há a primeira e última linhas em um tom mais claro. Se você quiser colocar esse gadget na barra lateral de seu blog, então é só copiar o HTML sem essas linhas e colar num elemento de página (gadget) do tipo “HTML/Javascript”.

creditos doferramentasblog Agora vamos mãos a obra.

Technorati Marcas: novo,Modelo,de,compartilhamentos,criado,para,o,Blogger

• Divulgar no del.icio.us
• Divulgar no Digg
• Adicionar nos Favoritos do Google
• Enviar para o Twitter
• Compartilhar no Facebook
• Compartilhar no Technorati
• Enviar para o MySpace