31 de jan de 2013

Widget - Box Sobre o Autor no rodapé de seus posts no Blogger

Olá amigo informal! Bom, hoje trago um widget que estou acostumado a ver em inúmeros blogs, mas de um estilo diferente. Você já pensou em ter uma em seu blog? Ela além de dar um ar de profissionalismo ao blog, está na lista de widgets que não podem faltar em um blog, segundo o bloqueiro Adelson Smania do Gerenciando Blog. O estilo que vou compartilhar com vocês é super interessante e tem sutis efeitos em CSS3.


O diferencial dessa caixinha com a biografia do autor, é que não tem apenas a o bio mas também inclui pequenos botões sociais para que os leitores podem se conectar com o autor em redes sociais como Facebook , Twitter e Google Plus. O widget foi feito por Bhavesh Pamecha.




Alerta! Antes de fazer qualquer modificação, faça um backup do seu modelo.
Acesse modelo 
 Fazer backup/Restaurar  Fazer download do modelo completo.


1° passo: Acesse o painel do Blogger , escolha o blog que você deseja instalar, selecione a opção "Modelo" e clique em "Editar HTML".


2°passo: Marque a caixa "expandir modelos de widget". Agora usando o Ctrl F, procure por:

<data:post.body/>

3° passo: Logo abaixo, cole o seguinte código:


Mudanças a serem feitas

Substitua descrição de imagens para SEO , com uma pequena descrição de 2 a 3 palavras  para SEO imagem.

Substitua AVATAR LINK com o pic avatar ou o perfil do autor

Substitua AUTHOR LINK com o blogue do autor ou de qualquer coisa que você deseja vincular

Substitua AUTHOR NAME com o nome do autor.

Substitua BLOG LINK com o link para o autor do blog.
Substitua FACEBOOK LINK com o perfil do autor no Facebook.
Substitua Google + LINK com o perfil do autor Google+.
Substitua TWITTER LINK com o perfil do autor no Twitter.
Substitua AUTHOR BIO com a bio do autor.

Código CSS

4° passo: Agora, procure por ]]> </ b: skin> e logo acima dele cole o seguinte código e salve o modelo.



Espero que tenham gostado! Deixe seu comentário!
Compartilhe essa postagem!
  • Share to Facebook
  • Share to Twitter
  • Share to Google+
  • Share to Stumble Upon
  • Share to Blogger
  • Share to Email
  • Share to Yahoo Messenger
  • More...

Recomendamos para você »

10 comentários

  1. Olá Marcus ! Ótima dica ! Eu uso esta caixa e adoro! Fiquei encantada com ela porque além da bio, como você disse, ela possui estes botões das redes sociais com efeitos e é bem customizável, eu alterei bordas etc a meu gosto mesmo sem saber muito de html :)
    O visual é bonito e ela é bem funcional :) Parabéns pela partilha :)

    Grande abraço e bom fim de semana :D

    ResponderExcluir
  2. Olá @Samanta! Obrigado pela visita! Realmente essa caixinha é ótima! Usei ela por muito tempo e sua simplicidade e elegância me conquistou... rsrsrs
    Enfim, ela é um ótimo recurso que se adapta a qualquer template...
    Abracos e um ótimo final de semana para você também! :-)

    ResponderExcluir
  3. Muito bom. É útil e interessante usar este widget em qualquer blog, especialmente, se mais de 1 pessoas escreve num blog.

    ResponderExcluir
  4. @Andre, verdade! Ele auxilia muito ao leitor identificar ao certo quem foi que publicou determinada postagem ao certo.
    Abraço e obrigado por comentar! (p)

    ResponderExcluir
  5. Não tem como usá-lo para vários autores, ou tem? Acho que só pra blog que tenha um autor, ou não?

    ResponderExcluir
  6. @Mesa de bar, desculpe a demora para responder... Aliás, tem sim uma versão para múltiplos autores. Em breve postarei o tutorial para a mesma aqui no Mundo Informal.
    Até mais!

    ResponderExcluir
    Respostas
    1. Vlw! Estarei na espera, aliás parabéns pelo artigo!

      Excluir
  7. Tem como fazer o tutorial de como criar isso para mais de um autor?

    ResponderExcluir

Seja livre para expor seu pensamento!

Se preferir, antes, leia nossas regras para comentários...
(Atenção: Comentários "Anônimo" não serão publicados. Escolha "Nome/URL". Obrigado!)
Bom comentário!

:) :-) :)) =)) :( :-( :(( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ :-$ (b) (f) x-) (k) (h) (c) cheer

 
Pré-Designed by BlogThietKe Designed by @Mundo_Informal
© 2012-2014 .::Mundo Informal::. Todos os direitos Reservados
Licença Creative Commons
...See you!
Voltar ao topo