A estrutura de um modelo do Blogger

A estrutura de um modelo do Blogger

O tutorial original sobre essa matéria, foi publicado site OurBloggerTtemplates. Fiz resumo para compartilhar com vocês e recomendo que visitem o site, que oferece tradução automática clicando na bandeira no topo da página.

Conhecendo a estrutura básica, você pode facilmente obter  idéias de como adaptar aos modelos existentes, um modelo de design, e como transformá-lo em uma estrutura diferente. Veja um exemplo de modelo muito comum:






Entendendo os blocos contentores:

• Body : É o corpo de seu modelo (basicamente tudo o que cobre a tela do computador).

• Outer-wrapper : Aquí demarcado pela cor cinza, é o espaço que abrange todo o modelo. Dentro dele você constrói blocos menores. Neste exemplo  de Outer-wrapper,  estão o cabeçalho (header), conteúdo (main, post e sidebar) e rodapé.

• Header :  Este bloco é o cabeçalho do seu blog  e  dentro do cabeçalho, você tem outros sub-blocos - Header Title (título), Header Description (descrição), e outros, como os banners do Adsense, uma barra de menu, etc. Então, para conter o header e os sub-blocos  cria-se  geralmente um Header-wrapper que divide tudo dentro.

• Content :  é todo o conteúdo abaixo do cabeçalho é o content-wrapper - basicamente o bloco recipiente mais importante de todos. Dentro desse espaço estão os recipientes Sidebar (1,2 ou qualquer número de barras laterais) e no recipiente principal (que contém as suas mensagens, comentários ou alguns anúncios).

• Footer : Como na seção de cabeçalho, você também precisará de um footer-wrapper para conter outros sub-blocos na seção de rodapé.
• Main :  Main-wrapper  é o espaço  externo na secção principal que vai dentro de content-wrapper. Dentro deste main-wrapper são os blocos de Post, bloco de comentário, Data Cabeçalho e outros widgets criados a partir da opção “Adicionar Gadget” .

• Sidebar : é o bloco que contém todos os widgets laterais, ex: About Me, Etiquetas, Arquivo, Texto, HTML, Adsense, etc . Em um modelo padrão do Blogger, você encontrará geralmente só 1 lateral - daí a coluna 2-modelo (principal e Sidebar). Depois de entender a estrutura, é realmente fácil de adicionar  outras colunas (sidebars) Há vários tutoriais que ensinam esse procedimento. Os modelos mais comuns tem  2 ou 3-colunas laretrais (como o modelo) .

 

• Blog Post : Este bloco contém as coisas importantes - o seu Posts Títulos, Post, Author Post, rótulos, etc

Uma outra maneira de ver como funciona essa estrutura, é do ponto de vista hierárquico a partir do maior “recipiente”:

Body

• Outer-wrapper

• Header-wrapper
  
  
  
  • Blog Title
  • Blog Description
  • Outer widgets

• Content-wrapper
• Sidebar-wrapper (1,2,3...)
• Main-wrapper

• Date Header
• Posts
  
  
  • Post Title
  • Post Content (o cale Post Body)
  • Post Footer (Author, Labels, etc)

• Comments
• Feed Link
• Other widgets (mostly ad units)

• Footer-wrapper
  
  
  • Footer text (avisos, direitos autorais, etc)
  • Outras widgets

Depois de compreender essa estrutura básica, será mais fácil  aprender sobre os códigos do Blogger.. O surpreendente é que mesmo com pouco conhecimento em programação web, você pode personalizar seu modelo  apenas pela compreensão da estrutura básica e algum conhecimento de linguagem HTML e CSS. Procure aprender e não tenha medo de se aventurar! Faça um blog de testes e vá fundo!

Posted in: Blogger