Os Elementos de Página do Blogger

Ao seguir um tutorial para instalar um recurso, ou fazer alguma personalização no seu blog, com certeza alguns leitores se deparam com determinados termos que, muitas vezes sequer sabem o significado ou sabem onde localiza-los.
Percebi que muitos usuários iniciantes tem dúvidas a respeito da localização de determinados elementos, e muitas vezes não sabem nem o que significam estas expressões. Pensando nisso, eu já publiquei um artigo com algumas explicações básicas sobre os Elementos do Blogger , onde trata a respeito dosElementos básicos do Blogger e suas variáveis e iniciei a serie de artigos: Aprendendo CSS e HTML.
Neste artigo veremos sobre os Elementos de Página.

O que são Elementos de Página:

Elementos de Página é o corpo do Blog.
Para acessar os elementos de página, devemos clicar no menu “Layout no painel do Blogger.

Entendendo e conhecendo as seções nos elementos de página

O Layout do Blogger é formado por “Seções e itens”. As seções marcam as áreas da página.
Cada seção (section) é representada pela tag: <b:section>
Cada “section” possui um “ID” especificado que nomeia o elemento da seção( este ID deve ser único) seguida de uma “class“. Em cada seção possui alguns atributos e é através deles que podemos determinar a quantidade de itens permitidos na seção e se permitiremos a inclusão de um “elemento da página” nesta seção.
Você pode adicionar vários elementos de página nas seções (section) existentes no layout do blog clicando em “Adicionar um gadget”

Para melhor entendimento, vejamos um exemplo do código padrão referente a seção do cabeçalho:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<--restante do código-->
</b:section>

Desmembrando o código acima:
b:section ? é a tag de abertura da seção.
class=’header’ ? descreve o grupo existente dentro do elemento “cabeçalho”
id=’header‘ ? identifica e especifica o cabeçalho como elemento único.
maxwidgets=’1′ ? determina a quantidade de itens permitido na seção “header”, ou seja, determina a quantidade de gadgets que você poderá incluir dentro da seção do cabeçalho. Neste exemplo, o nº 1 significa que só pode ser incluido um gadget.
showaddelement=’no’ ? o atributo “no” determina que a seção do cabeçalho não permitirá a inclusão ou movimentação de elementos de página. Para que a seção permita incluirmos elementos de página, devemos trocar o “no” por “yes“.

Se no atributo “showaddelement” estiver estipulado o “yes”, significa que você pode organizar os elementos da forma que preferir, basta clicar no elemento que deseja mover e arrastá-lo e soltá-lo onde quiser.
Um exemplo prático: no artigo que eu publiquei ensinando Como instalar widget acima da coluna de postagens , notem que ao localizar a tag referente à seção “main” onde está escrito showaddelement=’no’ eu informo que deve-se trocar por showaddelement=’yes’, justamente para que o blogger passe a aceitar a adição de um gadget acima da coluna de postagens, que neste caso faz parte da seção “main-wrapper”. Se deixar a opção showaddelement=’no’ você não poderá incluir um gadget naquele local.

Os espaços destinados a inserir os elementos nas seções, são chamados de “Gadgets” (Widgets).
Você pode adicionar vários elementos de página, clicando em “Adicionar um gadget”. Abrirá um pop-up para você selecionar e escolher quais elementos devem ser adicionados. Clique em “Adicionar” para colocar cada determinado elemento no seu blog.

Após instalados no elemento de página, os gadgets podem ser movidos para cima, para baixo, para os lados. Você poderá posicioná-lo onde preferir.
De todos os gadgets existentes, o mais usado é o “html/javascript”.
É nesse gadget(ou Widgets) que podemos inserir qualquer código, desde que seja em linguagem html ou em javascript.

Sempre que for inserir um gadget, deverá clicar em “adicionar gadget” no local onde você quer inserí-lo.
Por exemplo: se quer inserir um código javascript e quer que ele apareça na sua coluna sidebar, você deverá clicar em “adicionar gadget” na seção da coluna “sidebar”, escolher a opção “html/javascript” e colar o código lá dentro.

Sempre que você for inserindo novos gadgets (widgets), sempre é bom conferir as alterações, clicando em visualizar, antes de salvar qualquer modificação. Assim, se algo saiu errado, basta você clicar em “limpar modificações” que tudo que não foi salvo, voltará ao estado anterior.