Perfil Quem Sou Eu personalizado para Blogs












Já tinha feito um artigo onde ensino como criar um perfil personalizado aqui mas resolvi fazer outro artigo, com outros modelos diferentes, espero que você goste !

É muito comum sempre ter um perfil " Quem Sou Eu", com uma foto, uma descrição e ícones de redes sociais em diversos blogs  no começo da coluna do blog,  e alguns  blogueiros não tem, simplesmente pelo fato de não conseguir criar um perfil, por não ter conhecimento em html e css.

 Se esse for o seu problema veio ao lugar certo, disponibilizei alguns modelos prontos, você só precisa adicionar os links das redes sociais e dos ícones(disponibilizo eles também), sua imagem, escrever seu perfil e colocar no blog!


Escolha seu modelo favorito(veja todos os 08 modelos aqui), copie o código e baixe as imagens dos ícones de redes sociais.

 Aqui você pode vê sites para hospedar as imagens na internet, e aqui como hospedar no próprio Blogger, e aqui como colocar o gadget/html(o código do perfil que você vai copiar) no Blogger.



Depois que copiar  o código , cole em um bloco de notas e faça as seguintes alterações, altera o que está escrito, em seu nome, por seu nome claro e em seguida faça uma descrição, apagando o que está escrito.



Confira a imagem dos modelos ,  e logo abaixo de cada imagem clique no link para  copiar  o código e no outro  link para fazer download das imagens.  


 AVISO


Como todos os artigos do blog, é proibido repostar ele(copiar, colar e fingir que é seu), mas você pode utilizar alguns desses códigos para fazer um artigo desde que coloque a fonte, linkando para este artigo aqui.


Modelo 01





Copiar o código do modelo 01 clique aqui


Baixar os ícones  do modelo 01 clique aqui


Para ir no site  baixar outros tamanhos desse mesmo modelo clique aqui





Editar modelo 01






Tamanho da imagem altere nos seguintes código(altura) height='200' e (largura)width='200', pode trocar 200  pelo tamanho que queira, aumentando ou diminuindo o número.

Onde está escrito 'Sua Foto Aqui' , coloque o link da sua imagem dentro das aspas

Nessa parte  abaixo do código você vai vê o link da rede social, altere para sua rede social e onde está escrito "link Imagem do ícone do youtube Aqui" , troque pelo link do ícone da rede social, para tirar alguma rede social, é só tirar essa parte toda do código, mesma coisa para acrescentar.



<a href="https://www.youtube.com/" target="_blank"><img border="0" src="link Imagem do ícone do youtube Aqui" style="text-align: center;" /></a><br />











Modelo 02









Copiar o código do modelo 02 clique aqui


Baixar os ícones  do modelo 02 clique aqui


Para ir no site  baixar outros tamanhos desse mesmo modelo clique aqui





Editar modelo 02


Tamanho da imagem altere nos seguintes código(altura) height='300' e (largura)width='200', pode trocar pelo tamanho que queira, aumentando ou diminuindo o número.


Onde está escrito 'Sua Foto Aqui' , coloque o link da sua imagem dentro das aspas


style="border: 10px (altere o número de 10 aumentando ou diminuindo a borda)  outset  é o estilo da borda, caso queira outros estilos, veja abaixo qual palavra deve colocar no lugar. Para trocar a cor da borda, troque  #F08080 pelo código da cor que deseja, veja nossa tabela de cores aqui

mudar estilo da borda troque a palavra outset(borda em alto relevo)por alguma das palavras abaixo


solid  = borda contínua
double  = borda dupla
groove = borda entalhada
ridge  = borda em ressalto
none = nenhuma borda
hidden  =equivalente a none
dotted  = borda pontilhada
dashed = borda tracejada
inset   =borda em baixo relevo






Na parte do código   abaixo  você vai verá o link da rede social, altere para sua rede social e onde está escrito "LINK DA IMAGEM DO YOUTUBE AQUI" , troque pelo link do ícone da rede social, para tirar alguma rede social, é só tirar essa parte toda do código, mesma coisa para acrescentar.



<a href="https://www.youtube.com/" target="_blank"><img border="0" src="LINK DA IMAGEM DO YOUTUBE AQUI" style="text-align: center;" /></a><br />





Modelo 03







Copiar o código do modelo 03 clique aqui


Baixar os ícones  do modelo 03 clique aqui


Para ir no site  baixar outros tamanhos desse mesmo modelo clique aqui


Para editar esse modelo siga as orientações do modelo 01













Modelo 04








Copiar o código do modelo 04 clique aqui


Baixar os ícones  do modelo 04 clique aqui


Para ir no site  baixar outros tamanhos desse mesmo modelo clique aqui



Para editar esse modelo siga as orientações do modelo 01



Modelo 05






Copiar o código do modelo 05 clique aqui


Baixar os ícones  do modelo 05 clique aqui


Para ir no site  baixar outros tamanhos desse mesmo modelo clique aqui


Para editar esse modelo siga as orientações do modelo 02






Modelo 06







Copiar o código do modelo 06 clique aqui


Baixar os ícones  do modelo 06 clique aqui


Para ir no site  baixar outros tamanhos desse mesmo modelo clique aqui



Para editar esse modelo siga as orientações do  próprio modelo


Dentro do código do modelo você vai encontrar códigos assim


 .nome {/* Editar Estilo e cor do nome */

a frase que está dentro de  /*  */

é onde indica o local que você deve fazer a mudança, exemplo

color:  #BCD2EE;  /* cor do texto */

se você  mudar o código  #BCD2EE, por outra cor, vai mudar a cor do estilo do seu nome, veja opção de cores em nossa for na nossa tabela de cores .

Para mudar o formato da borda, é só modificar os números abaixo no seu código, troque os números e vá testando os resultados!

border-radius: 0% 50%; 0% 50%  /* arredondar bordas */


Se ficar alguma dúvida de como editar esse modelo é só deixar um comentário que tenho o maior prazer em te ajudar!









Modelo 07









Copiar o código do modelo 07 clique aqui


Baixar os ícones  do modelo 07 clique aqui


Para ir no site  baixar outros tamanhos desse mesmo modelo clique aqui



Para editar esse modelo siga as orientações do modelo 06

Para mudar a cor do fundo da imagem mude esse código #A9A9A9
E mudar a cor do fundo da descrição mude essa DarkGrey
Vá em nossa tabela, pegue o código da primeira cor e para mudar a segunda troque a palavra.







Modelo 08








Copiar o código do modelo 08 clique aqui




Para editar esse modelo siga as orientações do modelo 06, esse modelo não precisa colocar ícones das redes sociais, só o link delas e editar o nome.

Faça um perfil super fofo e deixe seu comentário, não esqueça, deixe seu comentário se usar algum dos códigos  <3, bjinhos lilás!

2 comentários