20/12/2014

Tutorial • Imagem nos comentários do autor


image Olá meus Cookies Como estão vocês?? image
Depois de um longo tempo postando utilitários nem foi tão longo assim :#  Finalmente trago um tutorial!! Você já deve ter visto que quando o dono do blog comenta uma postagem aparece o ícone de um lápis, e esse tutorial serve para retirar aquela imagem e por uma outra figura. O resultado será como o da imagem abaixo.
O primeiro é a imagem padrão e o outro é personalizado.
Vamos aprender! :3
Vá em seu HTML e procure por:
icon.blog-author
 Você achará algo parecido com isso:


Ao acha-lo você irá excluir isso:

.comments .comments-content .icon.blog-author {

  background-repeat: no-repeat;

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEgAACxIB0t1+/AAAAAd0SU1FB9sLFwMeCjjhcOMAAAD+SURBVDjLtZSvTgNBEIe/WRRnm3U8RC1neQdsm1zSBIU9VVF1FkUguQQsD9ITmD7ECZIJSE4OZo9stoVjC/zc7ky+zH9hXwVwDpTAWWLrgS3QAe8AZgaAJI5zYAmc8r0G4AHYHQKVwII8PZrZFsBFkeRCABYiMh9BRUhnSkPTNCtVXYXURi1FpBDgArj8QU1eVXUzfnjv7yP7kwu1mYrkWlU33vs1QNu2qU8pwN0UpKoqokjWwCztrMuBhEhmh8bD5UDqur75asbcX0BGUB9/HAMB+r32hznJgXy2v0sGLBcyAJ1EK3LFcbo1s91JeLwAbwGYu7TP/3ZGfnXYPgAVNngtqatUNgAAAABJRU5ErkJggg==);
}
E substituir por esse código:

.comments .comments-content .icon.blog-author{

background-repeat: no-repeat;

background-image: url(LINK DA SUA IMAGEM);
width:19px; /** largura da imagem**/
height:19px; /** altura da imagem**/
display:inline-block;
margin:0 0 -4px 6px;
float:right; / ** posição do ícone **/
} 
Onde está escrito LINK DA SUA IMAGEM você irá colocar o url de uma imagem que seja de tamanho pequeno. Você pode colocar um favicon ou mini gifs, você pode encontrá-los aqui!

Escolhi alguns para vocês:

Blog de garota-veneno : G A R O T A • V E N E N O, Favicons / Mini Gifs ♥    Photobucket  image  image  image   

Espero muito que vocês tenham gostado! Não se esqueça de comentar ^^ Bjooos  

4 comentários:

  1. Nossa! Seu lay é lindo *-*, parabens... Tem como você fazer um tuto de como colocar um subir ao topo como seu? Necessito... e aé, você explica muy bueno ♥ kissus

    ResponderExcluir
    Respostas
    1. Muito obrigada *o*
      Eu já fiz esse tutorial --> http://sonhoshtml.blogspot.com.br/2014/12/voltar-ao-topo-imagens.html
      Você pode colocar uma imagem animada, fica uma graça!
      Obrigada pelo seu comentário!!! Kissus ♥

      Excluir
  2. Seu layout é muitoo lindo, eu ameii! Ah, estou te seguindo, segue também??

    There | Fluffy White

    ResponderExcluir
    Respostas
    1. Muito obrigadaaa *--*
      Claro que sigo! Bjoos ♥

      Excluir

♥ Comente algo relacionado ao post !
♥ Proibido xingar, ofender e ser agressivo !
♥ Seja educado (a) !