Botões de compartilhar personalizados, arredondados e muito lindos para usar no blog - Elaine Gaspareto- Dicas para blogs e inspirações para a vida

Botões de compartilhar personalizados, arredondados e muito lindos para usar no blog

Publicado em 24/10/2018

Aqui no blog há alguns modelos de Botões de compartilhar personalizados. São botões indispensáveis ao blog, ajudam no compartilhamento dos posts e bem sabemos que divulgação é muito, muito importante para um blog crescer.
Veja 2 modelos de botões personalizados para compartilhar posts do blog que já ensinei aqui:




Hoje quero te ensinar esse modelo:


Demonstração do tutorial


Para ter em seu blog é extremamente simples.
Comece abrindo a página com os códigos:


Copiar o código


A seguir vá até o painel administrativo de seu blog e clique em Tema.
Aí clique em Editar HTML e dentro da caixa do código fonte de seu template tecle Ctrl+F.
Na caixa de busca que expandir digite <head> e tecle Enter para localizar.
 ACIMA disso cole o CÓDIGO DA FONTE ESPECIAL.

Salve.
Digite  ]]></b:skin> na barra de busca e tecle Enter para localizar.
ACIMA de  ]]></b:skin> cole o CÓDIGO CSS.
Salve.

Agora digite <div class='post-footer'> na barra de busca e localize. Aparecerão (possivelmente) 2 ocorrências dessa linha. Estamos em busca da segunda ocorrência, ok?
ABAIXO de <div class='post-footer'> cole o CÓDIGO HTML.
Salve.

Tá feito.
Simples e fácil demais, né?





13 comentários

  1. Elaine faz uma postagem contando o que acontecera com o blog se o google plus realmente acabar! Obrigada.

    ResponderExcluir
  2. Infelizmente não consigo achar esta segunda ocorrência porque entendo que tenho que encontrar uma linha rigorosamente igual. Encontro semelhante. Há um tempo que meu botão do Pinterest está com defeito e não estou conseguindo corrigir... Obrigada.

    ResponderExcluir
    Respostas
    1. Regina, tem que experimentar.
      Faça o tutorial e cole o código abaixo da linha semelhante que achar, vá testando até achar o lugar correto..

      Excluir
    2. Olá Elaine, super obrigada pela dica. Finalmente consegui colocar estes botões lindos, fiquei hiper contente porque foi custoso, mas qual minha surpresa ao perceber que o botão mais importante, da rede que tenho os melhores resultados que é o PINTEREST não está ok? Aparece a caixa corretamente e a imagem é dada como enviada, mas ao conferir, vi que o espaço da imagem fica invisível e o resto todo aparece. É só este botão. Ai, ai God...rsrs. Um beijo e obrigada pela atenção. Nem tinha visto esta resposta (https://reginabomfim.blogspot.com

      Excluir
  3. Elaine, tudo bem? Eu baixei o tema Amora, por desejar talvez no futuro, usar o formato grid. Os botões compartilhar do Amora obedecem o mesmo processo para colocar no blog? Ainda estou tentando consertar o botão do Pinterest no Noele. Olhando para o HTML do tema Amora (para ver se dava para me orientar no conserto do botão no tema Noele) vi trechos diferentes. Procurei em seus "tutos" de botão e não encontrei. Grata se puder me dar um auxílio (https://reginabomfim.blogspot.com). Estou pensando em apagar o botão com defeito (muito tempo ruim) do meu blog oficial, pois já tenho o botão PIN na imagem funcionando ok. Quero te ouvir antes. Bj e gratidão.

    ResponderExcluir
    Respostas
    1. Regina, todos os tutoriais usados no tema estão na faq que está no blog de testes.
      Lá tem o tutorial dos botões :)
      Se não me engano são esses botões, faz tempo que o tema estava pronto, mas creio que são esses.
      Vc viu trechos diferentes porque são modelos diferentes.
      Quanto ao defeito que vc menciona no blog de testes ele não aparece, funciona normalmente... talvez seja o caso de baixar de novo e reinstalar pra conferir...

      Excluir
  4. Olá Elaine, grata por sua atenção. Para estudar, testar tenho um tema de teste igual ao Noele e recentemente o reinstalei para algumas correções "extra botões" (rs) (https://criandoporaija.blogspot.com). Infelizmente, clicando nele aqui nem abre nada. Mais esquisito ainda é funcionar no seu e não no meu. Vou ver este FAC e ver o que fazer. Pensava que estava tudo ok. Tá tudo ruim, testei celular. Sigo testando. Bjo

    ResponderExcluir
  5. Elaine, fiquei pensando se deveria te chatear de novo com esse assunto de botões. Continuo ainda buscando solucionar o problema conforme sua ajuda, mas tem um dado novo: Vi também que os botões do twitter e linkedin não funcionam no celular. O Twitter entra na página inicial depois do login e o linkedin não aparece o botão publicar que conclui a ação. Entrei no seu site via celular e vi o mesmo probl. Sei que estuda muito, tem muita gente que auxilia e seu tempo é curto. Os botões na imagem deram super certo, mas tive que retirar o botão pin da imagem que havia colocado há tempos porque não sumiu. Grata.

    ResponderExcluir
    Respostas
    1. Regina, nem aqui no blog e nem no blog de teste eu identifiquei nenhum dos problemas que você menciona.
      Pra mim funciona certinho tanto no celular quanto no desktop... e até então ninguém mais me falou desses problemas Infelizmente nao tenho mais como ajudar... sorry...
      bjsss

      Excluir
  6. Ok Elaine, grata sempre por sua atenção. Seu blog sempre será uma referência para mim. Sucesso!

    ResponderExcluir
  7. excelente aula ..porem meus post estão unidos não tem um espaçamento com o post de cima e o post de baixo...como resolver isso ?

    ResponderExcluir
    Respostas
    1. É que vc fez os posts todos na mesma data, não é?
      Nesse modelo que estamos trabalhando, se os posts forem feitos mais de 1 por dia eles se juntam.
      Experimente mudar a data de cada post e vc verá que eles se separam...

      Excluir

Olá! Muito obrigada por ler meu blog e obrigada também por se dispor a comentar meus posts. Seja muito bem-vindo(a)!

Importante!
Devido à falta de tempo hábil eu não me comprometo a responder perguntas referentes aos tutoriais postados neste blog.
Pedidos de ajuda individual serão respondidos conforme o meu tempo e disponibilidade permitirem.
Deixe sua pergunta ou solicitação sempre nos comentários, eu infelizmente não tenho como responder pedidos de ajuda por email.
Por favor, entenda: comentários sem relação alguma com o post não serão liberados e nem respondidos.

Para saber mais sobre a melhor forma de utilizar este blog leia Termos de uso do blog.



Muito obrigada, fique à vontade para interagir.
Mas lembre-se:
Gentileza, educação e boas maneiras servem também para a vida nos blogs…