Em meu post anterior, publiquei um plugin para colocar o Box Flutuante com os botões de compartilhar que temos aqui no [ Ferramentas Blog ], mas para usuários do Wordpress. Agora vou ensinar como inserir o widget no Blogger/BlogSpot que funcionará da mesma forma, como é o plugin para WP. você poderá adicionar facilmente em seu blog para facilitar a divulgação de seus conteúdos.
Se olhar na lateral desse post, como de todos aqui do Blog, verá uma barra flutuante no lado esquerdo, com ícones e botões de divulgação de conteúdo em redes sociais. Nosso primeiro modelo foi para usuários do WordPress.org, como você pode ver no link abaixo:
Mas agora também criamos a versão do código para quem usa o Blogger e quer colocar esse mesmo recurso com os mesmos efeitos.
Backup do template do Blogger/Blogspot:
Antes de fazer qualquer alteração em seu template, realize um backup do mesmo em Modelo > “Fazer backup / Restaurar modelo”:
Basta clicar no botão “Fazer download do modelo completo” e salvar o arquivo em seu computador.
Caso algo saia errado durante a instalação, basta voltar a esta página e selecionar o arquivo baixado e fazer seu upload.
Para mais detalhes, leia também:
Instalando o Box Flutuante em seu Blogger/Blogspot:
Vamos mostrar todo o procedimento pelo novo painel do Blogger que você pode acessar usando o endereço http://draft.blogger.com/. Se você não sabia, o Blogger está com um novo layout e estrutura de painel: Novo Blogger liberado para todos os usuários.
Com este código que vamos ensinar, são inseridos automaticamente os botões das seguintes redes sociais:
- Botão de RT do Twitter
- Botão Google +1
- Botão “Curtir” do Facebaook
- Botão “Enviar” de grupos do Facebook
Vá até o menu “Modelo” e procure por “Editar modelo”, então clique para “Expandir modelos de widgets”:
Depois de feito isso procure pela tag </head> (utilize o atalho CTRL + F para realizar a busca). Exatamente ACIMA dela você irá colar o seguinte código:
Ainda nesta mesma página e dentro do código fonte do Blogger onde você está, procure pela tag </body>. ACIMA dela cole este outro código:
Finalmente procure pela linha de código <div class=’post-footer-line post-footer-line-3′> e cole ABAIXO dela este código:
Agora clique no botão “Salvar modelo” e veja o resultado que irá aparecer APENAS dentro das páginas dos posts e não na home do blog.
Personalizando o widget:
Podemos ainda personalizar o widget, primeiro de tudo mudando o usuário do Twitter. Procure pelo trecho:
Nele basta substituir o “ferramentasblog” pelo seu nome de usuário no Twitter.
É possível também modificar a distancia entre o post e o Widget, para isso basta alterar a margem que for determinada na seguinte linha:
Basta alterar o -100px que é encontrado em “margin:0 0 0 -100px“. Quanto maior o numero negativo, mais longe do post ele irá ficar.
E ainda nesta parte do código podemos alterar a posição inicial do widget na tela, para isso altere o valor de “top:200px“.
Finalizando:
Agora quando eu estava escrevendo este post, o Marcos Lemos lembrou que já havia publicado algo similar aqui em:
O post é de um ano atrás e o resultado final, como já disse é similar ao o que eu ensinei aqui hoje. Porém este widget novo conta com os botões sociais do momento, ele aparece apenas dentro dos posts e conta com efeitos ao descer a tela. Portanto é mais completo e mais aconselhável.
Código atualizado em 30/01/2012:
Atualizamos o código inserindo as novas versões dos botões do Twitter, Google Plus e Facebook (atualizados com código compatível ao HTML5), além de realizar outras melhorias nos códigos.
Esta atualização deverá ajudar todos aqueles que estavam com dificuldades de inserir os botões em seus blogs.
Não encontrei a linha Expandi o modelo também não encontrei.
Qual delas?
Tentei em post-footer-line-3 não funcionou e tentei em post-footer-line-1 e também não funcionou
Expanda o modelos de widgets, talvez seja isso.
Diogenes, eu também não estava encontrando. Copiava literalmente o código e nada. Daí usei a lógica, ora se alguma parte d código deve existir! Comecei apagar de trás para frente, e ao apagar as referências ‘> ele imediatamente reconheceu.
Faz o teste e comente se deu certo.
No meu funcionou certinho.
Abraços.
Você pode tentar procurar por alguma linha semelhante e/ou mudar o “3”, por “1” ou “2”.
Essas linhas existem em qualquer template do Blogger.
Muito obrigado pela dica, sou fã o ferramentas blog e estou sempre lendo os artigos, Parabéns.
Acabei de ver o Box flutuante em seu blog e ficou perfeito, funcionando muito bem.
Mais Uma Vez, Vlw Claudio.
Quando eu faço todos os passos, da tudo certo, só que cria uma barra de rolagem na parte de baixo do blog.
Rodolpho, você colocou o botão para ficar do lado direito do blog?
Se foi isso irá acontecer, porque o Enviar/Send do Facebook faz aparecer uma caixa para o lado direito e criar realmente a barra lateral.
Meu conselho é que você use ele do lado esquerdo do blog ou tire o botão Enviar/Send.
Ali no código do Facebook aparece assim: send=’true’.
Mude ele para: send=’false’ e problema resolvido.
Continuou do mesmo jeito amigo. Não sei o que é viu.
Cara, o meu também aconteceu isso, mais é só você ir em designer do modelo, depois em css, e acressentar no final isso: body { overflow-x: hidden; }
=)
Amigo, a um erro nesse paragrafo “do código para que(QUEM) usa o Blogger e quer colocar esse mesmo recurso com os mesmos efeitos.”
Ps: Adorei a dica..
Obrigado, já corrigi.
Muito show essa dica, acabei de colocar e fiquei feliz da vida. Parabéns ao FB site que eu recomendo muito. Abraço.
Ficou ótimo em seu blog tb. Combinou muito bem com o seu layout.
Muito boa a dica! Parabéns!
Nossa, obrigado mesmo. Acabei de colocar no meu blog, mas no meu não apareceu o botão do google+, o que aconteceu?
Abraços
Eu não sei o que aconteceu, mas agora de certinho.
Muito Legal
Abraços
Ótima dica. Já coloquei no meu blog!
Abraço
Adoreiiiiiiiiii!!!!! Já coloquei no meu blog ;DD Só uma coisa quando eu vou em ENVIAR e mando o para um grupo diz: encontramos o seguinte erro ao enviar sua mensagem.
Só q nao diz qual é o erro =//
Estou fazendo alguma coisa errada será??
Abraçoss
Instalei com sucesso, mas depois que instalei, um outro script (que executa um slide na página inicial) deixou de funcionar.
O script do slide esta entrando em conflito com o botão de compartilhar.
Esse slide é só na home mesmo?
Coloca ele entre:
<b:if cond='data:blog.pageType == "index"'>
SEU CÓDIGO AQUI.
</b:if>
Coloquei o script ai dentro, assim vai fazer ele abrir só na home e talvez não vai dar mais problema com o Box Flutuante.
O script do slide é só aparece na Home. Como deu esse conflito retirei os botões e o slide voltou a funcionar.
Quando estou no último passo para colocar o widget e vez de aparecer
aparece
o que eu devo fazer?
Você esta fazendo algo errado.
Já testei em temas do novo modelo de design do Blogger e também com temas personalizados e tudo funcionou.
Também tentei colocar os scripts de https://ferramentasblog.com/2011/05/como-usar-os-sistemas-de-comentarios-do-blogger-e-facebook-ao-mesmo-tempo.html e ocorreu conflito com o script do slide que fica na Home do blog.
Isso acontece por causa de conflito, use as condicionais do Blogger para carregar os scripts da home apenas na home e o do box flutuante apenas nas páginas dos posts:
https://ferramentasblog.com/2010/08/codigos-e-tags-condicionais-do-blogger.html
Simplesmente dá erro sempre. Já testei.
Edigley,
Outros aqui já conseguiram e estão usando sem problemas.
Pode ser algum conflito com outros recursos em seu blog, por isso recomendamos o teste antes de aplicar. Também reveja os passos e leia com atenção para ver se você não esqueceu ou não trocou nada indevido.
Marcos,
Eu instalo o box flutuante com sucesso e facilidade, personalizo ele e tudo mais. O problema é que sempre ocorre conflito com o script do slide (que fica na Home do blog) deixado-o estático, ou seja, sem funcionamento.
Estou revendo o script do slide.
O problema também persiste quando instalo outros scripts como no post: “Como usar os sistemas de comentários do Blogger e Facebook ao mesmo tempo”, do qual queria muito utilizá-lo.
A certeza é absoluta quanto ao conflito com o script do slide, pois em outros blog cujo template é semelhante (sem slide), não ocorre esse bug.
Grato pela atenção.
Ele é um ótimo gadget, o ruim é que fica atrapalhando certa área do blog.
Aqui dá esse erro:
The value of attribute “type” associated with an element type “null” must not contain the ‘<' character.
O que eu faço?
Nany,
você deve ter esquecido alguma parte do código ou apagado algo indevido no que mostramos aqui.
Reveja os passos.
Deu certo!
Nossa, muito obrigada!
E parabéns pelo blog, ele é muito útil para a blogosfera brasileira!
Apesar de ser um belo gadget, no meu blog não iria cair bem, pois uso duas barras laterais (uma de cada lado). Iria atrapalhar o menu de categorias.
Em alguns momentos, as explicações foram insuficientes e tive de consultar outros sites para conseguir entender.
Quando copiei e colei os tags, vieram juntos os numeros das linhas e tive de tirar um a um.
Não consegui instalar o link do facebook.
Rodinei,
Para copiar os códigos, basta parar o mouse por cima da área de códigos que aparecerá o botão de “Copiar” (Copy). Assim você não teria tido dificuldade alguma.
Achei super facil de instalar! Só achei também q teria que explicar que tme q tirar os numeros! Mais vc nota ao instalar que eles aparecem dai é só ir la e tirar!! Nada que gere problemas!! A unica coisa q nao funciona no meu é que quando vou em Enviar e mando para um grupo, da um erro!! =/ Não sei o que está acontecendo, quando envio para uma pessoa da para um grupo não!!
Claudio, o código acima é muito pesado? É compatível com todos os navegadores?
Neto,
É super leve, pequeno e compatível.
Tive que tirar o codigo por que deu um comflito quando o site era exibido no windows explorer. Um erro de top set algo assim. O que será que deu errado? Em alguns computadores o erro não permitia abrir o site.
Impossível dar algum erro assim, ainda mais porque o Windows Explorer é o que você usa para abrir pastas no seu computador. O que você usa para navegar na internet se chama Internet Explorer.
Quanto ao código, várias pessoas estão usando em seus blogs, tanto no Blogger como no WordPress, são apenas os scripts dos botões mais um Jquery minúsculo, nada disso tem incompatibilidade alguma com qualquer browser.
Caso você tenha tido algum problema, posso lhe garantir, sem sombra de dúvidas que este Widget não foi o que causou isso.
Com certeza tem outra coisa no seu site ou você fez algo errado que gerou isso.
Vou tantar novamente. Grande abraço e valeu pela atenção!!
No meu eu testei, funciona, mas tira a movimentação do slide quando poe esse script. Se houvesse como adicionar o mesmo sem perder o slide seria muito interessante.
Não teria como adicionar o mesmo como widget? Tipo, em elementos de página?
Xandy o slide é apenas na homepage do site?
Você pode colocar os scripts do widget entre as tags:
<b:if cond='data:blog.pageType == "item"'>
Seu código aqui!
</b:if>
Acontece o mesmo comigo.
Tente fazer isso com os scripts, desta forma ele vai carregar os códigos do box flutuante apenas nos posts onde não esta o slideshow.
Olha testei novamente o código, mas novamente aparece esse erro na pagina do Internet Explorer:
Mensagem: ‘offset.top’ é nulo ou não é um objeto
Linha: 633
Caractere: 1
Código: 0
E no Internet Explorer os botões do Curtir e Enviar do Facebook não aparece. Agora no Google Chrome funciona direito.
Tem esse erro aqui também:
Mensagem: ‘root’ é nulo ou não é um objeto
Linha: 6
Caractere: 1252
Código: 0
URI: http://connect.facebook.net/pt_BR/all.js#appId=102576646508501&xfbml=1
Existe algo que não esta dando certo com os scripts, veja que tem problema com o script do Facebook.
Veja que aqui no Ferramentas Blog usamos os mesmo scripts e no Internet Explorer não é apontado nenhum desses erros que você relatou.
No Ferramentas Blog não é plugin do WordPress? Vou dar uma espiada nos blogs da turma que relatou aqui que deu certo. Vou fazer o teste do Internet Explorer para ver se da erro.
Fiz todos os testes, abri os blogs de quem relatou ter dado certo, usando outros navegadores além do Chrome e tem funcionado perfeitamente para todos.
Tenho certeza de que o problema é aí no seu computador e não nos blogs em questão.
Olhei no blog da http://www.nararacco.com/ e entrando com o Google Chrome da tudo certo agora de entro com o Internet Explorer do Windows7 dá o mesmo erro. O site demora para entrar e quando entra da o mesmo erro que comentei antes. No Internet Explorer do XP da um erro que fecha a página. Isso é bem prejudicial né? Acho que é alguma coisa no código do facebook.
Fiz o teste no FB e só o +1 não apareceu!!!
Guilherme,
Imagino que o problema seja no seu PC com alguma outra coisa.
Fiz os testes no IE9 rodando no Win7 e no IE8 rodando no XP e os botões funcionaram perfeitamente em blogs do Blogger.
É bem provável que você está copiando o código de forma errada ou modificando algo indevido.
Veja se está tudo como nos passos descritos e não modifique nada além do que for recomendado.
Muito bom, aqui funcionou de primeira! Parabéns pelo tópico Claudio!
Só falta vocês ensinarem como fazer aquele efeito com a barrinha do menu no topo do Ferramentas Blog ! rs
Obrigado pelo código , funcionou direitinho.
Esse efeito deu trabalho até pra mim xD
Olá Marcos e Cláudio,
Como posso fazer para colocar essa barrinha com os botões de compartilhar logo abaixo do resumo dos posts na home do FB?
Estou tentando algo parecido e o botão do google plus hora gera conflito entre o botão da barrinha e o botão do box flutuante e hora gera conflito entre as os botões de cada resumo.
Como é o código que vcs usam, pois vejo que aqui no FB funciona tudo muito bem! Obrigado pela ajuda.. Abraço..
Alberto Lozéa
Uma sugestão, será que não é possível acrescentar o botão share no Facebook? Tentei fazer, mas o botão curtir sumiu. Saberiam o motivo?
É que o Botão “Share” (compartilhar) deixou de existir e tudo passou a ser o botão “Curtir” no Facebook.
Marcos, algo que aconteceu comigo e não sei se com mais alguém. Ao curtir o link, em vez da imagem do post ir pro Facebook, vai a imagem de uma outra pessoa que também curtiu o post.
Pingback: Gadget de tweets e perfil do Twitter para Blogs | [ Ferramentas Blog ]
Olá Claudio,
Obrigado pelo gadget, instalei perfeitamente no novo layout do Jadsonet, ficou show de bola.
Oi, primeiro gostaria de agradecer pelo excelente post e em seguida peço um pequena ajuda. Como você pode reparar no visual do meu blog:
http://blogtransferencia.blogspot.com/2011/08/crionica-quantos-aniversarios-voce.html
O widget, acaba sobrepondo o conteúdo do blog, assim gostaria de saber como fazer para polo ao lado direito do post, onde ficaria perfeito!
além disso, seria possível trocar a cor? gostaria de um tom escuro.
Obrigado
Leia o post com atenção.
Há no final uma explicação sobre como e onde fazer modificações na distância/posição e nas cores.
A cor de fundo consegui mudar, olha:
http://blogtransferencia.blogspot.com/2011/08/qual-palavra-pode-agora-definir-o-todo.html
Mas quanto as bordas, gostaria de muda-as para o tom padrão das bordas do blog.
quanto ao lado, troquei o left pelo right (linha 25) mas não mudou nada :X
Aguardado uma ajuda!
Obrigado
Eu já tinha lido, mas de qualquer forma me ocorreu agora de mudar o numero para positivo e aumentar a distancia:
#fblog-box {border:1px solid #ccc; padding:5px; background:#2F4F4F; z-index:9999; display:block; position:absolute; top:300px; float:right; margin:0 0 0 +552px; text-align:center;}
E com +552 deu certinho, da forma como queria:
http://blogtransferencia.blogspot.com/2011/08/rammstein-mutter-2001.html
Agora tentar fazer as modificações para adicionar comentários via facebook conforme o outro post.
Conselho você a desativar o botão enviar do Facebook, assim não vai ficar a barra de rolar em baixo da sua página.
Isso acontece porque o Facebook só permite deixar o box onde mostra as coisas para compartilhar pro lado direito.
Você pode desativar assim:
<div id='fb-root'/><fb:like expr:href='data:post.url' font='arial' layout='box_count' send='true' show_faces='false' width='54'/>
Onde esta true, mude para false e pronto.
Valeu, ficou muito bom, só uma coisinha: tem como colocar o botão shared do facebook?
O Botão “Compartilhar” do Facebook foi descontinuado. Agora o Facebook só dá suporte ao “Curtir”, ou seja, o outro deixou de existir. Pode ser usando e não parou de funcionar, mas foi agregado ao “Curtir”.
Obrigado…
Aiiiiiiiiiiiiiiiii conseguiiiiiiiiiiiiiiiiiiiii que lindinho ficou !!! valeu gente !!!!!!!!
Olá.. há alguma maneira de fazer o botão ficar fixo em uma posição enquanto subimos ou descemos a tela?
Eu instalei o gadget no meu blog, mas no IE não aparecem os links do facebook. Nos outros navegadores funcionam perfeitamente…
Muito legal a dica! Aplicado e aprovado!
Uma dúvida, é possível deixar a caixa visível na pagina principal do blog ou só dentro das postagens?
Luiz,
é possível sim… mas não é recomendado, pois este recurso apresentará problemas para linkar suas páginas específicas.
Ok Marcos, obrigado!
Sabes o pq que no IE9 não está aparecendo os botões do facebook?
Ai o problema já é o script do Facebook.
Aos Amigos que pretendem usar esse Box, vão necessitar substituir o pt_BR do like Button do Facebook por en_US ou pt_PT, por algum motivo o Script Java que contém o pt_BR não está Funcionando, como dá pra ver ai ao Lado que Não está aparecendo o “Curtir” nem o “Send” do Facebook…
a Solução é Simples, e Serve também para quem usa o Sistema de Comentários do Facebook, se Não substituir não vai funcionar.
Espero que eles Resolvam logo isso !
Abraços a todos
O script do Facebook nos últimos tempos anda sendo um problema, as vezes funciona, as vezes não.
Mas normalmente sempre é algo temporário.
Ótimo post, só que no meu blog ele da conflito com o slide da página inicial, e o slide para de funcionar =s
Será que teria uma forma de consertar isso?
Abraço.
Pode ser possível arrumar isso se colocando o javascript do plugin em baixo do script do slideshow. Tem que achar onde esta no seu blog e colocar em baixo.
Esta LOUCO para colocar este menu flutuante, mas ai entra meu desespero,
Não consegui colocar de deixo nenhum foi ai que decidi que iria mudar todo o template do meu blog pois achava que o código estava sujo e mal organizado, mas ao fazer isso descobri o porque o menu não funcionava em meu blog ai vai a dica
no meu content-wrapper ele estava com essa propriedade overflow:hidden;
então apenas apaguei está linha overflow:hidden; e bingo!!!
Se alguem não tiver conseguindo tenta isso!
Estava LOUCO para colocar este menu flutuante, mas ai entra meu desespero.
Não consegui colocar de jeito nenhum, foi ai que decidi que iria mudar todo o template do meu blog pois achava que o código estava sujo e mal organizado, mas ao fazer isso descobri o porque o menu não funcionava em meu blog ai vai a dica
no meu Content-Wrapper ele estava com essa propriedade Overflow:Hidden;
então apenas apaguei está linha Overflow:Hidden; e bingo!!!
Se alguem não tiver conseguindo tenta isso!
Realmente, as vezes por causa do template pode acontecer algumas coisas assim.
No seu caso estava até funcionando, porém o overflow estava ocultando o box.
Caramba, Fernando! Mto obrigada pelo seu comentário. Estava quebrando a cabeça e por fim consegui.
Fernando, depois que exclui a linha “Overflow:Hidden;” no “Content-Wrapper”, funcionou perfeitamente. Adorei a dica.
Caras, só tenho a agradecer.
Foi o único que funcionou bem no template do meu blog e até combinou com o visual!
Tem como arredondar as bordas? seria animal!
Valeu mesmo =]
Abs^^
Tem sim, você pode fazer isso no CSS.
Inseria o seguinte CSS antes do do código do seu blog:
#fblog-box {
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
}
Parabéns pelo post, valeu mesmo, no meu blog funcionou
Ótimo post!
Mas tem como adaptar a um modelo com esse exemplo… “http://i56.tinypic.com/2lmowid.jpg”
Que o usuário possa compartilhar por email, orkut, msn e imprimir o artigo??
Sim claro que tem, basta você incluir os novos botões direto no HTML do box flutuante.
Se possível poderia acrescentar nesse post como personalizar acrescentando esses botões que citei acima.
Desde já agradeço.
Mas não tem segredo de incluir estes botões, o mais complicado já fizemos aqui, que foi criar o box e fazer ele flutuar. Agora basta incluir novos botões.
Quando a acrescentar botões ao código html não tem erro
O problema é que eu não sei como colocar o “enviar para email”, “imprimir” e “enviar para o msn” e colocar naquela disposição como na imagem que citei.
Mas isso é apenas formatação, basta criar divs e alinhar ou por css position ou por float.
O meu ficou bom, mas ele não segue a página como o do seu site. Queria saber se é assim, ou se eu coloquei algo errado… Vlw, e parabens pelo site, com imagens explicativas, evitando perguntas simples de quam num mexe muito bem, e também ajudando eles a aprenderem.
aew, foi mal, ta seguindo a página, é pq ainda num tinha carregado, e a net bugou. ótimo poste, só acho que você deveria fazer uma extensão desse post, falando como adicionar outras redes sociais nessa caixinha. caso faça isso, estarei aqui para ver, vlw.
Muito obrigado, funcionou certinho no meu blog http://ejc3m.blogspot.com
Cláudio,
quando coloco os códigos html o meu featured para de funcionar
http://ejc3m.blogspot.com
Adorei a dica e instalei no meu, mas, depois vi que dá conflito com os slides…então tirei. Se for resolvido este conflito, posta aqui!
Dependendo do outro script em jquery ele pode dar conflito, não significa que vai dar.
Estava observando que você não usa slideshow, então não teria porque parar de usar ele.
Olá!!
Adorei o codigo e em um dos meus Blogs deu certo, mas no http://toquenatural.blogspot.com não aparece esta linha >> post-footer-line-3
Tb coloquei o Social bar no meu blog http://toquenatural-importados.blogspot.com/, vc saberia se posso usar o mesmo codigo nos 2 Blogs?
Assim ficava tudo junto e as pessoas não precisariam se cadastrar separadamente.
Outra coisa, caso eu não consiga fazer essas mudanças no primeiro Blog vc faria esse serviço? se fizer poderia me mandar um orçamento?
Obrigada e um otimo dia!!
Estava olhando o código aqui do seu blog. Tenta colocar script então de baixo de
<div id="post-footer-box">
Desta forma acredito que irá funcionar corretamente. Qualquer problema por favor informe.
Muito obrigada por responder tão rápido.
Coloquei abaixo da linha que vc mandou mas não apareceu.
Não deu erro, esse meu template é estranho (e antigo) tudo fica invisível
Ele tem a opção no Layout de Mostrar botões de compartilhamento, mas quando ativo ele fica invisível ;o(
Sem problema.
No CSS do blog encontre a linha:
.entry {position:relative; padding:0px 10px 8px 10px; overflow:hidden;}
Mude para:
.entry {position:relative; padding:0px 10px 8px 10px;}
Isso vai resolver o problema.
Vivaaaaaa!!!!
Deu certinhoooo, muito, muito obrigada!
Vou seguir vc e recomendar para todos ;o))
Sobre o código igual, você diz de usar o mesmo Twitter para os dois? Seria isso?
Caso seja isso não tem problema ser a mesma conta do Twitter.
Já o Facebook e o Google Plus não precisa de conta sua e pegam automaticamente também o link do post.
Olá, Claudio
Gostei da dica, já coloquei no meu blog, muito obrigado.
Olá Claudio.
Funcionou perfeito. Só que tem um probleminha!
Na minha página inicial tenho um menu automático, onde coloco algumas postagens e ele fica exibindo automaticamente na vertical, quando coloquei a 1ª colagem ele para de funcionar.
Deste modo é impossível ficar com os dois.
Você sabe por que acontece isso?
Queria tanto colocar este menu flutuante. Valeu.
Abraços.
Parabéns pelo blog!
Tenta usar este jQuery no lugar do outro que coloquei no Post:
<script type='text/javascript'>
var fb = jQuery.noConflict();
fb(function() {
var offset = fb("#fblog-box").offset();
var topPadding = 60;
fb(window).scroll(function() {
if (fb(window).scrollTop() > offset.top) {
fb("#fblog-box").stop().animate({
marginTop: fb(window).scrollTop() - offset.top + topPadding
});
} else {
fb("#fblog-box").stop().animate({
marginTop: 0
});
};
});
});
</script>
O cara muito obrigado consegui colocar valeu mesmo! So gostaria de mudar a posição dele vc pode me ajudar olha como ficou e como gostaria q ficase…. http://img13.imageshack.us/img13/7196/boxflutuante.png
Desde já agradeço e parabens pelo site!
Eu já dei esta dica, leia ali em “Personalizando o widget:” que você vai encontrar o que você precisa.
Se não for valor negativo tenta positivo.
Valeu pela atençao…
Muito obrigado e mais uma vez parabens pelo post!!!
olá cláudio,
adorei essa caixa, muito legal mesmo, parabéns pelo site e pelo tutorial, só gostaria de saber uma coisa:
É possível fazer como que esta caixa apareça permanentemente no blog e não somente nos posts? fazer com que ela apareça em todas as páginas?
é porque no meu blog tem espaço lateral opara que ela fique sem “tampar” os ítens do blog…
obrigado e aguardo resposta
Ele funciona apenas nos posts porque não teria sentido compartilhar a homepage ou páginas de categorias.
Normalmente quando um usuário quer compartilhar algo é um assunto especifico.
Ai mano, sei que não faz sentido mais gostaria muito de colocar isso na minha pagina inicial… poxa vc pode me ajudar… ficarei muito grato e vejo que tem muita gente querendo isso!
Desde já obrigado!
Colocar ele na home e compartilhar o que? qual link?
meu blog meu twitter facebook!!!!
Desculpe man….
mais queria compartilhar somente minha pagina principal
tipo
no twitter
no g+
curtir no facebook
enviar mensagen
so da minha home
Obrigado!
Mas isso não é a mesma coisa que os ícones que você já tem lá no seu blog na sidebar?
Além que o visitante não compartilha uma página, para ele o relevante é apenas o post.
Colocando o box na homepage dentro do post vai ficar confuso para o visitante, ele vai pensar que se clicar ali vai compartilhar sua página e não o post especifico.
Porém se você esta DECIDIDO A CONFUNDIR SEU VISITANTE, segue o código que faz aparecer na homepage:
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<div id='floating-fblog'>
<div id='fblog-box'>
<div><a class='twitter-share-button' data-count='vertical' data-related='ferramentasblog:Aprende como criar um Blog - Blogger ou WordPress [ Ferramentas Blog ]' data-via='ferramentasblog' data-text='NOME DO SEU BLOG' data-url='LINK DO SEU BLOG' href='http://twitter.com/share'>Tweet</a></div>
<div><g:plusone size='tall'/></div>
<div><div id='fb-root'/><fb:like href='LINK DO SEU BLOG' font='arial' layout='box_count' send='true' show_faces='false' width='54'/></div>
</div>
</div>
</b:if>
Esta ai o código. Depois não diga que eu não avisei o/
VALEU MANO!
ficou 2 mano olha la!
Aqui só abriu o da home.
sim…mas um fica parado e o outro flutua quando desse a pagina!
Agora que eu vi.
Você fez algo errado.
É para manter o código anterior e incluir apenas isso que comentei.
Porque você sumiu com os que aparecem nos posts e agora tem dois na Homepage.
Você retirou a tag condicional que faz sumir um deles na home aparecer apenas nos posts.
Esse de agora aparece apenas na home.
eu queria saber pq que se colocar esta caixa, alguns efeitos do blog param de funcionar, por exemplo o slider que fica passando umas fotos com descrição, a descrição fica acima da foto e ela nao muda… e os submenus que aparecem ao passar o mouse sobre os menus, tambem nao aparecem mais, gostaria de saber o porquê?
Coloquei apenas esse codigo que postou no lugar da linha de código e colei ABAIXO dela subistituindo pela anterior! e deixei os 2 da linha de codigo da tag e o da tag
código e colei ABAIXO dela subistituindo pela anterior! e deixei os 2 da linha de codigo da tag e o da tag
Porque esta dando conflito com o jQuery de outras coisas do seu blog.
Pode ser por causa do lugar onde você colocou o código por exemplo.
Coloquei esse codigo que postou no lugar da linha de código e colei ABAIXO dela subistituindo pela anterior! e deixei os 2 da linha de codigo da tag e o da tag
e deixei os 2 da linha de codigo da tag e o da tag
O lugar onde você colou também fica errado por que o plugin entra no loop dos posts e será chamada quantas vezes for o numero de posts na homepage.
Primeiro você limpa tudo ai.
Instala o do post corretamente novamente.
Depois de feito isso. Copie o código que passei aqui e cole de baixo do:
<div id="main" class="main section">
Desta forma ele vai ficar fora do loop dos posts e não vai ficar se repetindo.
ok… mais devo colocar so esse codigo ou os outros 2 tbm?!
nao acho a tag
Só fazer o que te falei agora neste último comentário.
Tá claudio, deixa eu ver se entendi:
possuo um menu animado no meu blog e um slider. Quando coloco o código deste Gadget Box Flutuante com botões de redes sociais, ambos param de funcionar. Só voltam a funcionar se eu retirar os códigos desta caixa flutuante. Para resolver este problema e ter os dois no meu blog, eu devo colar o código do jQuery que você mencionou ali no comentário acima do , o invés de utilizar aquele código do post?
O que eu coloquei aqui por comentário é outra coisa.
Seu problema é diferente e é de conflito.
No caso é onde o código jQuery foi inserido em seu blog.
Tenta inserir o código do jQuery do Box Flutuante antes do slideshow e do menu do seu blog.
aAAAAAAAH, entendi, ok, mas o que é o jQuery mesmo?
e outra coisa, nos códigos do meu blog não tem a linha: portanto, onde devo colar o ultimo código do post?
jQuery = JavaScript
Esses códigos que estão em <script …
Se não tem a última linha, precisa ver que tag esta fechando lá no post e colocar antes dela.
Você não colocou o link do seu blog na hora de comentar então não sei em que blog você esta com esta dificuldade.
Nao consegui nao mano… mas mesmo assim muito obrigado pelo sua boa vontade!
valeu mesmo!
Como assim?
Super simples:
01 – Deleta tudo o código do Box Flutuante.
02 – Instala o código novamente que tem no post.
03 – Coloca o código que passei aqui para você comentando de baixo do
<div id="main" class="main section">
do seu blog.04 – Salve tudo e pronto!
nao acho essa tag id=”main” class=”main section”> no HTML do meu blog!!!
Eu encontrei ela pelo Firebug no seu blog. Você tem que ter algo semelhante a isso nele com certeza.
olá cláudio,
Bom é que assim, o blog ainda não está pronto, estou editando aos poucos pra começar a divulgar, postei qualquer coisa só para fazer uns testes, e enfim, o meu desejo era colocar essa caixa flutuante no blog mas que ela não “anulasse” os efeitos do menu e do slider, eu até já tenho uma caixinha pequena ali no canto, porém ela é bem simples e eu gostei mais desta que está aqui no seu sitee…vou mandar o link para você mas não coloquei nenhum código da caixa flutuante ainda, veja com o slider e os menus funcionam perfeitamente:
http://facilmodo.blogspot.com/
se eu colocar os códigos desta caixa flutuante, veja como fica:
http://img408.imageshack.us/img408/4875/problemanoblog.jpg
perceba que os submenus não aparecem e que o slider se deforma, a descrição fica em cima como um texto normal, e a foto parada sem mudar.
COMO RESOLVO ISTO?? SE PUDER ME AJUDAR AGRADEÇO MUIIITO, ALÉM DE QUE JÁ RECOMENDEI SEU SITE PARA ALGUNS AMIGOS BLOGUEIROS QUE TENHO (#puxasaco eu né…)
obs: em relação ao problema da linha , já resolvi! o problema é que no meu código tinha um espaço entre o 3 (três) e o ‘ (apóstrofo)
Era isso que eu ia te falar, encontrei no seu blog a linha “post-footer-line-3”.
Se não tivesse ela iria pedir para você colocar ela em outro lugar, por isso precisava do link do seu blog.
Já com o conflito não posso lhe ajudar desta forma, você vai precisar ficar mudando ele de lugar para ver se resolve seu problema.
Ainda mais pelo o que pude ver, existe uma quantidade muito grande de script no seu site, o que pode dificultar ainda mais.
Caro Cláudio,
Inicialmente obrigado pelo código, é de extrema valência e utilidade. Entretanto, eu o inseri o mesmo em meu meu blog, mas no navegador internet explorer ele não funciona perfeitamente… Existe algo para alterar, pois no Firefox roda perfeitamente.
Grato pela atenção!
Qual versão do Internet Explorer?
No IE8 ele funciona corretamente, porém o efeito ao subir e descer fica um pouco mais rígido.
No Internet Explorer 9…
O que acontece de diferente nele no IE9?
Os botões “curtir” e “enviar” do facebook não aparecem…
O Facebook as vezes tem esses problemas mesmo.
Tenta colocar junto colocar isso daqui antes de </head>:
<script src='http://connect.facebook.net/pt_BR/all.js#appId=102576646508501&xfbml=1' type='text/javascript'></script><script type="text/javascript">
Acrescentei, mas não salvou, deu esse erro;” 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 reference to entity “xfbml” must end with the ‘;’ delimiter.”
Desculpa xD
Foi erro meu. Acabei colocando coisa a mais no código.
O correto é:
<script src='http://connect.facebook.net/pt_BR/all.js#appId=102576646508501&xfbml=1' type='text/javascript'></script>
Novamente deu o erro:
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 reference to entity “xfbml” must end with the ‘;’ delimiter.
Você tem certeza que esta colocando antes de </head>?
Fui tentar verificar aqui para ver se dava o mesmo erro, porém o blogger esta com problemas ¬¬.
Porém o erro que você esta falando é sobre fechamento, com o novo código que lhe passei não deve ter este tipo de problema.
Estou colocando antes de , juntamente com os demais códigos, conforme orientação descrita acima… E continua este erro…
Será algo do blogger ou do IE9…
O problema de não abrir o botão não é nem do Blogger e nem do IE9 e sim do Facebook.
Caro Claudio,
Fico muito grato com sua atenção! Valeu mesmo…
olá Cláudio,
resolvi mudar de tema para colocar esta caixa, pois achei muito interessante. Porém, estou com o mesmo problema que o Robbuster.
eu realmente gostaria de botar essa caixa não só nos posts, mas também na pagina inicial do blog. Fiz tudo que você mencionou no comentário, colocar o codigo do post normal e depois da tag “” inserir o código que você passou no comentário. Só que não tem essa tag no meu blog, onde eu coloco então? a coisa mais semelhante que eu achei foi: ““. seria abaixo disto que eu deveria colocar?
esqueci de botar o link do blog: http://facildt.blogspot.com
Tenta colocar de baixo de:
<div id="main-wrapper">
ok, agora estou com outro problema, eu mudei o tema do blog novamente, mas desta vez é definitivo. agora a tag que não acho é a “”, para colocar o terceiro código do post. Sou muito leigo no conceito de html, porém tenho noções básicas. Colocar o codigo nesta tag faria com que a caixa aparecesse nos posts certo? e na tag do “main-wrapper” faria ela aparecer na home page. como não acho esta tag do post-footer-line, poderia colocar o código em outro local do código dos posts, como por exemplo um que achei semelhante: “<Variable name="postfooterfont" description="Post Footer Font"
type="font"…"??? ou existe outro local que eu possa colocar o terceiro código do ppost?
Não não esse variable… é outra coisa.
Coloca ai o que vai aparecer na home em main-wrapper mesmo e o que vai aparecer nos posts de baixo do código que vai na home.
Deu para entender? xD
Coloca um de baixo do outro em main-wrapper.
aaah sim, deu certo! já configurei até a posição dele na página. Na home page tudo ok, mas olhe o que aconteceu na pagina do post: http://facildt.blogspot.com/2011/10/teste-de-postagem-para-multimidia.html
Apareceu escrito: “TEMPLATE ERROR: Invalid data reference post.title: No dictionary named: ‘post’ in: [‘blog’]”
acho que ele não reconheceu alguma coisa, poderia me ajudar claudio? desculpe o encômodo, mas é que realmente aqui é o único site que estou sendo muito bem atendido =D
Acabei esquecendo, na verdade o que abre dentro do post precisa estar no loop, o da home deve estar fora.
Bom o que aparece dentro do post coloque dentro da tag:
<div class="post-footer">
Agora tem que funcionar.
FUNCIONOU PERFEITAMENTE!!! LOL
Muito obrigado Claudio, valeu mesmo, com certeza voltarei aqui neste site quando precisar de alguma outra coisa!
obrigado novamente!
Acabei de ver lá, esta funcionando certinho mesmo.
Desculpa claudio, vim te encomodar de novo,
percebi uma coisa intrínseca, mas que não deixa de ser um erro. Veja como aparece a caixa na home page e veja como aparece no post. Eu configurei o “margin” para 290, fica como eu quero na home, mas no post ela fica exatamente 10 px à menos para a direita, ou seja ele fica com 280 e fica por cima do tema do blog.O que pode estar causando isso?
Aconteceu isso por causa do local de um e de outro. Cria uma class nova em um os dois e corrija a diferença da distancia.
meu deus deu erro de novo, desconsidere as aspas agora..
código para aparecer na home:
“”
“”
“”
“Tweet
“”
“”
“”
“”
”
“”
código para aparecer no post:
“ ”
” ”
” ”
“Tweet ”
” ”
” ”
“ ”
” ”
” ”
““
aff desisto, não consigo postar o código, desculpe, exclua esses comentarios se puder..
Cria uma class em um dos dois e coloca margin diferente.
tah mas eu boto como o código? class=margin:…?
na div do box, coloca lá class=”nome-da-sua-class”.
Depois no css coloca lá
.nome-da-sua-class {
margin: VALOR AQUI!;
}
e onde fica a css?
Pode colocar junto com o css do Box que você já adicionou antes do </head>
não consegui fazer… eu não entendi exatamente em que linha eu devo colocar, antes ou depois, e o que? eu fiz isso:
inclui a class na div do box assim <div class='margem' id='floating-fblog'
na css que não entendi muito bem o que é, coloquei assim
#fblog-box {border:1px solid #ccc; padding:5px; background:#fff; z-index:9999; display:block; position:absolute; top:200px; float:left; margin:0 0 0 -290px; text-align:center;} margem {margin:0 0 0 -290px;}
não sei o que fiz de errado…
Faltou ai um ponto.
Por exemplo:
.margem {margin:0 0 0 -290px;}
Precisa dele antes do “margin”.
Para funcionar perfeitamente aconselho você fazer o seguinte:
.margem {margin:0 0 0 -290px !important;}
Além de mudar o valor de -290px, porque é o mesmo valor do outro, nesse ai tente -280px por exemplo.
mas eu posso continuar colocando no mesmo lugar? pq o box dos posts simplesmente sumiu quando coloquei este código..apaguei e voltou ao normal
Vamos do jeito mais fácil.
Você quer arrumar o da home certo?
Encontre ele lá que esta assim:
<div id="fblog-box">
Deixe ele desta forma:
<div id="fblog-box" style="margin:0 0 0 -290px">
Assim não tem como errar xD
não, eu quero arrumar o do post, e mesmo assim não funcionou.. eu quero deixar o do post na mesma posição do da home, veja a diferença entre os dois… eu percebi que é cerca de 10px
cládio, consegui, arrumei de uma maneira um tanto estranha, coloquei este código na linha do floating-fblog e ajustei a margin para -10 px que tinha de diferença do da home! Agora ficou perfeito! obrigado!
Legal que esta funcionando corretamente.
Cláudio, ótimo post. Gostei do gadget só queria saber como deixar a caixa fixa.
Obrigado,
Tem que retirar o Javascript que faz ela descer com a tela.
ótimo post, muito obrigado mesmo me ajudou bastante.
Mas tem como colocar alguma outra rede social ou é limitada a apenas estas?
Sim é possível, basta criar uma nova div dentro dele e adicionar o botão que você quiser.
obrigado pela resposta
Olá.
Primeiramente gostaria de parabeniza-lo pelo excelente Post!
Eu coloquei em meu Blog, mas estou vendo um probleminha, que ja passei algumas horas tentando arrumar, mas ñ consegui.
Sabe o botão do Google+1 ?
Então, ele fik com o balãozinho contador comido pelo box. veja por favor em meu Blog >>> http://virtualsword.blogspot.com/
Como posso fazer para ele ficar no formato grande (size=”tall”)? Parece não estar reconhecendo este valor..não estou entendendo bem o por que.
Poderia me ajudar?
Desde já agradeço!!!!!
Engraçado.
Pra mim aparece normal:
https://lh5.googleusercontent.com/-GlDBg2AJ5vM/TrwScheabcI/AAAAAAAAAVo/nB5Px26qjmc/screenshot.jpg
Hum, agora que entrei vejo que esta normal msm..
Bem, valew por ter me atendido!Desculpe da Gafe ^^°
Oi Claudio, sou eu novamente cara.
È o seguinte, tenho 1 SlideBar no Blog, e, como com outras pessoas aqui do post, o box esta em conflito com o SlideBar.
Trabalho numa agência web, e sou programador, mas ñ manjo mta coisa d JavaScript..apenas o essencial, digamos.
Bem, tentei mudar o javascript jogando ele la pro alto, antes das funções de MouseOver, SlideBar, etc..mas o conflito persiste.
Nosso amigo ali em cima resolveu trocar seu template, o que não pretendo fazer para resolver o problema. Poderia m dar uma força?Valew!
Tive uma ideia aqui. Eu não testei ela então me desculpe se não der certo.
Então vamos lá:
Estamos carregando html do Box apenas nos posts e não na homepage, porque não teria sentido isso.
Entretanto os scripts carregam em qualquer lugar do blog o que esta gerando este conflito ai com seu slideshow.
Para solucionar isso devemos então carregar os scripts do Box apenas nos posts também, assim evitamos todos estes problemas.
Tente fazer o seguinte:
Cole isso daqui antes do jQuery do plugin:
<b:if cond='data:blog.pageType == "item"'>
Depois no final dele feche com isso:
</b:if>
Eu não testei isso, não lembro agora se o Blogger vai aceitar esta tag lá em cima.
Testa ai, se der certo vou mudar o código do Box aqui no post por este.
Excelente!Como não pensei nisso!?
Só instanciar os plugins quando o tipo da página for igual a página-Post.
Se for a página Home, pula todo o JavaScript que conflita com o resto.
Testado, e aprovado, pode Editar lá que deu certo!
Valew Claudio, muito bom velho!!!
Abraço!
Opa, valeu por testar.
Eu devia ter pensado nisso antes também.
O meu plugin do WordPress funciona desta forma, só carrega os scripts nos posts. Porém como é no WP eu consigo resolver o problema de conflito de outras formas também xD.
De nada, eu que agradeço por ter testado o código.
Tentei colocar na meu blog de teste mas não encontrei a ultima linha. O que eu faço?
Se não tiver post-footer-line-3, procure por post-footer-line-2 ou por post-footer-line-1.
Ou qualquer coisa que seja no rodapé do post.
o problema é que não encontro nada apartir da palavra ‘post’
Precisa ver no código do seu blog, até mesmo pela frente nele usando o Firebug no Firefox ou Inspetor de Elementos do Chrome.
olá cláudio, sou eu denovo, olha só, depois de muito tempo parado, em meio ao enem e outras coisas, voltei a cuidar do blog, e fiz muitas alterações: criei um banner, aprendi a meio que “fazer um tema usando um tema já pronto, enfim, ficou tudo nos “trinks”. No entanto estou com uma dúvida sobre este box flutuante que eu adicionei é claro, pois é muito bom…enfim, adicionei tudo certinho, coloquei a margem desejada, perceba que ele está na lateral DIREITA do blog. Porém ele não se meche, isto é, quando descemos a barra de rolagem a box nao “flutua” para baixo, ele fica sempre parada na tela, não tem animação…poderia me ajudar? queria muito a resposta…obrigado..
Tem alguma incompatibilidade com o jQuery dele.
Já faz uns meses que comecei a editar um blog para disponibilizar online conteudos de minha cidade e aqui no ferramentasblog praticamente me ajudou em muitas inserções de codigo !!! ..
Vou testando e criando >>Valeu pela ajuda !!!
Os botões aparecem normalmente, tudo ok com o CSS, mas quando inseridos os códigos, a margem do blog é alterada, fazendo a aparecer a barra de rolagem horizontal.
Alguma sugestão para resolver esse problema?
Cara muito obrigado, estava a procura desse codigo a muito tempo. Parabéns pelo post um grande abraço.
No meu também estava com conflito, valeu por postar a solução!^^
Olá amigão, ficou perfeito, obrigado pela dica. Com certeza as redes sociais são uma das melhores maneiras de divulgar nossos blogs. Continue com Deus.
Olá… deu certinho no meu blog esse box… gostaria de saber como faço para colocar esse mesmo box em alguma paginas estaticas… nao em todas… valeu por enquanto… manda um banner de vcs que eu coloco no meu blog….
t+
Precisa mudar a condicional que mostra ele apenas nos posts. Você pode estudar mais sobre isso aqui:
https://ferramentasblog.com/2010/08/codigos-e-tags-condicionais-do-blogger.html
Botões instalados com sucesso. Porém, acontece que, em outros navegadores como o Firefox, a margem é alterada fazendo aparecer a barra de rolagem horizontal.
Isso só acontece na página inicial, nas demais tudo ok. No Chrome tudo perfeito.
Alguma dica?
Se você ler o código vai ver que ele todo é carregado apenas na página de posts.
Não é carregado na homepage, então este problema que você esta tendo é por causa de outra coisa.
Claro Claudio. Reconheço a função da condicional que mostra apenas dentro dos posts.
Mas isso só acontece quando insiro o script e o CSS do box flutuante.
Estranho.
Você deve estar inserindo em algum lugar que esta quebrando algum CSS do seu blog.
Segui o passo a passo descrito aqui. Testei até colocando o CSS do box flutuante na folha principal do CSS do blog, mas ainda acontece o problema. Repetindo, só acontece no Firefox.
Olá Claudio,
O botão do Twitter está com problemas por causa do novo visual… E agora???
Acabei de corrigir o código para isso não acontecer.
No final do código do botão do twitter precisa ter
data-lang='en'
Ola, amigo. fiz tudo exatamente como disse, mas qdo apertei o botão e visualizar,não mudou nada, ficou o mesmo que antes. eu salvei mesmo assim, pode ir lá ver como realmente não aconteceu… O que será q aconteceu?
só uma coisa, na ultima etapa a linha , no meu ela ocorre assim : , eu testei colocar o ultimo código logo abaixo, e logo depois de , antes de . e ambos não deram certo….
Esta funcionando sim, ele não aparece na página inicial, apenas em página de posts. Clique em algum post seu para ver.
Ô cara, valeu! eu realmente não tinha visto por não ter clicado no link para a pag dum post!
caso não tenha a linha “post-footer-line-3″ no meu blog, onde devo colocar?
Não tem post-footer-line-2 ou post-footer-line-1 ?
Não Achei nem um dos trÊs
Oi Claudio!
Fiz tudo como está aqui, mas o botão do Twitter só aparecia a palavra ‘tweet’, então fui fazer um teste e troquei o código daqui pelo fornecido no Twitter (http://twitter.com/about/resources/buttons#tweet), deu certo, agora está normal.
Será que pode ser alguma incompatibilidade do meu template, já que outras pessoas aqui usaram o código como você forneceu e deu certo?
Desde já, agradeço!
Carlos Tomaz – Lar da Veterinária
Não não Carlos, acontece que o botão do twitter foi atualizado fazem uns 3 dias.
Por isso talvez do problema.
Entretanto do jeito que esta ai no post é como estamos usando aqui no Ferramentas Blog.
Olá, Claudio. Tenho 3 blogs que criei por motivos bem pessoais e não tenho twitter. Ainda não me decidi a criar uma conta. Mas coloquei este gadget flutuante nos 3 blogs, inclusive adicionei uma linha como Feed. Minhas perguntas: este botão de tweet, quando meu visitante clica nele divulga meus posts em sua conta (do visitante)? Por não ter nenhuma conta no twitter deixei o nome da conta de vocês, ou seja, não modifiquei esta parte. O que acontece então? Meus posts serão divulgados na conta do twitter de vcs? Posso deixar como está ou devo suprimir esta linha, caso decida continuar sem conta no twitter?
Se eu resolver criar uma conta no twitter, posso divulgar meus 3 blogs em uma conta só? Como fazer isso?
Sei que são muitas perguntas, mas estou aprendendo a navegar sózinha, na base da pesquisa e da tentativa/erro/acerto.
Grata ela atenção e por todas as dicas que vocês passam. Já usei muitas. Abraços.
Meu blo xodó é o de receitas: http://receitasdetodosnos.blogspot.com/.
Já dei uma lida em alguns posts que vcs publicaram a respeito do twitter, mas confesso que ainda não me decidi a criar uma conta.
Por favor, me respondam a pelo menos duas das perguntas acima, estas que refaço aqui embaixo:
Coloquei este gadget em meus blogs e a certa altura, vcs recomendam:
“Nele basta substituir o “ferramentasblog” pelo seu nome de usuário no Twitter.”
Pergunta, já que não tenho conta no twitter, retiro esta parte do gadget que apliquei em meus blogs?
Se eu mantiver o endereço de vocês, minhas noticias serão divulgadas na conta do “ferramentasblog”?
Agradeço a atenção. Gisele.
Então, quando alguém clica nesse botão envia uma mensagem no Twitter dela com o título, link e nome de usuário do twitter que você configurar.
Eu particularmente gosto muito de twitter, é uma forma bem legal de compartilhar coisas e entrar em contato com outras pessoas.
Porém já que você não tem conta no twitter, pode apenas deletar isso daqui dele que já aparece sem e todo mundo vai poder continuar compartilhando seus posts sem problema:
data-via='ferramentasblog'
Apenas delete isso e esta tudo certo.
Obrigada, Claudio. É que ainda estou tateando neste universo que é a internet. Abri meus blogs para ajudar minha filha a sair de uma depressão causada por uma perda pessoal nossa.
Deu certo, ela abriu 2 blogs e está voltando a sorrir.
E eu me apaixonei por blogar, mas sou semianalfabeta em internet.
E aprendi muito com vocês.
Valeuzão.
Abraços e muito obrigada.
Eu que agradeço.
ola, eu to com um probleminha chato, nao encontrei a linha . Será que esse código só funciona para alguns modelos no blogger?
Funciona em qualquer um.
Você colocou para expandir os modelos?
Acabei de olhar no seu blog e você tem post-footer-line-1, post-footer-line-2 e post-footer-line-3 também.
Então tem que dar certo.
tbm não escontrei nem um dos três post-footer-line-
Estou olhando aqui e você tem todos eles no seu tema.
Seguiu corretamente o tutorial?
Principalmente a parte: ‘Vá até o menu “Modelo” e procure por “Editar modelo”, então clique para “Expandir modelos de widgets”’ ?
Como inserir o botão do Orkut?
Só pegar o código aqui:
http://www.google.com/webelements/#!/orkut-share
Deveria ter um exemplo de como ficou =/
Rogério,
O exemplo está na imagem do post e está funcionando nas páginas do próprio [ Ferramentas Blog ]. Esses ícones flutuantes estão aí rodando na tela como exemplo.
Consegui!!! Muito bom… ficou show!
Olá chará, tudo bem?
Parabéns pelo belo post, com certeza muito útil. Eu usei seus códigos em meu blog, quando usado o Firefox ou o Chrome aparece normalmente, agora se eu usar o IE8 ou IE9 os botões do Facebook não aparecem, você sabe qual é o problema?
Obrigado,
Claudio
Estou tendo o mesmo problema, porém com o Google Chrome e IE8 ou IE9, sendo que no Firefox está tudo normal.
Esse erro começou a aparecer hoje e já instalei os códigos novamente, porém o erro continua.
@Filipi
Eu também instalei os códigos certinho, inclusive até pensei que não tivesse funcionado de primeira porque ele ficou “escondido” atrás do blog, além disso ele só aparece nas postagens né e eu tinha esquecido esse detalhe.
Os que abrem normal pra mim são o Chrome 16 e o Firefox no Windows 7, já no IECA 8 e 9 os botões somem. O que eu achei estranho é que você está com problema inverso que o meu, mas vamos ver se a galera tem alguma idéia pra ajudar.
Abs…
Apenas o do Facebook que esta dando problema?
Vou ver de atualizar o código do botão dele.
O meu é só o Facebook Claudio. Eu usei duas versões diferentes do seu código, essa que tem no Ferramentas e um outro que encontrei com o botão do AddThis, ambos com o msm problema.
O engraçado é que no Google Chrome e IE8 ou IE9 os botões do Facebook que vem junto com meu template tbm pararam de funcionar, troquei o template, mas o erro continua, pode ser algum conflito.
Percebi algo engraçado agora Claudio. Esse erro não está acontecendo sempre e muito menos em todas as postagens. Dei uns prints para vc ver:
http://i44.tinypic.com/90yhbo.jpg
http://i41.tinypic.com/qoekxc.jpg
Chará,
O problema é só com o Facebook, O Twitter e Google+ funcionam perfeitamente.
Valeu por responder.
Abração!!!
Incrível que no meu blog ta funcionando perfeitamente em todos os navegadores.
Será que não é algum conflito com scripts que já estejam nos blogs das outras pessoas?
Tentem usar o código que esta agora no post.
Atualizei todos os botões.
Puts, pode ser incompatibilidade então dos scripts do facebook com os que estão no seu tema.
O legal seria atualizar todos e deixar só um código no rodapé abrindo o link do script dele.
O que eu acho mais estranho é que o gadget de vocês funciona perfeito em todos os navegadores, aparece todos os botões certinho.
Aqui no [FerramentasBlog] vocês postam scripts em um servidor separado, ou existe alguma modificação que vocês fizeram além do que está aqui no artigo?
Abração.
Obrigado
No meu blog também funciona normalmente, tive alguns problemas na hora de digitar o código, mas resolvi refazendo tudo de novo, agora funciona perfeitamente, tanto no IE quanto no CR e FF.
Pingback: Os 10 melhores posts do [ Ferramentas Blog ] em 2011 | [ Ferramentas Blog ]
Realmente os botões do Facebook não querem aparecer no Internet Explorer. Aparecem só o do Twitter e do Google+.
Já no Chrome e no Firefox, está tudo perfeito!
O que fazer agora??
Olá muito boa a postagem, mas está dando o seguinte erro quando eu coloco abaixo da post-footer-line-3. Nos outros códigos fica normal, mas nesse aparece isso:
Erro ao analisar XML, linha 1711, coluna 284: Element type “a” must be followed by either attribute specifications, “>” or “/>”.
Time o mesmo problema, mas na linha 1080, a solução foi descartar as alterações e começar tudo de novo. Agora funciona normalmente.
@Luite
Poderia compartilhar com a gente as linhas que você descartou as alterações, seja lá quais foram?
Imagino que a linha 1080 seja do seu template, mas isso vai mudar muito de um blog para o outro.
Abraços, e obrigado,
Claudio
Me referi a descartar todas as configurações que tinha feito na hora de colocar os códigos do gadget.
Foi assim, executei o tutorial acima, colocando todos os códigos no seu devido lugar, mas na hora de salvar, ou de visualizar, aparecia um erro mencionando a linha 1080 e alguma coisa com a tag . então como não tive escolha, simplesmente NÃO SALVEI as alterações, descartado-as, e recomecei tudo de novo, só que dessa vez com mais calma e atenção, colocando a tag pra identificar onde cada parte do código entrava, assim ficaria mais fácil de encontrar caso algo desse errado. Quando tentei encontrar o trecho só encontrei com o número “1”, e tinham dois trechos iguais, então coloquei no primeiro, que estava acima.
Mas graças a Deus funcionou, em parte, pois agora vejo que não funciona corretamente no IE9. Só temos que aguardar atualizações agora.
Abraços!
@Liute (agora sim, escrevi certo…:)
Infelizmente você está enganado amigo, pois a box não está funcionando direito no seu blog.
Eu acessei o seu blog usando o IE8 e IE9 e os botões do Facebook também não aparecem. Vamos aguardar alternativas para ver se resolve o problema.
Abs,
Claudio
Verdade Cláudio, não está funcionando mesmo no IE9, uma pena, então meus posts não poderam ser compartilhados por quem usar este navegador, mas eu também uso os botões do ADDThis, o que quebra um galho até o gadget ser atualizado.
O erro está quando o código é copiado através do botão Copy to Clipboard. O código está vindo com um ” ” antes de “data-lang=’en'” Retirando esse ” ” o código deve funcionar.
Corrigindo: Está vindo com um “& n b s p;” (com as letras sem espaço).
Estanho, eu coloquei assim exatamente porque no blogger ele faz isso sozinho com os caracteres.
Do jeito que eu colei ai foi o jeito que eu testei e funcionou.
Infelizmente estarei retirando o gadget do meu blog. Sei que ele é o melhor, mas não posso ficar sem o botão curtir do Facebook.
Se um dia ele voltar a funcionar normalmente eu coloco mais uma vez.
Olá pessoal, eu já instalei este recurso em dois blogs e ficou muito bom. Porém estou tentando instalar em outro e não estou conseguindo. Neste blog em questão já tenho instalado a ferramenta para comentar tanto com o facebook quando com o do blogger mesmo, que vi aqui. Será que isso está gerando algum conflito? Não sei mais o que fazer. Vou colocar o endereço do dito aqui no espaço site/blog se puderem olhar agradeço.
Olá Cláudio!
Deu tudo certo até chegar a hora de procurar pela linha de código , eu tentei umas tres vezes mas infelizmente não deu! O que será que aconteceu? você pode me ajudar? Muito obrigado!
Nikolas,
Certifique-se de que, na hora de abrir o “Editar HTML” do Blogger, ter marcado o “Expandir modelos de widgets”, pois é a única forma de ver o código que precisa. Isso está bem explicado no tutorial, inclusive com imagem.
Caro,
primeiro obrigado pela ajuda, seu blog é fantástico!
Coloquei a esse gadget flutuante e parece estar funcionando perfeitamente.
Só tenho uma dúvida?
Consigo colocar ele pra flutuar do lado direito ao invés do esquerdo?
Como?
obs: tentei trocar o “float: left” para “float: right” e não funcionou.
Para colocar ele no outro lado não é o float e sim precisa alterar o position dele lá:
right: 0;
Isso deve resolver.
Obrigada abliquei o tutorial e ja esta funcionando no meu blog direitinho
No código dos botões não falta um div ? só tem 11 =( no meu da erro
Olá. No hora de eu inserir o ultimo código antes de salvar o modelo(que tenho que procurar uma linha) eu não consigo encontra-lo na busca. Já me certifiquei que a opção “Expandir modelos de widgets” esteja expandida, mas não deu em nada.
O que eu faço? Obrigado.
Procura outro lugar então onde esteja o rodapé dos artigos do seu blog.
Não precisa ser exatamente onde apontei no tutorial.
Mais uma vez obrigado pela ajuda, sua ajuda é de muita importância. Gostaria de saber se tem como por na home do blog também? Desde já agradeço!!!!
Não lembro para quem ensinei, porém se você procurar aqui nos comentários você vai ver tem publiquei uma solução.
Claúdio, pedi tua ajuda para alterar a posição da ‘caixa’ flutuante…
Como coloco do lado direito do Blog?
Precisa colocar no CSS right:0; por exemplo
Porém o botão do facebook não ajuda muito para fazer isso.
Ele abre tudo para o lado direito e vai quebrar o layout do blog.
Eu coloquei todos os codigos certos so que no ultimo, post-line eu já tentei colocar abaixo do post-line1, 2 e 3 e todos aparecem esse erro.
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
Guilherme,
Você ou colou o código no lugar errado ou fez alguma modificação indevida. Siga à risca os procedimentos descritos para que funcione e não dê erro.
Olá Cláudio ou Marcos,
Consegui inserir o código e aparentemente o botão está funcionando, porém fica escondido no background do tema, ao lado dos posts. Tentei diminuir a distância da margem, mas pra ficar completamente visível, ficaria acima do texto e com um valor positivo de pixels ele não faz a rolagem junto com a tela, fica estático.
Tem alguma maneira de mudar o posicionamento dele para conseguir “escapar” do fundo que o encobre?
Obrigada pelas valiosas dicas no blog de vocês.
O problema esta no CSS da #content, nele você encontra overflow: hidden.
Isso faz com que tudo que esta dentro dessa div e fique para fora seja escondido.
Por isso você teve o este problema.
Recomendo você deletar esse overflow: hidden e testar para ver se da certo e não tem problema com o layout também.
Claudio,
Segui exatamente à risca o tutorial, mas o problema dos botões do Facebook não aparecerem no IE8 e IE9 continuam, alguma dica?
Não sei se possa ser algo no meu template, pois aqui no FB a box funciona perfeitamente em todos os navegadores.
Se quiser conferir, agora o blog oficial está funcionando, e as mesmas mudanças que fiz no blog de teste eu fiz no definitivo também:
[link suprimido]
Obrigado pela ajuda.
Um abraço,
Claudio
Oi Claudio e Marcos. Adoro vocês, mas eu sou burra e medrosa! De qualquer forma, estou guardando para pedir ajuda na instalação a um dos meus “personal gênios” 🙂
Bjs, pat
Oi Claudio e Marcos. Segui todos os passos corretamente mais quando clico no botão
visualizar aparece a seguinte mensagem de erro:
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: Element type “a” must be followed by either attribute specifications, “>” or “/>”.
Error 500
O erro só ocorre quando eu adiciono a ultimo trecho de código a
ser colado abaixo de
O que deve está errado? Aguardo resposta. Desde já muito obrigado.
Você com certeza deve estar colando no lugar errado ou colocando algo a mais.
O código que colocamos ai foi testado e diversas pessoas usando sem problema algum.
Oi Claudio consegui depois que eu passei a clicar no primeiro item da caixinha
que abre o código em uma nova janela, e deu tudo certo. Obrigado.
Também não consegui achar o , nem o 1, nem o 2. Coloquei em “expansir modelo de wigdet”, tentei tudo, reiz, mas não deu jeito. Tentei pela interface velha, mas não aparece de jeito nenhum… Alguma ideia?
Descobri o problema do ! Quando você copia, as aspas simples viram acentos, aí é só corrigir que dá certo!
Basta passar o mouse sobre o código aqui, vai aparecer uma barrinha de ferramentas, só clicar no primeiro item (da esquerda para a direita) para abrir o código certinho em outra janela para ser copiado, ou clicar no segundo item (da esquerda para a direita) que já cópia o código sem erros.
Tô falando do post-footer 3
Adorei! Segui direitinho e deu tudo certo. Obrigada. Ainda estou viajando por aqui…
Mais uma vez obriado pelas dicas…estas tudo funcionando e nos meus posts vou com certeza indicar o ferramentasblog. Sucesso total obrigado Marcos e colaboradores. Ate mais.
Acabei de colocar o código, deu tudo certinho e funcionando. Explicações assim não tem como errar. Parabéns mais uma vez pelo ótimo trabalho. Endereço foi errado desculpe =D
Ficamos felizes que tudo deu certo o/
Olá ! Fiz tudo direitinho só que o gadget não está flutuando e sim embaixo do post. Queria saber como consertar o problema. Desde já agradeço 😉
Isabela, você comentou e não usou o seu blog no campo site/blog.
Desta forma não tem o link do seu blog e não posso ir até ele ver o problema e lhe falar qual é a solução.
Eu descobri o problema e já consegui resolver 😉 brigada.
Boa tarde,
Fiz todo o processo, mais de uma vez e quando chego na terceira e última parte do código, recebo a seguinte msg de erro:
“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: Element type “a” must be followed by either attribute specifications, “>” or “/>”.
Error 500″
Obrigado,
O mesmo está acontecendo comigo. Gostaria de saber como resolver este problema.
Esta copiando de forma errada o código aqui ou colocando eles em lugar incorreto.
Por favor, sigam os passos do tutorial e na hora de copiar os códigos usem os botões de copiar que aparece ai em cima do código.
Cara, eu estou usando o botão de copiar q você disse,
e tenho certeza de q estou colando no lugar certo, no entanto aparece o mesmo problema do Guia Runge:
Erro ao analisar XML, linha 1291, coluna 279: Element type “a” must be followed by either attribute specifications, “>” or “/>”.
Obrigado.
Acabei de mudar algumas coisas no código.
Tenta colocar o código de agora no blog de vocês.
Agora sim xD
Obrigado pela atenção, Abs!
Olá. gostaria de uma ajuda. Coloquei o botão enviar e curtir do facebook junto aos posts do meu blogger, mas ele não envia um resumo do post. Envia apenas o título e o link. Alguém sabe me informar o que estou fazendo de errado. Obrigado.
O Facebook sozinho que verifica o seu conteúdo.
Aqui tem algumas dicas de como pegar o conteúdo certo:
http://developers.facebook.com/docs/reference/plugins/like/
Ei Cláudio! Como está?
Vi que você atualizou o código, e ficou consideravelmente menor que o anterior. Você sabe me informar se ainda está com aquele probleminha nos navegadores? O de não aparecer alguns botões? ou já está tudo resolvido?
Abraços meu caro… e sucesso!
Na verdade acabou ficando um pouco maior 😛
Eu alterei e testei em 3 bloggers, todos eles abriram corretamente no Internet Explorer 8, Google Chrome, Firefox 8, Opera e Safari no Windows.
Testei também no Safari, Google Chrome e Opera no Mac.
Ainda estou para testar no Ubuntu/Linux, porém acredito que não deverá ter problema com ele.
Kkkkk… acho que devo ter me impressionado na hora de apagar o antigo do código do meu blog.
Também estou usando o Chrome, e realmente está tudo funcionando perfeitamente.
Agora só me resta uma pergunta. Existe aqui no FB um tutorial ensinando como colocar estas setas que estão aparecendo ai na lateral? Que me levam à postagem anterior e posterior a esta? Achei lindo isto, e gostaria de colocar no meu blog, isto evita que o usuário precise rolar até o final da postagem para mudar.
Muito obrigado pela atenção!!! Abraços.
Que bom que funcionou ai.
Abri o seu blog no Chrome e no IE8 e apareceu todos os botões de compartilhar.
Sobre essas setas é um plugin que fiz para WordPress. Porém o Paulo Estevão fez uma versão dela para o Blogger.
Aqui tem a minha versão para o WordPress e um link para o post do Paulo: https://ferramentasblog.com/2011/12/navegacao-entre-posts-floating-nextprev.html
Legal!!! Foi uma mão na roda essa modificação no código.
Visitei os links que me passou, e tive um problema ao tentar fazer o tuto do Paulo Estevão, o blogger gera um erro dizendo que não foi possível completar minha solicitação.
Mas vou tentar de novo quando chegar em ksa.
Obrigado pelas dicas de sempre. Abraços e sucesso!!!
adaptei seu código de css, no meu site que não é blogger mas sim feito em html, e funciono perfeito, valeu pela dicas e parabéns pelo site.
Não tem segredo, na verdade colocar em um site só com HTML é mais fácil do que no Blogger xD
fiz o procedimento em um blog q tenho e foi super fácil tbm e funcionou também.
Um óptimo post. Bastante exclarecedor e útil. Parabéns, já estou a utilizar!!
Um grande abraço!
Olá, Cláudio… achei ótima a dica dessa barra, realmente, quanto mais interativo for um blog, mais seguidores ele terá.
Um pergunta: há como incluir um botão do diHITT nessa barra?
Grato!!!
É possível incluir qualquer botão ai sem problema algum.
Basta inserir uma div de baixo da div do Facebook e coloca o código do botão que você quer usar.
Ficou quase tudo ok no meu. só que o Gadget não ficou até em cima e sim na metade da postagem ok eu faço?
Não da para saber exatamente pois você retirou ele do seu blog.
Porém você vai encontrar ajuda de como personalizar ele aqui na sessão: “Personalizando o widget” do post.
Olá claudio, como faço pra deixar os botões na horizontal abaixo do post? Pergunto isso pq no meu blog eles NÃO ficaram no topo e sim abaixo do post, na posição atual.
Faça novamente o tutorial, estes botões tem que aparecer flutuando do lado do post.
E por favor comente usando seu blog em Site/Blog assim vou saber melhor como lhe ajudar.
Ops!Desculpe,Depois que eu dei mexida…agora ele sumiu completamente!
Se ainda puder me ajudar, fico grato.
Ele esta funcionando corretamente no seu blog. Porém não existe largura máxima no seu template e por isso ele fica fora da “tela”.
Claudio, só mais uma ajudinha…
Então como posso alterar isso faze-lo aparecer na “tela”?
Acho que na primeira vez fiz algo errado e ele apareceu, só que logo abaixo do post, então se pudéssemos fazer ele ficar horizontal…ficaria até bom! Ou aparecer na lateral mesmo.É possível?
A ideia é fazer isso aparecer flutuando, na horizontal você não precisa nem da metade que tem aqui e pode fazer isso manualmente.
Por exemplo pode colocar no css isso daqui para dar uma largura e centralizar o corpo do site
#outer-wrapper {
width: 960px;
margin: 0 auto;
}
Claudio encontrei uma solução, eu fiz ele ficar por sobre o texto mesmo e depois configurei pra ficar estático em um espaço livre dentro dos post´s
Obrigado e desculpa pelo abuso.
Claudio nao encontro o Trecho
No meu so tem ate a 2
Colei pois a 2 e nao apareceu nada no blooger
Você retirou o código do seu blog.
Não tem como eu te ajudar desta forma…
não tem outra forma de por o mesmo widget ?
Como assim outra forma?
Basta você colocar em qualquer lugar que faça com que o código fique em baixo do post, por exemplo detro da div “footerarticle” que tem lá no seu blog.
sim sim Consegui Brigado ae!
Olá,gostaria de saber se não tem como ele ficar sendo exibido somente na pagina inicial,ou ambos.
Obrigado.
Não é possível. Pois qual post ele iria compartilhar?
A brother,eu já vi vários recursos razoavelente semelhantes que ficam na pagina inicial,mas não possuem os mesmos botões.O que o Celso Lemes usa fica na home também.
Não vai ficar sem sentido usar para compartilhar a homepage passando os lado dos post?
Nunca vi um blog gringo com isso na homepage.
Mas se você quiser colocar na homepage procura aqui nos comentários, ensinei já alguém a fazer isso.
Claudio, o erro do botão “Curtir” voltou novamente! Dessa vez está acontecendo no Chrome e Firefox.
Da última vez havia sido um conflito com o que tinha em meu layout e logo após retirar td deu certo.
Dessa vez até o daqui do Ferramentas Blog desapareceu.
Sabe o que aconteceu?
Realmente aqui esta aparecendo e sumindo.
O problema ai é no Facebook, servidor deles deve estar com problemas.
Aproveito a oportunidade para deixar meus parabéns a equipe do blog, e mencionar que este é um excelente post.
porem estou com dificuldade para incluir o mesmo,em meu blog ele me reporta uma mensagem informando que os html não estão fechado corretamente, poderia me ajudar nesse sentido
parabéns pelo trabalho
Você esta inserindo no local onde indicamos?
Pode me informar o erro? Colar ele aqui mesmo.
Assim consigo saber exatamente onde esta quebrando.
muito bom esta postagem gostei muito, e incorporei ao meu blog. valeu fera!!
Eu não encontrei o código e agora? Que faço?
Você poderia ter comentado usando o link do seu blog no campo indicado.
Assim eu teria entrado lá e poderia te ajudar.
Ou se não você pode procurar outro lugar que fique de baixo do post e dentro do loop para colocar o código.
Ola Claudio, tenho um probleminha na minha box, ele so aparece a parte do Twitter quando a pagina esta no topo.
Poderia me ajuadar.
No CSS dele troca o “top: 200px;” para “top: 0;” que tudo estará resolvido.
Obrigado..
Olá, aqui tá funcionando redondinho, mas quando clico em alguma foto do post e aparece a Lightbox, o box flutuante fica branco… Fica bem estranho.
Será que não existe algum jeito de o box flutuante “escurecer” junto com o resto da página, na hora que o lightbox for ativado?
Vc poderia me ajudar?
Obrigado!
Você não colocou na hora de comentar o link do seu blog.
Desta forma não tem como eu lhe ajudar.
Oi, eu fiz tudo como estava escrito mais não ficou flutuando…fikou la embaixo do meu post… me ajuda?
Você não seguiu corretamente o tutorial.
O primeiro código que passamos você inseriu em local errada e por isso não esta funcionando.
Colocou o código dentro de um comentário HTML que faz aparecer apenas para IE6, retire o código de lá de dentro e coloque no lugar que indicamos.
eu fiz sim. tipo, eu colokei a primeira sequencia de de códigos acima do a segunda acima do e a terceira abaixo
Claudio, eu fiz umas 3 vezes tudo o que você escreveu ali encima e ta a mesma coisa…fui em Modelo › Editar HTML …expandi e tudo mais e colokei nos lugares certos…mais ainda continua lá embaixo
Eu fiz do jeito q tá aí, e ficou abaixo do post.
Consegui. \o/ mas só aparece metade da caixa no canto, tipo, a outra metade fica escondida.
Só tirar o overflow: hidden da div esta por cima ai ocultado.
desculpa te mandar um monte de comentários rs. eu consegui colocar mais foi através de outro site. mesmo assim obrigada ^^
O código antigo esta lá ainda errado Deborah.
Ele esta aqui dentro:
http://imm.io/gP3Y
acheeei, mais o que eu devo fazer agora? da uma olhada
http://imm.io/gP7f
Tem que tirar o código que esta ai e colocar antes de </head>
Ele começa em: <b:if
E termina em: </b:if>
aaaaaaaah muito obrigadaaa =D
deu super certo \o/…
obrigada pela paciencia ^^
Sem problema Deborah.
De nada.
Olá, Cláudio, nem consegui.. fiz como a débora e segui os passos..
sou bem novo nisso e apenas queria que isto desse certo.
valeu!
Só seguir o tutorial como falei que nada vai dar errado
Olá Claudio!
O template do meu blog não possui post-footer-line-3, somente o post-footer-line-1 e o 2. O que faço? Onde coloco o código que deveria ir abaixo do post-footer-line-3?
Olá novamente! Esquece o comentário anterior. Consegui resolver. Coloquei o código onde normalmente iria o post-footer-line-3 e funcionou!
Sucesso e abraços!
Seguinte… Segui corretamente o tutorial e foi instalado conforme especificado, porém, o compartilhamento do google+ e facebook não aparecem, o que faço?
Deve ser incompatibilidade com outros botões que você já tem.
Abaixo de qual codigo eu tenho que colar o codigo que você passou para aparecer na home?
Guilherme, olha nos comentários, ensinei como fazer isso para alguém, mas não me lembro agora para quem foi.
Olá Claudio!
O template do meu blog não possui post-footer-line-3, aliás não possui nem um código post-footer-line. o que eu faço?
Coloca no line1 ou line-2
Ou qualquer lugar que fique dentro do loop dos posts e de preferência no final dele.
Muito obrigada pelo tutorial.
É um passo-a-passo muito bem escrito e seguindo à risca, fica perfeito.
Nem sempre as pessoas que postam dicas de widgets ensinam também a personalizá-los.
Frequento muito esse blog, sempre arrasando!
Abraços
Obrigado pelos elogios Luiza.
Olá Claudio, no meu blog não aparece o botão “curtir” e “enviar” do Facebook.
Eu segui os passos direitinho até refiz várias vezes mas eles não aparecem!
Você poderia me ajudar?
Miguel, isso é bug do Facebook mesmo.
Tem já no seu blog algum javascript do facebook?
Se tiver deixa apenas um.
É foi isso q eu fui olhar ontem, mas só percebi q tinha após enviar o comentário :S
Muito obrigado pela atenção e pelo widget 🙂
Só uma sugestão alí no fim do post no “Personalizando o widget”, coloca como mudar a cor de fundo do widget, creio q muitos queiram mudar para ficar compatível com a cor do blog.
Olá Claudio!
Estava encontrando problemas com o código, e quando li esse seu comentário tentei retirar um botão do Facebook deixando apenas um…
E não é que funcionou véi?!
Super-Parabéns mesmo pra vocês, administradores do fb, e que continuem fazendo o trabalho incrível que desenvolvem aqui.
Obrigado.
Cladio, no meu deu bem más nas postagens as abas de link não descem mais, por que isso aconteceu?
Incompatibilidade do jQuery com o script que você usou para fazer isso.
tem como arrumar?
Tem claro, o menu funciona com MooTools que é incompatível com jQuery, da diversos problemas mesmo.
Move o jQuery do Box Flutuante para de baixo do script do menu e pronto, isso deve resolver.
Não resolveu não, mais brigadão ai pela atenção ;/
Como não Igor?
O que você fez?
Coloquei o Script do Jquery do box abaixo do script do menu, vi que nao tinha dado e coloquei abaixo do mootools, tbm não deu depois pus abaixo da slidebar e tbm não tinha dado, tentei ate abaixo de tudo
Tenta no rodapé, antes de fechar o body
Se não vai precisar converter o menu de mootools para jquery,
Ou o Box Flutuante de jquery para mootools
também não, como que faz pra converter? nunca fiz esse processo
Basta reescrever o efeito que estava em mootools para jquery.
Olá Cláudio, excelente tuto,esse mesmo código pode ser convertido para aparecer a barra lateral mesmo na Home?
Tem sim claro.
Procura pelos comentários que ensinei isso para alguém.
Apliquei no meu blog e foi um sucesso. O botão foi o melhor que achei em toda a internet, ao todo são feitas menos de 10 requisições ao servidor, o tempo de carregamento é rápido e ele se ajusta muito bem ao design e chama mais atenção do leitor para compartilhar o post.
Excelente mesmo!
Tem como incluir botões nessa barra, como por exemplo, o velho orkut e um atalho para adicionar aos favoritos?
Oi!! Ficou muito legal, eu adorei :D!!, Tem como deixar o fundo dele transparente? Meu blog tem fundo transparente e queria ver como fica? 🙂
Tem sim claro, só alterar o CSS dele.
Claudio,
Cara, pensa num sujeito LEIGO PLUS. Este sou eu.
Não tenho a menor idéia do que é código fonte, programação e essas coisas todas…
Mas eu queria colocar essa barrinha flutuante das redes sociais no meu blog. E não é que, seguindo o seu posto, copiando e colando as coisas, eu consegui! Até agora não estou acreditando…
Confesso que morri de medo de fazer uma bobagem e perder todo o meu blog, mas deu tudo certo.
Muito obrigado Claudio! Parabéns pelo blog! Se tiver interesse em aprender sobre investimentos em bolsa conheça o meu blog, espero que as informações do meu blog sejam úteis para você também, assim posso retribuir de alguma forma a ajuda que você me deu.
Abraço
Clàudio, gostaria de incluir o botão do Linkedin no box. Poderia me orientar onde colocar o código do botão Linkedin.
No código que deve ser inserido de baixo do line-3, basta você criar mais uma div, colocar o código do botão do LinkedIn e depois fechar a div novamente.
Claudio tentei mais de 3 vezes, mais coloco tudo certinho no meu template, e nunca aparece o box flutuante o que devo fazer?
Não apareceu por no #main-wrapper esta com overflow: hidden e para aparecer precisa não ter overflow ou deixar o overflow: visible.
Fiz o que você falo, mais ainda não deu certo =/
Deu, mais na index não aparece, só nos links internos =/ o que devo fazer?
Ah tah desculpe, não tinha lido a postagem direito, que é só nos post interno, mais tem algum código que devo colocar, para aparece também na HOME?
Há agora que eu intendi, esses botões são de compartilhamento! Ok obrigado, não precisa manda código para mostrar na index!
O Javascript e o Css pode ser hospedado?
Sim claro, pode hospedar a vontade em outro algum lugar se preferir.
Boa tarde! Eu sou português no entanto adoro os brasileiros! Somos família. Mas tenho uma dúvida que queria tirar e se alguém me souber ajudar, agradeço.
Queria saber como troco o nome Curtir, para Gosto e se tem como. Abraço e Beijos 🙂
Oi Hoje, do nada, sumiram os botões face e send (os dois do face) Não foi adicionado nada no html e nem foi feita nenhuma modificação…. tipo: há um minuto estava e agora não está mais… Sabe me dizer? Ficou o G+ e o Twitter o resto sumiu… Pode me ajudar? Obrigada
Isabella,
Algumas vezes o sistema do Facebook dá alguns erros e os botões somem ou ficam instáveis.
É só esperar que voltam.
Uma sugestão também é limpar o cache do seu navegador de internet.
Ok Obrigada por responder Marcos. Vou fazer isso agora (limpar o cache) e aguardar… Um abraço! Adoro seu blog… Aqui aprendi muito e aprendo a cada dia!
Boa Noite,
Eu gostaria de alterar o lado do box, em vez de correr pelo lado esquerdo, eu queria que fosse pelo lado direito dos posts…
alterei onde ta escrito “left” por “right” na esperança de que mudasse algo, mas não deu resultado..
deve ser simples, mas realmente não sei =/
ajuda?
Olá Marcos Lemos ou Claudio Sanches. Instalei o Box flutuante no meu blog e ficou bom nas páginas internas, entretanto quando estou na home aparece a borda do refiro box sem os botões das redes sociais. Ele fica posicionado no canto superior direito da home. Qual a dica para solucionar o problema. Meus conhecimentos de html é de iniciante.
Agradeço desde já, e aguardo algum pronunciamento,
Forte abraço e sucessos.
Marcos eu instalei o Gadget no meu blog e fiz um teste twwitando,e foi normal,porém não aparece a contagem de quantas vezes foi twittado, vc pode me ajudar,e obrigadoo
AH Marcos twittei no seu tbm e vi que está com o mesmo erro do meu
Zaqueu,
Tente limpar o cache do seu navegador de internet. Fiz os testes aqui e está funcionando perfeitamente.
Marcos coloquei no meu blog essa barra com botoes do lado esquerdo da tela do site.
Pois é, ta com um bug com os botoes do facebook, os botoes ficam desalinhados. ja tentei conserta mais nao consequi. esse problema so acontece no navegador mozilla, inclusive o FERRAMENTAS BLOG esta com o mesmo problema. gostaria que voce desse uma olha entre no seu site pelo mozilla, se vc ou o cladio consegui conserta atualiza esse post por favor. Um braço parceiro. Ferramentas blog melhor site que tem.
Acabei de corrigir, basta atualizar o código ou adicionar isso daqui no css do seu site:
No meu site deu certo com o código em vez de -box, assim
#floating-fblog .fb_iframe_widget iframe {
position:relative !important;
}
Opa é verdade.
Do outro jeito foi como eu arrumei o plugin para WordPress.
Obrigado por avisar.
Adorei a matéria eu ja tenho o box fixo e gostaria de colocar o flutuante, antes de eu mexer oe tentei fazer uma simulação, contudo nao achei a linha de código , ou essa linha só aparece quando colocamos os outros codigos das etapas 1 e 2.
Obrigado,
Trigemeos
Fiz e garanto: Ficou super show. Valeu ao Ferramentas blog. O que seria dos blogueiros sem vcs. Quem quiser conferir, é só ir ao meu blog. Valeu.
Oi. Sempre fui um cara que gostou de sombra e água fresca e sempre fui pelo mais fácil, por entender rapidamente(neste caso de html), as coisas que para os outros parece ser muito complicado. Onde eu quero chegar é: tem um jeito mais fácil de adicionar este wideget: copie os códigos em sequencia no NotPad ou afins e adicione como um gadget/java normalmente, aí personalize como diz acima. Pronto, você não mexe na estrutura do blog, e, se não gostar, você pode excluir o mesmo. Fica a dica do @Hey_Dyego
Dyego, simplesmente não é possível isso porque viola os padrões do Web Standards.
Se inserir o código inteiro, irá inserir também CSS dentro do body, o que é contra as recomendações do W3C.
Além de que este script necessita aparecer apenas dentro dos posts e também é pegar o URL e título.
Para que isso seja possível é precisamos usar as variáveis do Blogger.
Inserindo como um widget elas não iriam funcionar.
Se você gosta de facilidade, pode usar o plugin que temos para WordPress disso.
Basta instalar o plugin e ativar. Não é necessário alterar nada no blog ou ir no código.
Eu segui a descrição e não apareceu nada, aí eu adicionei como gadget e apareceu. Talvez aconteceu alguma coisa do além que mesclou os códios e fez funcionar (risos) ou algo parecido, mas está funcionando. Você poderia me passar o link para eu ver como instala esse widget do WordPress?
Funcionou sim no seu blog Dyego, porque ele aparece apenas dentro dos posts.
Não é para aparecer na homepage.
https://ferramentasblog.com/2011/08/plugin-wordpress-box-flutuante-ferramentas-blog.html
Funcionou perfeitamente. Parabéns.
Olá!!
Gostaria de saber se tem como colocar a box no lado direito, pois o menu do meu blog está no lado esquerdo e a box fica em cima :/
Beeijos
Mau blog não possui essa linha (div class=’post-footer-line post-footer-line-3′), aí não consigo colocar…. isso é normal? Nem mesmo os botões convencionais aparecem no meu blog.
Procurei por aqui mas não achei. Por favor quais as alterações necessárias para aparecer TAMBÉM na Home?
Parabéns pelo ótimo trabalho que vcs fazem sempre ajudando a todos com ótimas dicas.
“Não apareceu por no #main-wrapper esta com overflow: hidden e para aparecer precisa não ter overflow ou deixar o overflow: visible.”
Tentei váriaas vezes, mas não consegui, e nem achei o “#main-wrapper” pra alterar o overflow.
Isso esta no css do seu blog Giovanni. Utilize ctrl + f para procurar.
E ai amigo, muito boa essa caixa flutuante!
Os botões Curtir e Enviar da caixa somem quando implemento o botão compartilhar/recomendar do Face. Esta havendo uma incompatibilidade da caixa com o botão. Gostaria de poder usar a caixa e o botão de compartilhar também, até porque “enviar” e “compartilhar” são um pouco diferentes.
É possível adicionar sim.
Porém talvez você deletou algo errado do box.
Crie uma div sem class ou id. E dentro dela cole o código do botão que você quer.
Ainda não manjo de HTML. Só sei o basicão mesmo.
existe uma maneira de ficar fixo se tiver ficarei agradecido . vcs são de mais .
Sim existe, basta tirar o javascript do box.
Como faço isso?
Opa! Consegui!
Mudei o template do meu blog mas este gadjet não está funcionando nele.
tem a mesma função que ?
Preciso de ajuda!
Esse box flutuante é ótimo!
Vocês podiam postar também como colocar as redes sociais no footer do post, na homepage e dentro do post, como tem aqui no blog.
Claudio, o meu ficou bem bacana, so ficou ruim pq ficou em cima da barra lateral, e qnd curto no face, aparece outras fotos que estao na lateral. Mas vlw a dica
Olá, gostei muito, teria como eu arredondar os cantos do box flutuante?
Nobres senhores, funcionou de primeira! Poderiam dar a dica de como modificar a cor do fundo para preto? Muito obrigado.
Claudio:
Instalei o box flutuante assim que vocês o liberaram aqui no FerramentasBlog. Funcionou perfeitamente, mas reparei que nos últimos dias (há uma semana, talvez) o “curtir” não atualizava, o que confirmei acessando o blog a partir de outros computadores. Mas o pior aconteceu hoje: o “curtir” zerou por completo em todas as minhas postagens.
Há algo que eu possa fazer?
Um abraço…
Estou desenvolvendo meu blog e essa dica foi a melhor que eu encontrei relacionada a compartilhamento em redes sociais com botão vertical.
Vlw!!!
Como fazer com que ele desça junto com a pagina(na mesma velociadade)?
Olá amigos, muito bom dia de sábado!
Olha eu fiz tudo certinho, e felizmente está pegando tudo certinho. Com relação as postagens e indicações para o face e para o gooble+ vai tudo sem reclamar, no entanto vi algo no Twitter que não entendi muito bem. Quando vamos indicar pelo Twitter diz que a indicação é feita via ferramentasblog.com tem algum erro, ou algo que eu configurei errado?
Apenas esta observação, já que no mais, deu tudo certinho.
Claudio,
No meu blog não funcionou, nem apareceu. coloquei todos os overflow do codigo como visible e mesmo assim nada. poderia me dar uma luz por favor?
claudio, consegui colocar fazendo alguns testes. esse meu template eh meio doido. preciso entende-lo melhor. acabei colocando o ultimo codigo abaixo de
sabe me dizer se terá algum problema deixando ele ali? vai funcionar direitinho?
Oi, sabe me dizer porquê não está mais aparecendo a opção “curtir”? Obrigado.
Apliquei em meu blog sem problemas. Obrigado pelo conteúdo de qualidade!
Sou muito fão do [Ferramentasblog]
Abç.
não encontro o “…post-footer-line-3”, apenas “…post-footer-line-1” e “…post-footer-line-2”
Rubens,
Pode testar colocar o código abaixo de alguma dessas linhas. São praticamente a mesma coisa.
Mas sugerimos que faça testes num blog de testes antes de tentar aplicar mudanças em seu blog principal. Além, é claro, de fazer backup do layout para caso algo dê errado.
Tentei no blog de testes mas infelizmente não deus certo.
Tentei colocar na “1”. depois tentei na “2”.
Depois coloquei nos dois e também não deu certo.
Talvez não estejas observando ao certo como são as explicações aqui, companheiro. Eu coloquei no primeiro instante e rapidamente já obtive resultado.
Inclusive estava ainda quebrando o “pau” porque todas as vezes enviava a indicação pelo twitter e ainda tinha a questão do ferramentasblog, daí então, voltei aqui, mais uma vez, li novamente o post e vi que tinha apenas que subistituir. Fiz, e estou usando normalmente.
Agradeço mais uma vez aos meninos que fazem o Ferramentas Blog.
Por acaso quando você diz que é para colocar o código ACIMA, quer dizer que é para substituir??
Jardel,
a palavra “acima” é no sentido de “antes”, senão eu teria escrito para substituir ou então teria escrito “em cima de”… entende a diferença?
Entendi sim. Muito obrigado. Consegui colocar no meu blog.
Olá!
Caso eu queira que o box flutuante fique do lado direito do post, o que devo alterar?
Valeu!
Olá amigo, primeiramente parabéns pelo artigo, muito bom.
mas aqui em meu blog acontece algo que o considero um pequeno problema, quando vou descendo a cerca do post, o painel de compartilhamento fica muito abaixo e quando por exemplo vou clicar na caixa de enviar ou curtir do facebook que são as duas últimas, metade da janela flutuante que aparece fica abaixo da tela visível pelo usuário, tem alguma configuração para o painel flutuante ficar mais acima???
abraços.
Pingback: Seu Blog é fácil de compartilhar? - [ Ferramentas Blog ] | [ Ferramentas Blog ]
Depois de alguns testes consegui colocar a box.
No meu caso deu certo colocar depois do footer line 2, pois no meu template não tem o footer line 3.
Quero parabenizar este blog, pois graças a ele apreendi a ser blogueiro e a obter resultados.(Ainda tenho muito a melhorar).
Conteúdos de grande qualidade e tutoriais muito bem explicados.
Parabéns aos autores dos posts, cada post é melhor que o outro.
olá… adicionei o gadget no meu blog, mas a função de contagem do Tweet não está funcionando para mim… apesar de já ter publicado alguns Tweets em diferentes posts, a contagem de todos eles permanece em 0…
qualquer ajuda é bem vinda..
Bem, descobri que essa contagem leva alguns dias para ser contabilizada… ela não parece ser instantânea… de qualquer forma, é um bom gadget… valeu pela ajuda.
Olá, parabéns pelo seu site, a maioria das publicações são muito boas!
Olha, adicionei este gadget ao meu blog, porém só aparece o “Tweet”, sem ícone, apenas escrito, e o “Google +1”. O “Curtir” e “Enviar” não aparecer. Sabe como resolver isto?
Matheus,
Certifique-se de que nào alterou nada indevido no código e seguiu todos os passos corretamente.
O Box Flutuante funcionou direitinho, com a explicação que foi feita para instalá-lo no blogger não tem erro…
Obrigado Claudio Santos por disponibilizar esse ótimo código para os blogueiros da plataforma blogger…
Sanches* desculpa o erro é que escrevi rápido demais… Tempo de blogueiro é curto e corrido sabe como é neh …
Boa tarde! Não existe no meu modelo a linha .
Há outra posição na qual eu possa adicionar a terceira e última parte?
Obrigado!
Certifique-se de que você marcou o “Expandir modelos de widgets”, pois só assim é possível ver todos os códigos do seu blog.
Sim, eu ativei o “expandir”.
Achei! A linha no meu modelo possuía uma barra após line-3′.
Tenta copiar o código somente até o nome 3 e procurar no seu blog deve ser por que nos seus códigos esteja como uma aspas duplas e não uma aspas simples por isso ele não tá achando… Comigo aconteceu a mesma coisa então eu fui apagando do final pro começo e ai o código apareceu…
É só uma sugestão…
Mas você deixou de usar em seu blog, Romirys? Acessei seu blog para ver e não havia o gadget.
O meu blog tem sim o gadget, você tem certeza que viu direitinho alguma postagem do meu blog, por que você sabe que esse gadget aparece apenas na postagem e não na página principal…
Aproveitando, Marcos Lemos você poderia me dizer qual programa você usa para gravar seus podcasts??? Ajudaria muito se você disponibilizasse aqui no FerramentasBlog uma postagem explicando como montar um podcast, com dicas e os programas necessários para isso, seria muito bom pra mim e acho que pra muita gente que já pensou em fazer algo assim também…
Romirys, acho que tenho uma explicação para o que ocorreu, mas deixa pra lá. Agora, sim, vi o gadget. No Gerenciando Blog, Adelson incluiu até email, além das redes sociais. Ficou muito bom. Ele pegou aqui o gadget.
Você diz que o gadget do Adelson é muito bom mas, na minha opinião, não substitui o gadget do Celso. Na minha opinião os dois são indispensáveis em um blog, veja o por que:
O gadget do Adelson usa os links para as páginas principais de suas redes sociais, convidando seus leitores a participarem das redes sociais de seu blog/site e além disso ele inclui uma opção para seguir as postagens via feed o que é ótimo…
Agora no gadget do Celso você, com apenas um clique, compartilha entre as principais redes sociais (twitter, facebook, google+) a postagem que o leitor está, ou seja, se o seu leitor muda de postagem, automaticamente o gadget do Celso entende essa mudança e caso ele venha a clicar novamente em algum desses botões a página compartilhada será a que ele está no momento.
O uso desses dois gadgets faz com que você divulgue tanto as suas publicações como permite também que, uma vez em seu site, o leitor tenha uma acesso fácil as suas principais redes sociais referentes ao seu site/blog…
Mas isso é só a minha opinião sobre o assunto… Abraços e sucesso com o seu blog Pena Digital…
P.S. No lugar de Celso eu quis dizer Claudio… Tava lendo uma publicação do Celso sobre blogs de sucesso… Desculpa ai mais uma vez Claudio por errar seu nome, é a segunda vez nesse post. Não é marcação não tá… Admiro seu trabalho aqui no Ferramentas Blog…
Obrigado pela explanação. Contudo, esclareço que ao solicitar a Adelson a fonte do gadget, ele passou o link para este post. Ele deve ter feito algumas alterações.
cara, esse foi o unico que me ajudou, já tinha visto em varios blogs o tutorial mas nao tinha tantos codigos e nao dava certo, mas queria colocar tambem uma caixa para pessoas curtirem o blog mas nao to conseguindo
Tem como mudar a cor dessa barrinha flutuante? Porque o fundo do meu blog é preto, então não ficou muito legal!
parabéns deu tudo certo aqui eu estava procurando algo assim já fazia tempo,vou avisar para meus amigos porque eles também estavam procurando.
Como fazer para a box ficar completamente fixa, como a que vocês usam aqui, sem dar aquela aparência de que a box está “correndo”?
Estou inciando um blog agora e queria muito colocar estes botoes flutuantes, achei muito bacana, demorei a conseguir, mas deu certo rsrs…. só que comigo funcionou criando um novo GADGET… tentei colocar dentro do html, mas não funciou, então, criei um novo Gadget e copiei todos os codigos à cima e colei.. deu certo.
Como fazer para a box ficar completamente fixa, como a que vocês usam aqui, sem dar aquela aparência de que a box está “correndo”?
Estou utilizando o widget, mas quando faço o teste para enviar ao facebook algo acontece e não dá certo, ele somente abre minha pagina do facebook, e nao aquela pop up com a opçao de enviar. Não sei se é algum erro do facebook ou do widget, quando instalei e testei ele funcionou perfeitamente, mas de uns dias pra cá esse erro esta ocorrendo.
Oi, pessoal. Inseri esse botão no meu blogue , está quase tudo funcionando legal. Só o contador do twitter que não está somando as publicações. Vocês teria alguma solução para isso?
Marinaldo,
Verifica se você colocou os dados do seu twitter e não modificou nada nos códigos indevidamente.
como faz pra não ter que confirmar o curtir quando curte um post
Luka,
Isso é impossível, já que é uma função do próprio Facebook.
Ola ótima dica Parabéns…
esta funcionando corretamente valew!
Olá,
funcionou perfeitamente em meu blog.
Parabéns!
Não estou achando a linha
Meu editor HTML tem uma nova interface e não expande todos os widgets com um botão, preciso expandir um por um. Em qual parte do código esta linha está?
queria que ficasse também na page inicial igual a este site: [ link suprimido ]
mais que não afete as pages… tem como? ou tipo tem um codigo em javascript pra mim colocar no blogger como gadget igual a este pois ja o coloquei mais que fique tambem na page em um lugar reservado… e como eu pego o google + da pagina inicial do meu site? eu não sei pegar em codigo estes botões quero muito fazer um seo melhor pra minha page… acho que deu pra entender né?
resumindo: igual a este que não o faça bugar por tambem aparecer em outra parte da page como gadget em javascript… aguardo resposta.
Marcos Lemos, sou teu fã!
como fazer para o box carregar de forma assíncrona? meu carregamento está demorando muito devido aos botões do FB e G+ sendo carrecados sincronicamente.
att
Como tirar os balões com número de compartilhamentos?
Já até salvei essa postagem nos meus favoritos.
🙂
Alguém sabe me dizer se esse gadget atrapalha os comentários no blog? (eu uso o sistema de comentários do FB).
Os comentários no blog pelo fb ora aparecem, ora somem.
Inclusive, se alguém souber me ajudar, por favor, eu não sei o que fazer.
Grato.
Nunca consegui encontrar essa Line 3, e por isso nunca da certo esse codigo no meu blog. 🙁
Bom dia!
Pretendo adicionar o botão linkdin no gadget, como faço?
Obrigado
Marcos Lemos e Claudio Sanches parabéns por essa super dica. segui o tutorial, instalei no meu blog e funcionou perfeitamente.
Antes eu estava usando um código diferente que a barra de compartilhamento flutuante só aparecia na página inicial e ainda em cima das postagens e depois de dias tentando mudar a margem do gadget sem sucesso eu decidi retira-lo do blog e vim usar o código que vocês estão disponibilizando aqui.
Mais uma vez obrigado pela dica, me ajudou muito.
Parabéns e Sucesso.
Ainda bem que estou tentando, à mais de uma semana colocar, antes do oficial, no blog de teste. Mas, definitivamente, não estou conseguindo. Sigo todos os passos, conforme mostrado, mas quando chega nesse ponto de encontrar isso aqui não encontro nem à pau. No entanto, em meu template anterior, quando coloquei, deu resultado. Como mudei de template à pouco mais de uma semana, já tentei de tudo e nada. Será que é por conta do template novo?
Pessoa, repetindo, sigo todos os passos, mas quando chego à este codigo aqui não consigo encontrá-lo. Sem essa ultima etapa não consigo terminar, e não visualizo nada. Posso saber como e o que fazer?
Obrigada pela dica, funcionou muito bem no meu blog. Coloquei do lado direito, porque assim não atrapalha a visualização da coluna da esquerda e não criou nenhuma barra de rolagem!
Era exatamente o que eu estava procurando!
Gostei muito da matéria e apliquei no meu blog e deu certo muito obrigado, se não fosse muito pedir pois já me ajudou bastante, percebi que só aparece nos posts quando abro um post tem também como fazer que fique na pagina inicial do blogger?