Templates em HyperCode

Entenda e use Templates em HyperCode

Templates são recursos do HyperFluxCMS que permitem reaproveitar trechos de código como se fossem blocos de construção.

Uma das principais funcionalidades do HyperFluxCMS são os chamados "Templates". Templates são blocos de código que modelam blocos do site e que são reutilizáveis, repetíveis e personalizáveis.

Assim como as postagens, um template é um bloco de código escrito em HTML, HyperCode, HyperLite ou uma combinação de duas ou três delas. O mais comum é que sejam escritas em HTML ou HyperCode.

Um template pode representar uma página inteira ou um pedaço dela. Pode ser também um bloco que se repete por um número determinado ou indeterminado de vezes.

Um template pode, inclusive, incluir outros templates dentro dele.

Mas um template não é apenas um bloco de código fixo. Se fosse assim, seria pouco útil. Mas um template é muito mais do que isso. Ele permite que certas partes do código sejam substituídas por texto ou conteúdo variável que é gerado automaticamente caso a caso.

Por exemplo, a página que mostra resultado da Busca em um site HyperFluxCMS é um template. E cada bloco com descrição de cada postagem exibida nessa página também é um template.

O HyperFluxCMS suporta 2 tipos de templates: os top-level e os low-level

Os templates do tipo Top-Level são aqueles que são usados como modelos para páginas. A página de buscas ou a página inicial do site são exemplos de templates top-level.

Já os templates low-level são usados como blocos dentro de páginas. Por exemplo, o rodapé da página, uma área que contenha um menu de navegação, um item na página de busca, etc.

O que informa ao HyperFluxCMS se um template é top-level ou low-level são as configurações do template na página de administração do site.

Entenda melhor o uso de Templates em Templates

Tag [template]

Para usar, "chamar" ou inserir um template em uma postagem ou outro template, usa-se a tag template. Ela informa o nome do template e as propriedades opcionais.

Sintaxe:

A tag template é auto-contida, ou seja, ela NÃO PRECISA e NEM DEVE ser usada em pares "abrir/fechar". Deve ser usada simplesmente a tag e pronto.

Propriedades

A propriedade name é a única que é obrigatória. Ela indica o nome do template a ser usado. Deve obrigatoriamente ser um nome de template existente no site, como large-post-list-item.

Todas as demais propriedades são opcionais e não possuem nome nem significado definido aqui, pois variam de acordo com o código de cada template.

Propriedade anônima

A propriedade "name" pode ser omitida e o nome pode ser informado diretamente após o nome da tag.

Exemplo:

equivale a

Propriedades opcionais

Para a Tag template não há uma lista de propriedades opcionais predefinidas. Elas vão variar caso a caso dependendo do que o código do template use.

As propriedades adicionais são chamadas de Parâmetros.

Veja Usando Variáveis e Parâmetros.

Por exemplo, se o site tiver existe um template chamado borderbox para mostrar uma caixa de texto com bordas e determinado texto, e esse template tenha o código:

Ao se usar o template, deve-se passar o parâmetro @p:text como propriedade chamada texto.

Isso gerará na página sendo acessada o código HTML referente ao template borderbox substituindo o @p:text por "Olá, Mundo".

A tag template NÃO ACEITA diretamente as propriedades id, class e style. Eles PODEM ser informados nas propriedades de chamada, mas só terão efeito se essas propriedades forem utilizadas dentro do código do template.

Ou então, podem ser feitos ajustes personalizados da aparência, apresentação e comportamento do componente devem ser feitas editando o template ou a folha de estilos CSS.

Somente template low-level devem ser chamadas, dentro de páginas ou templates top-level.

Tag [header]

A Tag header é um tipo especial de template que normalmente é usada para indicar que, naquele ponto do código, o HyperFluxCMS deve inserir o código referente ao cabeçalho padrão das páginas de conteúdo.

A Tag header é nada mais do que um "Template" já com algumas características pré-programadas. No entanto, nada impede que elas sejam personalizadas, seja através das folhas de estilos CSS do site, seja através de personalização pontual através de JavaScript e/ou propriedades class e style.

O componente header é simplesmente um bloco do tipo template, mas com a propriedade "name" pré-configurada para ser "header", o que faz com que seja usado o template com esse nome.

A tag header é auto-contida, ou seja, ela NÃO PRECISA e NEM DEVE ser usada em pares "abrir/fechar". Deve ser usada simplesmente a tag e pronto.

A tag header NÃO ACEITA diretamente as propriedades id, class e style.
Elas PODEM ser informados nas propriedades de chamada, mas só terão efeito se essas propriedades forem utilizados dentro do código do template.

Ou então, podem ser feitos ajustes personalizados da aparência, apresentação e comportamento do componente devem ser feitas editando o template ou a folha de estilos CSS.

Tag [footer]

A Tag footer é um tipo especial de template que normalmente é usada para indicar que, naquele ponto do código, o HyperFluxCMS deve inserir o código referente ao rodapé padrão das páginas de conteúdo.

A Tag footer é nada mais do que um "Template" já com algumas características pré-programadas. No entanto, nada impede que elas sejam personalizadas, seja através das folhas de estilos CSS do site, seja através de personalização pontual através de JavaScript e/ou propriedades class e style.

O componente footer é simplesmente um bloco do tipo template, mas com a propriedade "name" pré-configurada para ser "footer", o que faz com que seja usado o template com esse nome.

A tag footer é auto-contida, ou seja, ela NÃO PRECISA e NEM DEVE ser usada em pares "abrir/fechar". Deve ser usada simplesmente a tag e pronto.

A tag footer NÃO ACEITA diretamente as propriedades id, class e style. Elas PODEM ser informados nas propriedades de chamada, mas só terão efeito se essas propriedades forem utilizadas dentro do código do template.

Ou então, podem ser feitos ajustes personalizados da aparência, apresentação e comportamento do componente devem ser feitas editando o template ou a folha de estilos CSS.

Tag [post]

A Tag post é um tipo especial de template que normalmente é usada para exibir informações resumidas de uma postagem obtida através de uma operação de busca, pela página de busca ou na página inicial do site.

A Tag post é nada mais do que um "Template" já com algumas características pré-programadas. No entanto, nada impede que elas sejam personalizadas, seja através das folhas de estilos CSS do site, seja através de personalização pontual através de JavaScript e/ou propriedades class e style.

A tag post é auto-contida, ou seja, ela NÃO PRECISA e NEM DEVE ser usada em pares "abrir/fechar". Deve ser usada simplesmente a tag e pronto.

A tag post NÃO ACEITA diretamente as propriedades id, class e style. Elas PODEM ser informados nas propriedades de chamada, mas só terão efeito se essas propriedades forem utilizadas dentro do código do template.

Ou então, podem ser feitos ajustes personalizados da aparência, apresentação e comportamento do componente devem ser feitas editando o template ou a folha de estilos CSS.