Perfil com imagem arredondada e ícones das Redes sociais

02:57


Oie meninas... depois do sucesso do layout Rosa Cute muitas blogueiras me pediram o código que deixa o perfil da blogueira super organizado e bonito, com a imagem arredondada, com a descrição da blogueira e com os ícones das redes sociais...  igual a imagem abaixo:


E logico, não pensei duas vezes e vim correndo ensinar para vocês, antes de mais nada você tem que hospedar sua foto de perfil para obter a URL da imagem, eu utilizo esse site aqui: TinyPic ele é gratuito e bem simples de usar.

Para personalizar seu perfil no blog é muito fácil e não precisa mexer no html do seu blog, basta adicionar o código abaixo em uma caixa Gadget na opção HTML/Java Script:


<center>
<img src="LINK-DA-FOTO-DO-PERFIL" style="-moz-border-radius: 200px; -webkit-border-radius: 200px; -o-border-radius: 200px; width:240px; heigh:auto;" />
<br />
NOME E DESCRICAO DA  BLOGUEIRA AQUI <br />
<center><a href="ENDEREÇO-DA-REDE-SOCIAL-FACEBOOK"><img src="URL-DA-IMAGEM-FACEBOOK"/></a><a href="ENDEREÇO-DA-REDE-SOCIAL-INSTAGRAM"><img src="URL-DA-IMAGEM-INSTAGRAM"/></a><a href="ENDEREÇO-DA-REDE-SOCIAL-TWITTER"><img src="URL-DA-IMAGEM-TWITTER"/></a></center></center>


Entendendo o código:

Substitua onde tem Link da Foto do Perfil pela URL da sua foto
Onde tem: Nome e descrição da Blogueira: Substitua  por um resumo sobre você.
Onde tem Endereço da rede social: você substitui pelo seu link exemplo: www.facebook.com/seuface
E onde tem URL da Imagem Facebook: você coloca o link da imagem que você deseja...
Assim acontece para as outras redes sociais.


Confiram no blog da Karoline, lindos icones para rede sociais: Follow You Dreams 

Super recomendo!!!

Diga NÃO ao PLAGIO!! Seja Criativo e Original!


Bom, pessoal espero que tenham gostado 
Se esse blog tem te ajudado deixe nos comentários para que eu fique sabendo! 

Atenção,  SE INSPIREM mas não copiem!




Poderá gostar também de:

