Oi, gente!
Vamos de tutorial novinho?
Hoje nós vamos aprender como colocar esse contador de seguidores, curtidas e inscritos que temos em nossas redes sociais.
Há muito tempo esses contadores estão pelos metablogs mas a inserção dos números de seguidores, curtidas e inscritos era sempre manual, e isso é pouco prático, né?
Mas esse script JQuery consegue fazer isso automaticamente!
Veja a demonstração:
Não é o máximo?
Quer aprender? Vem comigo!
Como instalar o contador de seguidores automático no blog?
Para começar você precisa estar logado em sua conta do Instagram. É que para conseguir fazer com que o contador dos seguidores do Instagram funcione você vai precisar gerar um token.
Faça login em sua conta Instagram e a seguir clique aqui:
http://instagram.pixelunion.net/
Na página que abrir clique no botão Generate Access Token.
Autorize o aplicativo e copie o código que vai aparecer. Cole em um bloco de notas e reserve.
Importante: sempre que trocar sua senha do Instagram precisará repetir esse passo: acessar o site, autorizar o aplicativo e gerar novo token.
Portanto, guarde o endereço do site, ok?
Isso feito, vamos à parte mais divertida!
Abra a página com os códigos que vamos usar:
Vá ao painel administrativo de seu blog e clique na aba Modelo.
Clique em Editar html e dentro da caixa de código localize a tag de fechamento </head>
ACIMA dessa tag de abertura cole o CÓDIGO DA FONTE ESPECIAL e o CÓDIGO DA BIBLIOTECA AJAX .
Se seu template já tiver essa fonte ou esse script pode pular essa parte.
Se não tiver, cole e salve.
A seguir clique na aba Layout. Aí clique em Adicionar um gadget e dentre as opções selecione HTML/JAVASCRIPT.
Dentro da caixinha que abrir cole o CÓDIGO DO CONTADOR DAS REDES SOCIAIS.
Agora preste atenção!
Onde você vê os meus usernames apague e coloque os seus.
E no campo instagram_token apague a sequência alfanumérica que está no código e insira o seu token, aquele que foi gerado lá no começo do tutorial.
Não apague as aspas!!!
Não precisa alterar os demais códigos ou tokens.
Depois de colocar seus usernames salve, arraste para onde deseja que fique e salve a alteração do seu layout.
Está prontinho!
F.a.q - Frequently asked questions
1- Quero excluir uma das redes sociais
Simples: localize no código o trecho referente à rede que deseja excluir, apague e salve.
2- Quero acrescentar outra rede
Por enquanto o script só lê essas 6 redes.
3- Quero trocar as cores de fundo
Altere trocando o código hexadecimal de cada rede, sempre precedido do sinal #. Mas as cores são as "oficiais" das respectivas redes...
4- Quero trocar as palavras Seguidores, curtidas, etc...
Localize no código a palavra que deseja alterar, apague-a e substitua pela que desejar. Salve em seguida.
5- Quero diminuir (ou aumentar) o tamanho da fonte
Localize no código as áreas referentes às fontes e altere como desejar, para mais ou para menos.
Essas alterações são por sua conta e é preciso um conhecimento básico em CSS.
Dica muito, muito importante
Eu hospedei o arquivo original que faz a mágica acontecer em meu site mas é altamente recomendado que você copie o script, cole-o em um bloco de notas, salve com a extensão .js e hospede em sua própria conta.Isso é essencial porque se houver um tráfego intenso em meu host o script sairá do ar e seu widget vai parar de funcionar.
E se um dia eu, por algum motivo, excluir o script, o seu widget sairá do ar.
Então, siga o conselho da tia Elaine: hospede o arquivo em seu próprio host.
Não se desespere, eu ensino como fazer isso, confira:
Como hospedar arquivos no Google sites
Aqui a página com o Arquivo .js. Ele é extenso e você não deve alterar nada, sob risco dele não funcionar:
Para te ajudar eu gravei um vídeo-tutorial com a execução desse tutorial.
Dá o play e se divirta fazendo!
Leia e releia o tutorial até entender tudo.
Faça com calma e se precisar de ajuda diga nos comentários e eu ajudo, se puder.
Gostou?
Mereço um curtir ou um compartilhar?
Elaine, vou tentar colocar no meu blog,se eu não conseguir voltarei para pedir um Help.
ResponderExcluirEstou feliz porque quando eu curtia sua página as curtidas não aumentavam...rsrs....agora aumentou bastante fico feliz por você.
Sucesso para você!
Prabéns pelo tutorial,beijos
Parabéns pelo tutorial
Elaine amo acompanhar seus posts, me ajudam bastante. Sucesso, bjinhos!!
ResponderExcluirPAPO DE GAROTA CRISTÃ
www.sarahcristinny.com
Linda, acabei de colocar o widget no meu blog, mas os contadores ainda não estão funcionando. sabe se demora para aparecer os números?
ResponderExcluirBeijos
O Google + e Twitter nao estao aparecendo numeros =( o que faço?
ResponderExcluirNão estão aparecendo os números em nenhum dos meus :(
ResponderExcluirwww.alinezanatta.com.br
Aline, acho que você não colocou os usernames corretos.
ExcluirExperimente colocar exatamente como está no seu navegador...
parou de funcionar, agora nao esta aparecendo os numeros =(
ResponderExcluirComo você pode ver no blog de testes está normal, funcionando perfeitamente.
ExcluirPode ser algo em seu template causando conflito ou algo errado na colocação dos usernames...
Experimente de novo, e também em um blog simples, de testes.
Não esta aparecendo os numeros no meu mais =(
ResponderExcluirPorque? ajudem ai!
Vou tentar colocar no meu caso eu não consiga você promete que irá me socorrer é ter paciência comigo?!
ResponderExcluirhttp://mundoabreu.blogspot.com.br/?m=1
The wonderful post and i can collect more reviews from here. The genuine types of documents and effective value is possible here. The best essay writing service
ResponderExcluirOi boa TARDE ELAINE, UTILIZO ESSE TUTORIAL, MAS QUANDO CHEGA NA PARTE REFERENTE AO FACEBOOK O MEU FICA ZERADO ( SEM NUMEROS ) , AI VEM MINHA PERGUNTAS DUVIDOSAS PRECISA TROCAR O TOKEN DO FACEBOOK ? OU É SÓ COLOCAR MEU NOME DE USUARIO? E OUTRA
ResponderExcluirSE USA O FACEBOOK PESSOAL OU A PAGINA ?
DEIXEI SÓ TRÊS REDES SOCIAIS , CASO QUEIRA VER É SÓ CLICAR NO LINK ( MINHAS REDES ) , QUE VÃO APARECER ... POR FAVOR PODE ME INFORMAR
https://bubbslandia.blogspot.com.br/
Keells, é a página, perfil não serve. Não precisa trocar o token, creio que o seu problema seja mesmo ter colocado perfil onde deveria ser página...
Excluirobrigada consegui , acho que era o token que criei da pagina ( porem ele não era infinito ) expirava em 2 horas !
ExcluirMinha cordial saudação Elaine Gaspareto, antes de mais nada, aproveito a oportunidade para lhe agradecer pelo post sobre "Contador de redes sociais automático", está sendo muito útil pra minha pessoa.
ResponderExcluirNo entanto em relação ao mesmo estou tendo um problema, no contador do TWITTER aparece zerado, fui atrás do problema e encontrei a seguinte mensagem "This request has been blocked; the content must be served over HTTPS." - Este problema se relaciona a elemento de busca não seguros que o próprio Chrome não carrega e por tal aparece zerado, para aparecer tem que permitir carregar scripts não seguros, e isso inviabiliza o uso do mesmo, pois meus amigos terão que carregar isso sempre...
Por acaso tem alguma solução pra isso?
Sem mais para o momento, obrigado!
Quero usar o contador só para o instagram como faço? apago os outros?
ResponderExcluirSim, isso mesmo.
Excluirvaleu mesmo pela ajuda
ResponderExcluirhttps://vendovideosdaweb.com/