Estou feliz que tenham gostado no template free que fiz para vocês. Achei legal terem gostado e mais uma vez obrigada por estarem seguindo o blog. Em uma semana conseguimos 33 seguidores e estou bastante feliz com isso. Ah! E obrigada por divulgar o blog, Ana. :3
Gostaria de deixar claro, que estou livre para pedidos até terça-feira, dia de São Jorge. Minha escola é demais. E, se der, ainda posto na quarta por não ter prova de geografia neste dia. Mas enfim, quero dizer que podem 'tacar' pedidos. Vou fazê-los.
Tutorial 1: Personalizando H2.
Pediram-me para ensinar a personalizar o H2 das postagens (Título/Cabeçalho). Para quem não sabe, é essa parte que eu coloca nas postagens com, como exemplo, 'Tutorial 1: Personalizando H2'. Caso você não tenha entendido, clique aqui.
Para começar, procure por /* Headings. É nele que abriga os códigos que vamos editar e outros, como o da data das postagens. Pode ver, que baixo dessa seção, há um h2 {, correto?
Selecione de h2 { a } e cole no lugar, esse código.
h2 {
font-family: fonte_aqui.;
color: #cor_do_título;
font-size: tamanho_do_títulopx;
border-bottom: 2px solid #cor_da_borda;
text-transform: uppercase;
}
Edite as partes correspondentes. Clique aqui, para mudar o estilo da borda e a transformação do texto. Para conseguir fontes, basta seguir este tutorial. Ele mostra como o usar o site do próprio 'Google' de fontes.
Tutorial 2: Fonte Pixel na sidebar.
Vocês devem ter notado que uso uma fonte pixel na sidebar, em vez da normal. Usei também isso no template free. Caso queiram entender o que é, exatamente, é só dar uma olhada na sidebar ou nesse print do modelo que uso atualmente na sidebar.
Para usar, primeiramente deves procurar por .sidebar .widget {. Selecione desde .footer-inner .widget,
.sidebar .widget { até }. Apague esse código e no lugar dele, cole o abaixo.
.footer-inner .widget,
.sidebar .widget {
font-family: "silkscreen";
font-size: 8px;
color: $(widget.text.color);
}
Para fazer a fonte funcionar, terá que colar um código acima de ]]></b:skin>.
@font-face { font-family: "silkscreen"; src: url('http://static.tumblr.com/0xqvkot/7jqmgsn0m/pf_arma_five.ttf'); }
Espero que tenham entendido o tutorial. Caso aja dúvidas, é só perguntar por comentário ou pela ask. Sei que ficou meio embolado, mas é que ainda preciso me acostumar com postagens grandes.
Kissus.
Adorei os tutoriais. Eu adoro fontes pixeis, tento usar em todo lugar uheueh' @justlikethat
ResponderExcluirObrigada.
Excluir- Também rsrs'
Adorei os tutoriais, talvez eu use o 2, para fazer o layout do vencedor da minha gincana
ResponderExcluirOk, você quem escolhe. :)
ExcluirEu não entendi a parte do H2, o link não funciona. Me explica mais
ResponderExcluirPrimeiramente, deves clicar na primeira setinha que aparece em teu HTML. Quando clicar nela, uma série de código abaixo.
ExcluirDê CTRL+F e cole o código que pedi para procurar. Logo, faça os comandos e modifique as partes na qual falei.
- Pronto!
Qualquer dúvida, avise-me.
Aaah, eu amo muito essa fonte pixel! *uu*
ResponderExcluirAdorei o tutorial, essas fontes nunca funcionavam quando eu tentava colocar.
Chu~♡
mikicandy.blogspot.com
Eu também u3u
Excluir- Obrigada :) Espero que dê certo.
Amei os dois tutoriais, são suuuuper úteis!
ResponderExcluirA fonte pixel é tão fofinha, fica linda em menus! Só não esperava que ficasse tão amor nos títulos da sidebar! *u*
Beijinhos, Bunny. ♥
Bunny Days [ no perfil ]
Obrigada :3
Excluir- É mesmo, fica lindo. u3u
Existe tutorial melhor?! não existe! amei, usarei com certeza, perfeito!
ResponderExcluirAdolescente Nerd
Obrigada, Hannah :3
Excluir- Espero que goste.
*--* Adorei o tuto muito util.. ><
ResponderExcluirVou reblogar okay? >< com os creditos claro
Obrigada :3
Excluir- Ok, tudo bem.