39 comentários

  1. Vi teu post sobre parceri *.*

    nós queremos ser sua parceira flor ;**** bjão!!!!

    ResponderExcluir
  2. Olá eu adorei o post já há algum tempo que queria colocar a foto de perfil maior mas não consigo depois diminuir ligeiramente a largura como faço isso? http://ocadernodasideiasparvas.blogspot.pt/

    ResponderExcluir
    Respostas
    1. Patty eu nao entendir muito bem sua pergunta... mas vou dizer por mim: Quando editei a imagem redimensionei pelo tamanho da sidebar... largura

      Excluir
    2. Olá Renata a imagem ficava larga em relação a largura da barra mas resolvi o problema pondo a barra mais larga.. adorei os icones só é pena não ter o do youtube

      Excluir
    3. vc pode repetir os codigos das redes sociais quantas vezes quiser, subistituindo apenas os links da imagem e da rede social... eh infelizmente os icones do youtube q tenho sao poucos e diferentes dos conjuntos q postei, nao ficaria padrao =(

      Excluir
    4. Eu consegui um que é uma claket mas tem de ficar maior que os outros todos porque do mesmo tamanho fica desfocado :( Eu repeti para o youtube e para o google + só não usei os teus icones porque os rosa são muito claros e não gostei muito de ver no meu blog por causa do fundo

      Excluir
  3. Fica tão lindo a foto arredondada no perfil, sou super fã rs
    E que ícones fofos, o étnico é uma lindeza, bem diferente, nunca tinha visto <3
    Seu blog é super útil Renata, já estou seguindo!

    VOTE EM MIM: Isadora Adora
    Isadora Adora | www.isadoraadora.com

    ResponderExcluir
    Respostas
    1. Oie isaa, super feliz pela sua visita!
      Que bom que vc gostou!
      Fique ligadinha que sempre posto novidades para blogs
      Bjaoo

      Excluir
  4. Adorei o tutorial ! Ai se tivesse visto antes. Não teria me matado pra colocar no meu blog. Seguindo

    Blog Quem Disse?FacebookInstagram

    ResponderExcluir
  5. Poxa Renata, obrigada pela visita ;) adorei seu blog.
    Abraços.

    ResponderExcluir
    Respostas
    1. hehehe fica pra proxima neh?!
      Quando precisar ja sabe onde encontrar <3
      Tbm gostei do seu blog *-*
      Bjuss

      Excluir
  6. Amei todas dicas e tutorial ♥
    Tem post com seu blog envolvido, vem dar uma olhada! :)
    http://doce-meninice.blogspot.com.br/2015/03/5-blogs-que-eu-recomendo.html

    ResponderExcluir
    Respostas
    1. Tamy sua linda... vi o post e ja deixei meu comentario!
      Super bacana!
      Obrigada pela indicação <3
      Bjaaao minha linda

      Excluir
  7. Nossa, adoro blog assim. Ele é lindo, parabéns... Acho que vou aderir esse tutorial, muito fofo !
    *-* agradeço sua visita ao meu blog, nossa adorei ter encontrado o seu blog ele é muito top. Parabéns, você é muito criativa e continue com seu entusiasmo ao ajudar as pessoas. Tudo de bom !

    Seguindo com certeza !

    http://seilumine.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Oiee Maah, ssim essa tuto eh bem facil e simples!
      Qualquer duvida pode me pèerguntar que respondo por aki
      Bjao linda e obrigada pelo elogio...
      vou conhcer seu blog siim!!
      Bjao

      Excluir
  8. Nossa lindo.. vo fazer no meu e te credito *.*

    ResponderExcluir
  9. Segui direito e ficou lindo e estou usando icones que vc fez ta bom ? beijos

    ResponderExcluir
  10. Mas uma vez me ajudando rs, não consigo sair daqui kk. Beijos !

    http://morandosozinhaesoumae.blogspot.com.br/

    ResponderExcluir
  11. Me ajudou mesmo muito... Obrigado!!
    Visita meu blog Reh http://www.negaotv.blogspot.in/

    ADORO O TEU BLOG!

    ResponderExcluir
  12. Amei e deu super certo! Estou começando agora no mundo dos blogs e seus tutoriais estão sendo incriveis pra mim!
    Obrigada e beijos ♥
    http://blogmaisquemaquiagem.blogspot.com.br/

    ResponderExcluir
  13. Adoro o teu blog, esta super organizado! como e que e possível colocar a barra preta com os ícones das redes sociais?! obrigada!!

    ResponderExcluir
  14. Só consegui depois que vi seu post, obrigado pela ajuda, seu blog é impecável.

    ResponderExcluir
  15. Me ajudou mesmo muito Prof Renata Massa... Obrigado!!

    ResponderExcluir
  16. Oi Flor! Não sei o que estou fazendo de errado, mas o link da foto não vai :(. Usei o TinyPic e o link não está funcionando

    ResponderExcluir
  17. Oi Renata segui todos os passos para por a foto, porém ela fica enorme e quadrada. Oq será que estou fazendo de errado?
    bjos e desde ja agradeço

    ResponderExcluir
  18. Oi Renata, parabéns pelo blog. Obrigada pelas dicas, estou usando o template e amando . Beijinhos linda

    ResponderExcluir
  19. Rê!! Obrigada! Consegui alterar a minha foto depois desse tutorial <3

    ResponderExcluir
  20. Renata, muito obrigada!!! Comecei o blog ontem,e seus tutoriais foram uma ajuda e tanto.. a propósito estou usando um layout seu e só sou gratidão por você ajudar como pode a quem tá começando. Se poder depois da uma passadinha pra ver como ficou, por que eu não saio mais daqui ahhahahaa.
    http://falaiamanda.blogspot.com.br/

    ResponderExcluir
  21. obrigadaa <3 me ajudou demais!

    www.littlebigme.com.br

    ResponderExcluir
  22. Renata, as fotos não carregam no meu blog.. o que eu faço?

    ResponderExcluir
  23. OI Renata, adorei suas dicas, porém quando carrego a foto no site que voce recomendou ela fica enorme e quadrada. Não consigo que arredonde. O que estaou fazendo de errado?

    ResponderExcluir
  24. Obrigada! Lindo seu trabalho como blogueira.

    ResponderExcluir
  25. Me ajudou muito, já tinha visto um monte de tutoriais e nada tinha dado certo, muito obrigado mesmo.

    ResponderExcluir
  26. Parabéns pelo excelente blog,sempre encontro muita coisa legal por aqui.
    Também gostaria de parceria.Meu e mail é leilamaria266@gmail.com
    Blog da Amizade /www.amigosdeleilanina.com.br
    Um abraço.

    ResponderExcluir
  27. Olá
    Devo ser um caso perdido viu...ñ conseguir de jeito nenhum!
    A foto ñ ficou rwdonda e ficou enorme, os icones das rwdes sociais ñ apareceram. Aff

    ResponderExcluir
  28. que pena segui certinho nao aparece nem a foto e nem os icones das redes sociais

    ResponderExcluir

Mande seu comentário, criticas, elogios ou sugestões.
Responderei o mais rápido possivel.
Um forte abraço a todos vocês!