sexta-feira, 15 de novembro de 2013

Fundo de papel nas postagens

|| ||


















Consegui um tempinho e vim aqui postar para vocês esse tuto tão pedido. Hoje eu vou ensinar como colocar como plano de fundo da área de postagens, uma textura de papel, parecida com a que eu uso. O resultado final será assim:



Vamos começar? Então abra seu HTML. Aperte ctrl+F e procure por:

.main-inner .column-center-outer {
  background: $(post.background.color) $(post.background.url) repeat scroll top left;
  _background-image: none;
}

Procure pela primeira linha para facilitar. Quando achar, apague todo o código e coloque esse no lugar:

.main-inner .column-center-outer {
  background: url(URL da imagem) repeat-Y;
}
Agora é substituir pela url da imagem que você quiser.

Aqui que entra a correção. Vocês viram que quando coloca a imagem, a letra do post fica por cima da beirada do papel não é? Para resolver isso, aperte ctrl+F e procure por: .main-inner .column-center-inner {

Substitua o trecho:
padding: $(content.posts.padding) 0; 
por esse código abaixo:
padding: 10px 10px 10px 20px;
Você pode ter que alterar o valor em roxo de acordo com a imagem que você usar.

Abaixo tem duas imagens que você podem usar, uma menor e outra maior (para blogs mais largos). Clique nas imagens para salvar do tamanho normal e usar.









Espero que tenham gostado do tuto, e se usarem tanto as imagens como o tutorial, creditem!

Nenhum comentário

Postar um comentário