Cursos 24 Horas - Cursos 100% Online com Certificado

Botões de compartilhamento (Novo recurso) - Blogger

59 Comentários Autor : Notícia e blog 11 junho 2010

O Blogger inseriu mais uma inovação que é muito útil e substitui aquelas funções que só a navbar tinha, o recurso permite enviar a postagem para diversos serviços de compartilhamento que são os principais, Twitter, Facebook, Buzz e ainda funções como enviar por e-mail e blogthis ou seja postar no seu blog o link da postagem. Quem tem os templates padrões do Blogger, pode desfrutar deste serviço apenas acessando o painel mais quem possui um template personalizado deve fazer algumas alterações que veremos abaixo.

Ativando o serviço pelo painel

1) Acesse o painel do Blogger(draft.blogger.com)

2) Vá “Layout/Design”-> “Elementos da página”-> “Postagens no blog”->  “Editar”

3) Selecione a caixa “Mostrar botões de compartilhamento”

botao-post

4) Verifique se apareceu um barra de ferramentas como esta abaixo:

botao-post2

5) Se apareceu, não será necessário fazer qualquer alteração no seu blog, caso contrário faça a alteração seguinte.

Alterando HTML

1) Vá em “Layout/Design”-> “Editar HTML”-> Marque a caixa “Expandir Modelos de Widgets”

2) Procure pelo seguinte código utilizando as teclas “CTRL” e “F”:

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

Obs.: Se tiver mais de um lembre-se que é o segundo e como referência ele deve estar antes do seguinte código:

<div class='post-body entry-content'>

3) Substitua-o pelo seguinte:

<div class='post-header'>
    <div class='post-header-line-1'><div class='post-share-buttons'>
        <b:include data='post' name='shareButtons'/>
      </div> </div>
    </div>

4) Salve e visualize.

 

