Welcome to the blog Hitech Tips

A blog about web and IT. Sharing things I use at work.

Como adicionar os botões de partilha no Twitter e no Facebook

Posted by Mr.Editor Monday, February 15, 2010

Neste post vou mostrar como adicionar os os botões de partilha no Twitter e no Facebook. É fácil. O aspecto final será algo como na imagem seguinte, em que os botões aparecerão do lado direito do título do post:

image

Siga então os passos seguintes:

  1. Antes de mais, faça uma cópia de segurança da sua template. Muito importante! Permitir-lhe-á desfazer algum erro caso se engane. Veja aqui como: Fazer cópia de segurança da template
  2. Depois terá de modificar a template. A melhor forma de o fazer será fazendo uma cópia do ficheiro descarregado e depois editando a cópia com o Bloco de Notas do Windows (Notepad) ou, ainda melhor, usando o excelente Notepad++ (freeware).
  3. Na template, procure este pedaço de texto:
    ]]></b:skin>
    e imediatamente por cima abra uma linha em branco e cole o seguinte texto:

    .retweet { /* estilo da div de partilha */
    float:right;
    padding: 5px 0px 0px 5px; 
    }

    Isto cria um estilo CSS para posicionar os botões de partilha.

  4. De seguida, procure o seguinte pedaço de texto
    <div class='post'>

    nota: se não encontrar o pedaço de texto anterior, procure algo parecido. O importante é que comece por <div e contenha class='post'
    e imediatamente a seguir abra uma linha em branco e cole o seguinte texto:

    <!—SHARE begin -->
    <div class='retweet'>
    <!-- FACEBOOK share –>
    <a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/> 
    <script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/
    <br /><br />

    <!-- TWEETER share --> 
    <script type='text/javascript'>
    tweetmeme_style = 'compact';
    tweetmeme_url = '<data:post.url/>';
    tweetmeme_source = TwitterUserName; 
    </script> 
    <script src='
    http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>   
    </div>
    <!-- SHARE end -->

  5. Altere o texto vermelho em cima para ser o seu utilizador twitter.
  6. Grave o ficheiro. Vá ao blogger e carregue a nova template. Para isso, vá a Esquema – Editar HTML, clique em "Choose File" (ou o correspondente em português), seleccione o ficheiro que gravou e clique em carregar.
    image
    A template será automaticamente carregada.
  7. Veja o resultado. Se houver algum erro, reponha a template anterior (veja aqui como: Fazer cópia de segurança da template) e analise em detalhe se fez as alterações indicadas.
    E é isto, está feito. Boas blogagens.


0 comments

Post a Comment

Followers