Pular para o conteúdo principal

Do it yourself: Não é tão difícil assim #3


Headings
As "heading tags" (tags de cabeçalho) são bastante importante para o blog. Elas controlam a estrutura geral do seu layout, informando aos mecanismos de busca qual é o conteúdo que tem mais importância na página. A mais importante é a tag h1 e a menos importante é a tag h6.

No blogger a tag h2 refere-se a data da postagem e ao título dos widgets, portanto, poder ser que ao atribuir a tag h2 como “título” dentro de seu post, a fonte fique com a mesma formatação css referente a data ou aos títulos de seus widgets. Enquanto a tag h3 é representada pelo título da suas postagens. De uma forma mais fácil:

H1 - O títilo do blog;
H2 - O título de cada gadget da sidebar e a data;
H3 - Título da postagem;
H4 - Fica mais escondidinho, mostra o número de comentários ao abrir uma postagem.

Post
Data: No template Minima, a data está representada pelo h2.date-header.
Post: É o segundo elemento do código. Se refere a toda a área dos posts. No template Minima está representado por: .post.

  • .post-body – se refere somente ao corpo do post. Os estilos que você aplicar neste trecho valerão somente para o corpo do texto das postagens. 
  • .post p: Representa o paragrafo do post. Neste trecho você pode adicionar um recuo de texto, e para isso use a propriedade text-indent.
  • .post h3: O titulo do post. Nesta parte que você pode acrescentar imagem, borda, tamanho da fonte, cor da fonte, alinhamento do texto, entre outros, para se aplicar a todos os títulos de suas postagem.
  • .post h3 a - Link ativo.
  • .post h3 a:visited - Link já visitado.
  • .post h3 a:hover - Mouse em cima

Imagem do Post: É representado pela tag .post img. Todos os efeitos que você quiser adicionar nas suas imagens das postagens devem ser acrescentados nessa tag. Se no seu template não tiver este trecho, você poderá acrescentá-lo e incluir estilos a sua maneira.

Rodapé do Post: No template Mínima é representado pela tag .post-footer.
Links dos comentários: É representado pela tag .comment-link.
Blockquote (citações): Pode ser modificado na tag .post blockquote.

Esse são as tags básicas da área de postagem. Na próxima semana, preparei uma postagem para a área dos comentários que precisa de uma pequena alteração no código. Então será um post mais longo.

Beijos

Comentários

  1. OOOOOOOOOOOOOOOOI, MIIIIIIIIIIIIIIIIIIIIIIIIIIIIIII! Lindooooona! Tuuuuuudo bom? Esperoooo que sim, hahaha! *-* ♥ Meu Deuuuuuuuuus, que post mais maravilhoooooso! Confesso que, no começo, tive dificuldade de entender o que eram essas tags, mas depois fui ver o que realmente era, hahaha! Achei muuuuuito interessante! Eu não achei que esse tal de .post h3 fizesse parte desse conjunto de tags, hahaha! Muuuuuuuuuito legal isso, viu? Gostei deemaaaaaaaaais, Miiiiiiiiiiiii! Você é muuuuuuuuito divaaaa! Haha, arrasou! ♥ Com certeza, este post irá ajudar muuuuuuitas pessoas! Me ajudou, haha! *-* Ansiooooosa pelo post dos comentáriooos! Este eu ainda tenho algumas dúvidas, hahaha!

    Um enoooooorme e grande beijo,

    Juu-Chan || Nescau com Nutella

    ResponderExcluir
  2. Amei o post; me ajudou a esclarecer umas coisas. Beijos.
    Visite - Tão Bom Quanto Pizza

    ResponderExcluir
  3. Adorei, Mih, você e estes tutoriais é muito amor no coração. Isto é utilidade pública, o mundo devia está sabendo destas postagens, hahaha. Foi muito esclarecedor <3 Eu usava a maioria no modo random mesmo, porque não entendo direitinho este tipo de coisa. Adorei adorei. Beijocas <3

    Chel Lima
    http://corujando.org

    ResponderExcluir
  4. Muuuito bom o post Mih! Ajudou muuuito, vou até salvar nos favoritos!! hahahaha.
    Sempre me confundo com essas tags u.u
    Beijãooo

    fantasiand-o.blogspot.com

    ResponderExcluir
  5. ensina como colocar esse menu no topo com opacidade.

    ResponderExcluir

Postar um comentário