E hoje eu venho com um tutorial, muita fácil e que faz toda diferença na hora de editar seu blog
SOBRE
MIM COM REDES SOCIAIS, CONFIRA O VÍDEO, NO FIM DO POST
Passo
1
Primeiro você precisa ir em "Layout" e
adicionar um "HTML/JavaScript" e logo em seguida, cole o seguinte
código:
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>
Fim do Tutorial
*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
Assista vídeo com tutorial

Nenhum comentário:
Postar um comentário