dicas blog
Home » , , , , » Gadget do autor com efeitos no rodape´ das postagens

Gadget do autor com efeitos no rodape´ das postagens

3
hoje  trago   um gadget   do   autor  que   dei   umas  alteradas,   colocando  hover  e   dei   uma   esclarecida  nas  coisas   para  facilitar   as  coisas   por  aqui.   isso  é  bem    importante  para    você  se   identificar   no  s eu  blog   e  passar  uma   clareza   a    seu  respeito  em   baixo  de  todas   suas   postagens   do  blog,   falando   um  pouco  de   você    com  poucos   caracteres   para que  os   visitantes  possam   conhecê lo   um  pouco.  se  você   estava    procurando  isso  esse   vai  combinar  com  você   e  seu  bog,   você  pode  alterar   as  cores   de   tudo  texto 
borda   da   foto  hover   cor   principal  vou  deixar   tudo  marcado  para  facilitar.   a  instalação  é   bem  fácil   de  se  fazer   apenas  estalando  um  pequeno  código   no HTML  do  blog   e  um gadget java   script .

Observação:  se  você   tem  artigos   relacionados  no  blog,  ou  botões   de  compartilhamento   você   terá   que  identificar   seus  códigos  para  que  o   gadget  do  autor  não  fique   acima   das  postagens   relacionadas,  e   de  seus  botões de  compartilhamento  então  preste   atenção  para   identificar  o  final  do  códigos.    falo  isso  por   experiência  própria   e  porque  isso  com certeza   vai  acontecer  com  você   se  não  tiver  muita  experiência   bom  siga  os   passos  abaixo   e   vamos  La.

Demo


Copei  o  código  abaixo e   cole   dentro  de  um  gadget   javascript na lateral do  blog.



Agora  vá em  modelo editar HTML   Expandir modelos de widgets

Copie o  código  abaixo   e   cole  abaixo  disso   <div class=’post-footer-line post-footer-line-1′>



Veja  um exemplo  abaixo  dos  locais certos  para você  alterar

<b:if cond='data:blog.pageType == &quot;item&quot;'><div id="authorbox">      
<img alt="" src="https://lh6.googleusercontent.com/-5DvzddqVALg/UHzHSchgWhI/AAAAAAAAANY/TzyZU1pjLl8/h120/autor.png" height="100" width="100"></img>
<h4><a href="http://meublogdicas.blogspot.com.br/" title="Posts by Rahul Ippar" rel="author">Postado  por  Ricardo Moraes
</a></h4>
 <p>Ola meu  nome é  Ricardo, sou  administrador  do  blog  meu  blog  dicas.  sou  novo  nisso  já   criei  minhas  loucuras,   e  botei  em   pratica   gosto de  criar  coisas  novas  se  você  curti   isso  me  acompanhe.</p> <p>Me  acompanhe <a href="http://www.twitter.com/meublogdicas">Twitter</a> ou <a href="http://www.facebook.com/pages/Meublogdicas/256653617787793">Facebook</a></p></div></b:if>

Coloque  seu  twitter   e  facebook  para   contato   nos  lugares    marcados   com  as  cores 

Você  pode   deixar   ele  bem  simples,   se   preferir  tirando  a  cor  escura   e   colocando  uma  branca  por  exemplo  então  ele  serve  para   todos  os  gostos.

Meu Blog Dicas


Para  trocar  o  avatar  troque  a  imagem  por uma  sua, a cor selecionada é amarela.
Tamanho  do  avatar 120x120
Em azul adicione  seu  twitter  e  facebook  URL  vermelho
A cor das bordas  e  dos  testos estão  marcadas   em verde   troque  como  preferir
Para trocar  a  cor  do fundo  do  gadget  escura,  procure  pelo  código  abaixo   no começo do código  do  gadget  você  encontrara  por  isso  background:#333  troque  a   cor pela  desejada.


3 comentários:

  1. Meu blog n tem isso q eu farço div class=’post-footer-line post-footer-line-1

    ResponderExcluir
    Respostas
    1. Ola João Você usa a interface do blogger ? Se sim o código pode estar um pouco diferente, varia de template para template mas tem sim, porque vi que no seu site tem botões de compartilhamento no final das postagens é só você encontrar eles e colocar o código do gadget acima deles, para aparecer acima e abaixo para aparecer abaixo. se encontrar dificuldades me procure demovo que vemos o que posso fazer para ajudar obrigado pela visita.

      Excluir
  2. como faço para desativar a interface do blogger?
    Meu blog é esse aqui http://messagesdefe.blogspot.com

    ResponderExcluir