Customizando o Widget do Blogblogs de Ultimos Leitores
Muita gente me pergunta como eu mudei o layout do widget de últimos leitores do Blogblogs. E muita gente também deixa de colocar o widget do Blogblogs por ele não ficar muito compatÃvel com certos layout/temas.
E eu sempre quis postar um mini-tutorial de como customizar o widget, mas por preguiça ou por falta de certeza ou por preguiça nunca fiz…
Pois então aproveitei o embalo do Rodrigo do Blog Ajuda e resolvi fazer também! =)
Então, antes de ler esse post, leia o do Blog Ajuda. Para entender melhor toda a estrutura do widget e saber como ele conseguiu achar todas as classes e IDs. (era disso que eu tinha preguiça, mas ele mostrou que era muito³ fácil.).
Só leia daqui pra baixo depois de ler o post do Blog Ajuda, senão dará errado e fuck você!
Usaremos como modelo o widget aqui do Anderssauro.com porque só tenho esse! =)
Esse modelo usa 2 imagens que dever ser hospedadas no seu servidor, caso esteja em um host pago. Ou em algum site de hospedagem de imagens como o Photobucket por exemplo…
Não recomendo o ImageShack pois quando o servidor deles ficar fora do ar (o que é bem frequente) no lugar de suas imagens você verá sapos amarelos! o.o
As imagens são essas:
<—IMAGEM 1
<—IMAGEM 2
Colocarei aqui o código CSS bem especificado. Copie e cole dentro de um bloco de notas para visualizar melhor e fazer as mudanças necessárias:
[UPDATE]
Tinha colocado o código dentro de um campo de texto mas ele “dava pau”. Então vou colocar em um bloco de notas. É só baixar e conferir.
[/UPDATE]
As imagens estão bem destacadas com letras maiúsculas, apenas substitua pela URL da imagem para que elas funcionem corretamente.
Provavelmente será necessário algumas mÃnimas mudanças nas medidas das margens e espaçamento.
O CSS é totalmente customizável, mudança de cor de links, backgrounds ou bordas são facilmente trocadas.
Bom, qualquer dúvida pergunte nos comentários.
Escrevi o post meio na pressa porque estou no Rio de Janeiro, com a minha Anassauro. (L)
Bom feriado a todos!
[UPDATE-2]
Quem está usando a dica do post:
Se você também usou o post avise nos comentários para entrar na lista!
[/UPDATE-2]
[tags] blogblogs, widget, css, customização [/tags]
Excelente dica Anderssauro!
Essa dica é muito útil, porque para alguns temas essa widget fica muito estranho, mas editando o CSS fica 10! e isso é uma coisa muito simples que qualquer um pode fazer…
Abraços
Te amo ;~
Legal seu post. Tenho uma dúvida…Não funciona no Blogger né?
vaelu.
Cara aluciante a dica , eu tava pensando em coloca, agora VOU colocar (h)
Vale mesmo
então, mesmo vc falando q funciona eu nao consegui colocar no blogger. eu hospedei as imagens, substitui o link dentro do código e colei dentro de modelo> elementos de página. O blogger aceita códigos css?
obrigada pela resposta, viu.:D
Bacana! Sempre achei essa barra de imagens (que vi primeiro no Tecnocracia) muito mais bonita que a original. Agora que você passou o caminho das pedras, farei a mudança em breve no diadefolga.
Podia ter um cheat prá me deixar em primeiro lugar no rank né?!
HAuHauHauHAUhA
Beijocas
Grande Anderssauro, valeu pela dica. Este é o primeiro blog que vejo essa explicação.
Abraços.
Cara, eu to tentando faze isso a horas e não consigo. Já upei as imagens, já passei o codigo pro meu css, editei o endereço das imagens, fui no blogblogs e copiei o segundo codigo lá, mas meu estilo fica o mesmo, somente todo feio, com um fundo branco, sem estilo algum. Eu não sei o que tá faltando, não to conseguindo achar… Me ajude… meu msn é leonardo@techbr.net .
FLW
Dica muito boa, mas para iniciantes muiito complicado, uma dúvida básica, onde colocamos o código em txt ? em que parte colocamos a nossa identificação do Blogblogs ?
To com algumas duvidas!! depois que eu colocar as URLS das imagens no bloco de notas o que eu faço? onde coloco esse codigo?
Legal Bom tutorial, mas eu também gosto do modelo normal, vou ver o que eu faço nele!!