Pronto creio que agora o serviço vai funcionar com certeza pois verifiquei nos modelos padrões e única diferença era essa pois o código do botão o blogger já havia adicionado então o que faltava era este.

    59 Comentários

    kaytros disse...
    12 de junho de 2010 09:37 #

    muito obrigado, tava precisano

    kaytros disse...
    12 de junho de 2010 12:13 #

    aq eu to quereno colocar um baner flutuante no meu blog para os visitantes assinad o feed via feed buner, so que eu queria ele assim: o visitante entra ai aparece o baner no centro da tela e o resto da tela escurece, se o vistante rolasse a pagina ele aconpanhace tb....

    desde de ja obrigado...

    Vickeon disse...
    13 de junho de 2010 15:52 #

    como faço para colocar embaixo da postagem?

    Marilucia disse...
    13 de junho de 2010 15:55 #

    Oi Fernando, fiz como orientou, disse que se aparecesse as barras de ferramentas não seria necessário colocar os códigos, marquei a caixa, mas os icones não apareceram.

    Notícia e blog disse...
    14 de junho de 2010 12:02 #

    @Marilucia
    Então você deve adicionar os códigos que forma mostrados na postagem, se não funcionar comente...

    Sou blogueiro - INDICOESSE disse...
    20 de junho de 2010 16:34 #

    não está funcionando até agora (20.05/10)

    Sou blogueiro - INDICOESSE disse...
    20 de junho de 2010 17:19 #

    consegui agora , valeww, indico aqui!

    Nadia Gal Stabile disse...
    20 de junho de 2010 23:39 #

    não funcionou, nem no DRAFT BLOGGER e nem no blogger antigo!! se puder responder porque!.... lá onde há as configurações da postagem (no layout) não aparecem estes ícones!! agradeço

    Ana disse...
    24 de junho de 2010 09:11 #

    A minha barra de ferramentas apareceu em cima de cada postagem eu queria que aparecese embaixo junto com os marcadores como faco?

    Diário de Vagas disse...
    24 de junho de 2010 10:38 #

    Muito obrigado, muito útil!

    Ministério Boas Vindas disse...
    6 de julho de 2010 17:28 #

    A minha barra de ferramentas também apareceu em cima de cada postagem eu queria que aparecese embaixo junto com os marcadores como faco?

    Igoя disse...
    23 de julho de 2010 19:59 #

    Vaaaaaaaaaaaaaaaaaaaaaaaleuuuuuuuuu! Brigado mesmo cara! Seu Blog é o melhor!

    Cristian disse...
    25 de julho de 2010 06:52 #

    aqui não funcionou

    Notícia e blog disse...
    25 de julho de 2010 09:06 #

    @Cristian
    Tente novamente pois os passos deste tutorial estão OK.

    poemandoavida disse...
    30 de julho de 2010 12:38 #

    Ela fica abaixo do título. tem como deixá-la embaixo? Junto com os comentários?

    Circe disse...
    30 de julho de 2010 23:29 #

    Caraca!!!
    Valeu a dica.Estava procurando um jeito de fazer isso sem a complicação de mudança de códigos e encontrei,valeu.
    Pena que não o orkut junto.
    Indico e funciona mesmo.
    Abraços

    Ana do ***Calcinha Fru-Fru*** disse...
    5 de agosto de 2010 09:51 #

    E se o lay não tem "div class='post-header-line-1'" como faço?

    Notícia e blog disse...
    5 de agosto de 2010 13:32 #

    @Ana do ***Calcinha Fru-Fru***
    Basta adicionar então em div class='post-header-line-1'

    EnigmA disse...
    7 de agosto de 2010 21:26 #

    Brigadão!!!!!!
    o unico lugar que eu achei como fazer aparecer esse recurso!!!

    3DN4LDO disse...
    17 de agosto de 2010 15:51 #
    Edson Palma disse...
    31 de agosto de 2010 01:29 #

    Ótimo, eu achei extremamente útil para nós blogueiros!!!

    Obrigado

    ;-)

    Até mais...

    Missões e Adoração disse...
    4 de setembro de 2010 22:12 #

    Meu tema não tem post-header-line e nem post-footer-line.

    Alguma outra sugestão?

    HTSR disse...
    8 de setembro de 2010 14:00 #

    Muito bom. Obrigado.

    Carol K. disse...
    29 de setembro de 2010 11:48 #

    No meu blog não tem o primeiro código, mesmo assim procurei pelo segundo e colei o código maior acima dele, e os botões apareceram, mas em cima da postagem e abaixo do título. Como faço para colocar is botões abaixo da postagem?
    Obrigada!

    Patrícia V.S disse...
    14 de outubro de 2010 22:56 #

    Os botões aparecem, mais no meu caso aconteceu o mesmo no que da Carol K. Os botões ficaram em cima. Mesmo entrando em Elementos de página, editar postagens do blog , e colocando ele em baixo, os botões continuam em cima. O que posso fazer ?

    Obrigada ;D

    Futmesa Brasil disse...
    21 de outubro de 2010 07:18 #

    Ola,
    Segui suas dicas sobre colcoar os botões de compatimento nas postagens mas eles ficaram na parte de cinma das postagens, logo embaixo do titulo. Eu mudo conforme o meu gosto nas ferramentas mas mesmo assim eles ficam na parte superior e la encima fica estranho. Como que faço para remove-lo para parte de baixo?
    Parabéns pelo seu belo site concerteza o melhor do genero.
    Obrigado desde ja
    abraço

    Sabrina Jung disse...
    8 de dezembro de 2010 23:53 #

    Valeu!!
    Já que o Blogger não facilita a nossa vida, vc facilitou!! =)

    Mila Barros disse...
    10 de dezembro de 2010 20:58 #

    nossa valeu \o/

    Heryk Slawski disse...
    28 de dezembro de 2010 09:23 #

    Obrigado pela dica! Facilitou muito!

    Agora basta descobrirmos como colocar ela lá em baixo.

    Abraço

    Friends4Fun disse...
    2 de janeiro de 2011 18:03 #

    Olá, muito útil e realmente funciona. Mas a barra apareceu acima da postagem e abaixo acabou sumindo algumas opçoes, como o link "Mais" para ler todo o artigo.
    Notei q isso não foi um problema só meu, se puder nos ajudar, eu agradeço :)

    Feliz 2011 a todos!

    Rosane disse...
    13 de janeiro de 2011 16:54 #

    Valeu mesmo, resolveu meu problema aqui.

    Janine Cruz disse...
    17 de janeiro de 2011 04:11 #

    Gente preciso de uma ajuda. Consegui por os botões de compartilhamento, porém qdo abre a janela do face book, só aparece a foto e o título do post. Já vi em alguns blogs q qdo se clica no compartilhamento vai o título a foto, uma parte do texto e o autor. Como configuro isso...agradeço...abraço, Janine

    Marcelo Daltio disse...
    11 de fevereiro de 2011 15:03 #

    Muito útil, funcionou muito bem.

    Emerson Almeida disse...
    14 de março de 2011 20:53 #

    Muito Obrigada

    Karina disse...
    20 de março de 2011 08:16 #

    Consegui, tive que alterar em html, mais ele ta la em cima, gostaria de colocar no final da postagem, tem como?

    Djegovsky disse...
    20 de março de 2011 10:20 #

    Fiz o que foi descrito e não houve alteração alguma no meu blog. Estranho.

    Djegovsky disse...
    20 de março de 2011 10:51 #

    Depois consegui, colando o código. mas,como todo mundo, os botões de compartilhamento ficam em cima, logo abaixo do título e não no rodapé.

    Daminha* disse...
    28 de março de 2011 23:12 #

    meu html nao possui div class='post-header-line-1'

    comoproceder? acrescentar? onde? uma letra errada muda o template todo podendo vir a tirar do ar...

    Redecore Interiores disse...
    31 de março de 2011 18:24 #
    raposao disse...
    12 de abril de 2011 01:21 #

    galera a baixo da postagem é so ir atras dos codigos div footer line

    Jéssica Dumb disse...
    16 de abril de 2011 20:46 #
    Este comentário foi removido pelo autor.
    ARPE disse...
    22 de maio de 2011 12:59 #

    Hola... eu estou com um pequeno (ou grande) problema, os botões de compartilhamento no meu blog não aparecem os ícones... percebo que o lugar é adicionado mas fica como se fossem invisíveis, como se nada tivesse alí. Acredito que o erro seja do meu template.. alguma alteração inadequada que fiz.... pois o botão do Tumblr também apresentou o mesmo erro. Nessa parte informada no tutorial por exemplo o meu tá assim:


    <*b:if cond='data:post.dateHeader'>
    <*h2 class='date-header'><*span><*data:post.dateHeader/>


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

    <*div class='post-body entry-content'>
    <*data:post.body/>

    Será que é esse o meu problema?
    PS: Coloquei o código com * pra postar aqui o HMTL

    1k2 disse...
    2 de junho de 2011 12:26 #

    Caro
    O código funcionou, Eu só ficaria feliz se conseguisse mostrar o número de comentários do Dihitt com os comentários colapsados, que nem no Blog Brasil Acadêmico.

    []´s e bom trabalho

    Nana disse...
    18 de junho de 2011 14:22 #

    Eu fiz isso direitinho, mas na hora de "visualizar", aparece que o código não funciona. Aparece...

    Não foi possível analisar o seu modelo, pois sua formatação é inadequada. Certifique-se de que todos os elementos XML estão fechados adequadamente.
    Mensagem de erro em XML: The element type "b:includable" must be terminated by the matching end-tag "".

    Error 500

    E agora? :\

    Lídia disse...
    26 de junho de 2011 23:32 #

    Consegui modificar, BUUUUT aparece duas vezes...
    Depois do título e no fim da postagem....
    Como faz pra deixar somente no fim da postagem?
    Me ajuda?

    "ท૯کCaµ" disse...
    11 de julho de 2011 03:03 #

    Achei a solução aqui

    http://www.dicasblogger.com.br/2010/11/como-colocar-share-buttons-do-blogger.html

    Marcela Lima disse...
    14 de julho de 2011 15:58 #

    Muito útil!! Obrigada!!

    Veja como ficou mais legal meu blog com essa sua dica!!

    http://bordadosvegetarianos.blogspot.com

    Kris Efe disse...
    15 de julho de 2011 14:14 #

    @Ana do ***Calcinha Fru-Fru***

    O mesmo problema, tentei resolver colando em div class='post-header-line-1' mas não funcionou no meu template.

    Mig-Meg disse...
    28 de julho de 2011 15:23 #

    Muito bom! Valeu!!

    Nysp disse...
    2 de agosto de 2011 11:41 #

    Opa, funcionou perfeitamente! Obrigado!

    Léo Davi disse...
    11 de agosto de 2011 10:04 #

    Olá. os icones no meu blogs estão lá, mas estão invisíveis. Como faço para eles aparecerem?

    Abilon Naves disse...
    18 de outubro de 2011 10:01 #

    Ótimo.

    Os botões de compartilhamentos foram inseridos. Todavia, os botões aparecem ao final de cada matéria da página.
    - Como fazer para realocar os botões para o início/cabeçalho de cada matéria?

    Obrigado

    Camila Cristina disse...
    26 de outubro de 2011 01:12 #

    Ótimoo post. Me ajudou muito, já havia procurado em vários lugares e nada.

    Deu super certo e ainda consegui colocar em baixo.
    Agora, engraçado, os botões do Orkut e +1 não estão aparecendo.

    Valeu demais!!!

    Daisy Brazil disse...
    11 de novembro de 2011 09:24 #

    Olá... Já realizei tudo que você pediu, tentei de outras formas mas os botões não aparecem de jeito nenhum teria algum jeito para poder te enviar o código para você ver o que tem de errado pra mim? o meu e-mail é daisy.brazil@hotmail.com. Desde ja obrigado

    Anônimo disse...
    4 de junho de 2012 19:46 #

    Oiii, queria colocar aqueles botôes que tem no final do seu post, que inclue, Twittar, Curtir, Compartilhar e G+1.

    Obrigado.

    Josiane Szargiki disse...
    22 de julho de 2012 00:59 #

    Era o que estava procurando, deu certo mas os icones ficaram em cima das postagens, gostaria de saber como fazer para que fiquem ao final da postagem!

    Obrigada pela dica!

    Susana Emm disse...
    28 de agosto de 2012 07:59 #

    Muito obrigada!!! Já estava desistindo....a única coisa que ainda não ficou como eu queria é que os botões estão aparecendo no início do post e não no final...

    Rafa Belliboni disse...
    18 de março de 2013 00:00 #

    Não funcionou no meu. Como faço?

    Frases de Juahrez Alves disse...
    12 de setembro de 2014 16:46 #

    Amigo, como expandir modelo nesse template novo?

    Postar um comentário

    Deixe seu comentário aqui
    Para exibir sua foto, escreva o seu comentário e clique em "Visualizar" e em seguida clique em "Adicionar Foto de Perfil"(Só é exibido quando o comentário é publicado como Conta do Google). Para editar seu perfil Clique aqui.