Barra Separadora e Botões Compartilhar
Konnichiwa people! O que estão achando do novo Layout? >.< . Não tá todo pronto, só falta algumas coisinhas, mas os principais já estão feitos! Falta Link me's novos, editar essa parte do ''O que ando fazendo'', e alguns detalhes que quero colocar ^.^ .
Hoje fui teimosa, porque mesmo com esse tempinho frio, resfriada, com febre e tudo que vocês possam imaginar, fiquei aqui na frente do pc, editando e procurando maneiras de personalizar o blog kk' eu acho muito divertido mexer com HTML, editar barrinhas e etc. aaatim! *espiro*
Então já que to nesse clima de editar *e espirar*, resolvi postar um tutorial de como colocar Barra Separadora e Botões de Compartilhar de redes sociais. No caso a dos botões foi lá do lindo e perfeito blog Reino Kawaii, mas com uma mudança, deixar também centralizado.
E a Barra Separadora é aquela barra que divide a postagem e os botões de compartilhar, melhor dizendo Barra Share On/Compartilhe . Não achei um tutorial ensinando, então eu mesma inventei e deu certo! ^.^
Espero que gostem!
Let's go?
Primeiramente faça um backup do seu template, caso de algo errado, terá como recuperar.
- Barra Separadora
Vá em Modelo - Editar Html e aperte Ctrl+F , e procure por :
<div class='post-footer-line post-footer-line-3'/>
Após acha-lo copie abaixo dele:
<center><img height='30px' src='URL DA BARRINHA' width='750px'/><img/></center>
Explicando:
URL DA BARRINHA: é onde você vai colar o link da imagem.
Height/Width: Height é a altura que a imagem da barra irá ficar, e o Width é a largura, caso a imagem fique grande, ou pequena é só mudar a numeração delas.
Opções de Barrinhas Share On/Compartilhe:
- Botões Compartilhar
Agora abaixo do codigo acima, depois de <img/></center> cole:
<center><!-- share buttons -->
<a expr:href='"http://www.facebook.com/share.php?u=" + data:post.url' target='_blank'><img src='URL-DA-IMAGEM-DO-FACEBOOK' title='Facebook'/></a>
<a expr:href='"http://twitter.com/share?url=" + data:post.url' target='_blank'><img src='URL-DA-IMAGEM-DO-TWITTER' title='Twitter'/></a>
<a expr:href='"https://plus.google.com/share?url=" + data:post.url' target='_blank'><img src='URL-DA-IMAGEM-DO-GOOGLE' title='G+'/></a>
<!-- share buttons --></center>
Explicando:
Onde está destacado de rosa, é onde você irá colocar o link do ícone (Facebook, Twitter e G+) da sua preferencia.
Opções:
Fácil não? ^.^
Ja ne!
