Oii gente!!
E adivinhem? O meu 1º Layout Free está indo bem, e se der, libero no próximo final de semana no máximo.
Mas hoje, o tutorial é para blogger, e esse é um tuto que eu sei que muita gente quer.
Então, clique em Leia Mais para ver como é que se coloca fontes diferentes no blogger!
No título do Blog:
b) Abaixo na página, ira aparecer um link (xx), copie ele e vá em Modelo>Editar HTML e pesquise por <head> e cole o link acima da tag que você procurou.
c) Agora pesquise por .Header h1 { e você provavelmente vai encontrar algo assim:
.Header h1 {
font: $(header.font);
color: $(header.text.color);
}
Substitua esse código por esse:
.Header h1 {
font-family: Tangerine; /* Nome da fonte */
font-size: 100px; /* Tamanho da Fonte */
color: #cordafonte; /* Cor da Fonte */
text-align: center; /* Alinhamento do Texto */
}
d) Substitua: o azul pelo nome da fonte que você instalou e o rosinha pela sua preferência.
e) Visualize para ver se está certinho e salve.
Na sidebar
b) Abaixo na página, ira aparecer um link (xx), copie ele e vá em Modelo>Editar HTML e pesquise por <head> e cole o link acima da tag que você procurou.
c) Agora pesquise por h2 { e você vai encontrar algo assim:
h2 {
font: $(widget.title.font);
color: $(widget.title.text.color);
}
e substitua por:
.sidebar h2 {
font-family: Tangerine; /* Nome da fonte */
font-size: 100px; /* Tamanho da Fonte */
color: #cordafonte; /* Cor da Fonte */
border-bottom: 1px dashed #cordalinha; /* Borda de baixo, se não quiser apague */
background: #cordobg; /* Cor de fundo */
text-align: center; /* Alinhamento do Texto */
}
d) Troque o colorido de acordo com o seu gosto e o azul pelo nome da fonte.
*Alguns efeitos para linha:
dashed: tracejado
dotted: pontilhado
solid: linha normal
e) Caso não queira fundo sólido e sim imagem, troque
background: #cordobg; /* Cor de fundo */
por
background: url(LINKDAIMAGEM) no-repeat center;
height: 30px;/*Altura da imagem*/
width: 200px; /*Largura da imagem*/
f) Troque o azul pelo o link da sua imagem e o rosinha pela sua preferência e de acordo com o blog.
g) Visualize para ver se está tudo certo e salve.
No título do Post
b) Abaixo na página, ira aparecer um link (xx), copie ele e vá em Modelo>Editar HTML e pesquise por <head> e cole o link acima da tag que você procurou.
c) Agora pesquise por h3.post-title a { e você provavelmente vai encontrar algo assim:
h3.post-title a {
font: $(post.title.font);
color: $(post.title.text.color);
}
Substitua esse código por:
h3.post-title a {
font-family: Tangerine; /* Nome da fonte */
font-size: 100px; /* Tamanho da Fonte */
color: #cordafonte; /* Cor da Fonte */
background: #cordobg; /* Cor de fundo */
text-align: center; /* Alinhamento do Texto */
}
d) Substitua: o azul pelo nome da fonte que você instalou e o rosinha pela sua preferência.
e) Caso não queira fundo sól de cor e sim imagem, troque
background: #cordobg; /* Cor de fundo */
por
background: url(LINKDAIMAGEM) no-repeat center;
height: 30px;/*Altura da imagem*/
width: 200px; /*Largura da imagem*/
f) Troque o azul pelo o link da sua imagem e o rosinha pela sua preferência e de acordo com o blog.
g) Visualize para ver se está tudo certo e salve.
Esse tuto ficou um pouquinho longo, né?! Mas espero que vocês tenham gostado!
Até a próxima, beijinhos!
Já conheço o tutorial! é um dos mais uteis da blogosfera!
ResponderExcluirKüsses
Visite o Teens Forever :3 || Portfólio :3