10 abril 2018

Quem sou eu no blog, como posso personalizar?

perfil no blog
No tutorial de hoje ensinarei como colocar um "Quem sou eu" na sidebar do seu blog. Para quem não sabe, esse quem sou eu nada mais é do que um perfil resumido sobre quem posta no blog. Nele você vai se descrever brevemente e fazer com que as pessoas queiram te conhecer melhor quando se identificarem com sua personalidade e com os assuntos que você aborda.

 

Quem sou eu personalizado:

Primeiramente, você precisa ir em "Layout" e adicionar um "HTML/JavaScript" e logo em seguida, cole o seguinte código:

<div class="perfil">
<div class="foto">
<img src="LINK-DA-SUA-FOTO" />

<p>Seu nome</p>
</div>
<div class="texto">
<br />
Quem sou eu? ESREVA UM BREVE RESUMO SOBRE VOCÊ AQUI. FALE SOBRE  O MOTIVO DE VOCÊ TER CRIADO O BLOG, SOBRE OS ASSUNTOS QUE VOCÊ ABORDA...

<br />
</div>

<div class="social">

<a href="SEU FACEBOOK" class="fa fa-facebook" target="_blank"></a>

<a href="SEU INSTAGRAM" class="fa fa-instagram" target="_blank"></a>

<a href="SEU PINTEREST" class="fa fa-pinterest" target="_blank"></a>

<a href="SEU CANAL NO YOUTUBE" class="fa fa-youtube-play" target="_blank"></a>

<a href="SEU TWITTER" class="fa fa-twitter" target="_blank"></a>

<a href="mailto:SEU ENDEREÇO DO E-MAIL" class="fa fa-envelope-o" target="_blank"></a>

</div>
</div>
<style type='text/css'>



.perfil{
}
.social {
display: table;
margin: auto;
}
.social a {
font-size: 15px;
text-align: center;
background:#222;
color:#fff;
width: 33px;
height: 32px;
 line-height: 34px;
display: inline-block;
border-radius: 50%;
margin: 5px 5px 0px 5px;
transition: 0.5s;
text-decoration: none;
}
.social a:hover {
background:#ff1492;
color:#fff;
}
.foto img{
    border-radius: 50%;
    width: 290px;
}
.foto p{
font-family: Segoe Script;
font-size: 52px;
margin: -60px 0 0 -1px;
text-align: center;
color: #222;
text-shadow: -1px -2px 9px rgb(255, 255, 255);
line-height: 47px;
}
.texto{
text-align: justify;
padding: 12px;
font-size: 12px;
font-family: verdana;
}


</style>


Veja também: Layout Free - Minimal Base + Update + novidades no blog 
                       Postagem Popular personalizada no blogger 
                       Menu no topo com redes sociais e barra de pesquisa


quem sou eu no blog

 Personalize do jeito que você quiser e logo em seguida clique em "Salvar".
A minha personalização ficou como na imagem ao lado, mas você deve mudar de acordo com o seu gosto.
OBS: Não esqueça de adicionar o link das suas redes sociais onde está pedindo


 Se você quiser personalizar mais o seu blog, acompanhe os outros tutoriais que tem aqui.
Se você gostou desse breve tutorial, comente aqui abaixo e dê sugestões para o próximo!

16 comentários:

  1. Acho ótimas suas dicas.
    big beijos
    www.luluonthesky.com

    ResponderExcluir
  2. ah que bacana! já quero tentar colocar essa assinatura no final dos meus posts!

    www.tofucolorido.com.br
    www.facebook.com/blogtofucolorido

    ResponderExcluir
    Respostas
    1. Tenta sim Lívia.
      Obrigada pela visita ❤

      Excluir
  3. Amei essa dica, favoritei a publicação para quando precisar mudar. Tutorial super necessário!

    Amei, beijos 😘
    http://meninaneemteconto.blogspot.com/

    ResponderExcluir
    Respostas
    1. Mudar as vezes é bom, mesmo sendo esses pequenos detalhes.
      Beijos ❤

      Excluir
  4. Achei sensacional a dica. Muito simples!
    Beijos

    https://glamour-02.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Que bom que gostou, é simples e muito fácil.
      Beijos!

      Excluir
  5. Que showww de dica! Vou tentar fazer, acho tão fofo blogs que tem <3

    Beijinhos
    tipsnconfessions.blogspot.com

    ResponderExcluir
    Respostas
    1. Tenta sim, é bem fácil e você vai conseguir.
      Beijos <3

      Excluir
  6. Adorei a dica!
    Fiquei até com vontade de mudar meu blog ❤
    www.blogsereiando.com

    ResponderExcluir
    Respostas
    1. Salva o tutorial pra quando você resolver mudar haha
      beijos

      Excluir
  7. Haaaa que dica maravilhosa! Parabéns por disponibilizar esses conteúdos. Bjos

    Faça-me uma visita -> LEH BLOG | INSTAGRAM

    ResponderExcluir
    Respostas
    1. Que bom que gostou <3 Muito obrigada!

      Excluir
  8. Gostei muito dessa dica, mas tive um problema: os ícones das redes sociais ficaram totalmente pretos; não aparece o logo da rede. Você saberia o porquê?
    Abraços!

    https://garotadepersonalidades.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Provavelmente você não tem a fonte awesome instalada no seu blog, para instalar vá em TEMA > EDITAR HTML > abaixo de HEAD cole o seguinte código:
      link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css' rel='stylesheet'/

      OBSERVAÇÃO: No começo do código coloque < e no final do código coloque >

      Caso não funcione me avise :) Obrigada pela visita!

      Excluir