Etiquetas HTML 4D

4D v15.4

Etiquetas HTML 4D

O servidor web 4D lhe oferece um conjunto de etiquetas de transformação que permitem inserir as referencias as expressões ou variáveis 4D ou realizar diferentes tipos de processos ao interior de um texto fonte, chamado "template". Estas etiquetas são interpretadas durante a execução do texto fonte e geram um texto de saída.

Este princípio é utilizado geralmente pelo servidor web 4D para criar Páginas semi dinâmicas.

Estas etiquetas se inserem como comentários HTML ( ) no texto fonte. No entanto, outros comentários tais como  são possíveis.

As etiquetas de transformação 4D disponíveis são as seguintes:

4DTEXT, para inserir as variáveis e expressões 4D,
4DHTML, para inserir o código HTML,
4DEVAL, para avaliar toda expressão 4D,
4DSCRIPT, para executar um método 4D,
4DINCLUDE, para incluir uma página dentro de outra,
4DBASE, para modificar a pasta por padrão utilizada pela etiqueta 4DINCLUDE,
4DIF, 4DELSE, 4DELSEIF e 4DENDIF, para inserir as condições no código etiquetado,
4DLOOP e 4DENDLOOP, para inserir loops no código etiquetado.

É possível combinar vários tipos de etiquetas. Por exemplo, a seguinte estrutura HTML é completamente viável:

<HTML>
...
<BODY>
<!--#4DSCRIPT/PRE_PROCESS-->         (Chamada de método)
<!--#4DIF (myvar=1)-->               (condição If)
   <!--#4DINCLUDE banner1.html-->   (inserção de uma sub página)
<!--#4DENDIF-->                     (Fim de if)
<!--#4DIF (mtvar=2)-->
   <!--#4DINCLUDE banner2.html-->
<!--#4DENDIF-->

<!--#4DLOOP [TABLE]-->               (Loop na seleção atual)
<!--#4DIF ([TABLE]ValNum>10)-->         (If [TABLE]ValNum>10)
   <!--#4DINCLUDE subpage.html-->   (Inserção Sub página)
<!--#4DELSE-->                     (Else)
   <B>Value: <!--#4DTEXT [TABLE]ValNum--></B><BR>
                              (Visualização de um campo)
<!--#4DENDIF-->
<!--#4DENDLOOP-->                  (Fim do loop)
</BODY>
</HTML>

Execução dos templates

A análise do conteúdo das páginas "templates" podem ser feitas de duas maneiras:

Utilizando o comando PROCESS 4D TAGS; este comando aceita um 'template' como entrada, assim como parâmetros (opcionais) e devolve um texto resultante do processamento.

Utilizando o servidor HTTP integrado de 4D: Páginas semi dinâmicas enviado por meio dos comandos WEB SEND FILE (.htm, .html, .shtm, .shtml), WEB SEND BLOB (BLOB de tipo text/html), [#cmd id="677"/] , ou chamados utilizando URLs. Neste último caso, por razões de otimização, as páginas que têm sufixos “.htm” and “.html” e NÃO são analisadas. Para forçar a análise das páginas HTML neste caso, deve adicionar o sufixo “.shtm” ou “.shtml” (por exemplo, http://www.server.com/dir/page.shtm). Para obter mais informação sobre este ponto, consulte a seção Páginas semi dinâmicas no capítulo Web Server.

4DTEXT

Sintaxe:  ou

A etiqueta  : Undefined  lhe permite inserir uma referência a uma variável ou a uma expressão 4D que devolve um valor. Por exemplo, se escreve (em uma página HTML):

<P>Bem-vindo a  : Undefined!</P>

O valor da variável 4D vtNomSite se inserirá na página HTML no momento de seu envio. Pode inserir uma variável de texto 4D no código HTML. Este valor é inserido em forma de texto simples, os caracteres HTML especiais tais como ">" se escapam automaticamente.

Também pode inserir as expressões 4D utilizando la etiqueta 4DTEXT. Pode inserir diretamente o conteúdo de um campo(), um elemento de array () ou um método que retorna um valor (). A conversão da expressão segue as mesmas regras que a conversão de uma variável. Além disso, a expressão deve cumprir com as regras de sintaxe de 4D.

Nota: A execução de um método 4D com 4DTEXT depende do valor do atributo “Disponível através das etiquetas e URLs 4D (4DACTION...)” definido nas propriedades do método. Para maior informação, consulte a seção Conexões de Segurança.

Mesmo que uma expressão possa conter diretamente as chamadas a funções 4D, não é recomendável por razões de localização. Por exemplo, , mesmo que seja interpretado corretamente com um 4D em inglês no será entendida por uma versão francesa. O mesmo aplica aos números reais (o separador decimal pode variar de um país a outro). Em ambos os casos, é preferível atribuir uma variável por programação.

Em caso de erro de interpretação, o texto inserido será da forma “ : ## erro # erro code”.

Notas:

Deve utilizar as variáveis processo.
Por razões de segurança é recomendado usar esta tag quando processando dados introduzidos de fora do aplicativo. Para prevenir a inserção de código malicioso, ver Notas de uso
É possível mostrar o conteúdo de um campo imagem. Entretanto não é possível mostrar o conteúdo de um elemento de array imagem.
É possível exibir os conteúdos de um cmapo imagem usando uma fórmula 4D. Por exemplo, escrevendo .
Geralmente você trabalhará com variáveis de Texto. Entretanto, pode utilizar as variáveis BLOB. Só necessita gerar os BLOBs em modo Texto sem comprimento.

4DHTML

Sintaxe:  ou

Como a etiqueta 4DTEXT, esta etiqueta permite avaliar uma variável ou uma expressão 4D e inseri-la em uma página como uma expressão HTML. Diferente da etiqueta 4DTEXT, esta etiqueta não converte os caracteres especiais HTML.

Por exemplo, esses são os resultados da inserção da variável texto 4D minhavar com as etiquetas disponíveis:

*Valor minhavar*	Etiquetas	Inserção na página web
minhavar:="<B>"	<!--#4DTEXT minhavar-->	<B>
minhavar:="<B>"	<!--#4DHTML minhavar-->	<B>

As expressões podem conter funções 4D, tais como por exemplo, Current date. Neste caso, recomendamos utilizar uma referência de tipo "<nom_comando>:C<num_comando>", para garantir que a expressão seja sempre interpretada corretamente (ver Referenciar os comandos 4D nas etiquetas).

No caso de um erro de interpretação, o texto inserido será da forma “ : ## erro # erro code”.

Nota: A execução de um método 4D com 4DHTML desde uma petição web depende do valor do atributo “Disponível através as etiquetas e URLs 4D (4DATION...)” definido nas propriedades do método. Para maior informação consulte a seção Conexões de Segurança.

Nota de compatibilidade: Essa etiqueta substitui 4DHTMLVAR a partir da versão 12.2 de 4D. A etiqueta 4DHTMLVAR ainda é compatível, mas devido a legibilidade de código, é recomendado usar a etiqueta 4DHTML para inserir no código HTML

4DEVAL

Sintaxe:  o 

A etiqueta 4DEVAL permite avaliar uma variável ou uma expressão 4D. Igual que a etiqueta 4DHTML existente, 4DEVAL não escapa os caracteres HTML ao retornar do texto. No entanto, a diferença de 4DHTML ou 4DTEXT, 4DEVAL lhe permite executar qualquer instrução 4D válida, incluindo atribuições e expressões que não devolvem nenhum valor.

Por exemplo, pode executar:

 $input:="<!--#4DEVAL a:=42-->" //atribuição

 $input:=$input+"<!--#4DEVAL a+1-->" //cálculo

 PROCESS 4D TAGS($input;$output)

  //$output = "43"

As expressões podem conter funções de 4D, tais como, por exemplo, Current date. Neste caso, lhe recomendamos que utilize uma referência do tipo "<nom_comando>:C<num_comando>", com o propósito de garantir que a expressão sempre seja interpretada corretamente (ver Referenciar os comandos 4D nas etiquetas).

Em caso de erro durante a interpretação, o texto inserido será da forma: “: ## error # código de erro”.

Nota: a execução de um método 4D com 4DEVAL desde uma solicitação web requer que a opção "Disponível através das etiquetas e URLs 4D (4DACTION ...)" se encontre definida nas propriedades do método. Para obter mais informação, consulte a seção Conexões de Segurança.

4DSCRIPT/

Sintaxe:

A etiqueta 4DSCRIPT lhe permite executar métodos 4D no momento do processamento do template. A presença do comentário HTML  provoca a execução do método MeuMétodo com o parâmetro MeuParam como string em $1.

Nota: Se a etiqueta for chamada no contexto de um proceso web, quando carrega a página, 4D chama ao On Web Authentication Database Method (caso exista). Se devolver True, 4D executa o método

O método retorna texto em $0. Se a string começa com o caráter de código 1, se considera como HTML (o mesmo princípio que para a etiqueta 4DHTML).

Nota: A execução de um método com 4DSCRIPT depende do valor do atributo “Disponível através das etiquetas e URLs 4D (4DATION...)” definido nas propriedades do método. Para maior informação, consulte a seção Conexões de Segurança.

As análises dos conteúdos da página é feita quando WEB SEND FILE (.htm, .html, .shtm, .shtml) ou WEB SEND BLOB (blob de tipo text/html) for chamada.
Lembre que em modo não contextual, a análise é também feita quando uma URL aponta para um arquivo que tenha a extensão “.shtm” ou “.shtml” (por exemplo http://www.server.com/dir/page.shtm).

Por exemplo, insira em uma página web semi dinâmica o comentário “Hoje é”. Quando se carregar a página, 4D chama ao On Web Authentication Database Method (se existir), depois chama ao método MEUMET e passa a string “/MEUPARAM” como parâmetro $1.

O método retorna texto em $0 (por exemplo “12/31/03”); a expressão “Hoje é <!--#4DSCRIPT/MEUMET/MEUPARAM––> se converte em “Hoje é 12/31/03”.

O código do método MIMET é:

 #Tab/]C_TEXT($0) `Este parâmetro sempre deve ser declarado

 C_TEXT($1) `Este parâmetro sempre deve ser declarado

 $0:=String(Current date)

Nota: Um método chamado por 4DSCRIPT não deve chamar elementos de interface (DIALOG, ALERT...).

Como 4D executa os métodos em sua ordem de aparição, é muito possível chamar a um método que define o valor de muitas variáveis que estão referenciadas mais adiante no documento, qualquer que seja o modo que esteja utilizando.

Nota: Pode inserir tantos comentários  quantos queira em uma página estática.

4DINCLUDE

Sintaxe:

Este comentário permite incluir, em uma página HTML, outra página HTML (indicado pelo parâmetro rota). Por padrão só se inclui o corpo da página HTML especificada, ou seja o conteúdo entre as etiquetas <body> e </body> (as etiquetas mesmas não são incluídas). Isso lhe permite evitar conflitos relacionados com as etiquetas presentes nos cabeçalhos. Entretanto se a página HTML especificada não contiver etiquetas <body></body>, a página completa é incluída. Você deve verificar a consistência das meta etiquetas.

O comentário  é muito útil para testes () ou os loops (). É muito conveniente incluir etiquetas em função de um critério ou de maneira aleatória.
Ao momento da inclusão, sem importar a extensão do nome do arquivo, 4D analiza a página chamada e depois insere os conteúdos (modificados ou não) na página que origina a chamada 4DINCLUDE.

A localização na cachê web de uma página incluída com o comentário  responde às mesmas regras que as páginas chamadas através um URL ou enviadas com o comando WEB SEND FILE .

Passe em rota, a rota de acesso ao documento a incluir. Advertência: no caso da etiqueta 4DINCLUDE, a rota de acesso é relativa ao documento em curso de análise, ou seja o documento “pai”. Utilize o caractere barra oblíqua (/) como separador de pastas e os dois pontos (..) para subir um nível (sintaxe HTML).

Notas:

quando utilizar a etiqueta 4DINCLUDE com o comando PROCESS 4D TAGS, a pasta por padrão é a pasta que contém o arquivo de estrutura do banco.
Pode modificar a pasta por padrão utilizada pela etiqueta 4DINCLUDE na página atual, utilizando a etiqueta  (ver a continuação).

O número de  dentro de uma página é ilimitado. Entretanto, as chamadas a  só podem ser realizadas a um nível. Isso significa que, por exemplo, não pode inserir o comentário  no corpo da página meudoc2.html, chamada por  inserido em meudoc1.html.

Além disso, 4D verifica que as inclusões não sejam recursivas.

Em caso de erro, o texto inserido é da forma " :Não se pode abrir o documento".

Exemplos

<!--#4DINCLUDE subpage.html-->
<!--#4DINCLUDE folder/subpage.html-->
<!--#4DINCLUDE ../folder/subpage.html-->

4DBASE

Syntax:

A etiqueta  cria um diretório provisório que é usado pela etiqueta .
Quando for chamada em uma página Web, a etiqueta  modifica todas as subsequentes chamadas  nesta página, até a próxima , se exitir. Se a pasta  for modificada de dentro do arquivo incluido, recupera o valor original do arquivo pai.

O parâmetro folderPath deve conter um nome de caminho relativo à página atual e deve terminar com uma barra (/). A pasta designada deve estar localizada dentro da pasta Web.
Passe a palavra chave WEBFOLDER para restaurar o caminho padrão (relativo à página).

Assim o seguinte código (4D v12), que deve especificar um caminho relativo para cada chamada:

<!--#4DINCLUDE subpage.html--> 
<!--#4DINCLUDE folder/subpage1.html-->
<!--#4DINCLUDE folder/subpage2.html-->
<!--#4DINCLUDE folder/subpage3.html-->
<!--#4DINCLUDE ../folder/subpage.html-->

... pode ser reescrito usando a etiqueta :

<!--#4DINCLUDE subpage.html--> 
<!--#4DBASE folder/-->
<!--#4DINCLUDE subpage1.html-->
<!--#4DINCLUDE subpage2.html-->
<!--#4DINCLUDE subpage3.html-->
<!--#4DBASE ../folder/-->
<!--#4DINCLUDE subpage.html-->
<!--#4DBASE WEBFOLDER-->

Example

Definição de um escritório para a página de início utilizando a etiqueta :

/* Index.html */
<!--#4DIF LangFR=True-->
    <!--#4DBASE FR/-->
<!--#4DELSE-->
    <!--#4DBASE US/-->
<!--#4DENDIF-->
<!--#4DINCLUDE head.html-->
<!--#4DINCLUDE body.html-->
<!--#4DINCLUDE footer.html-->

No arquivo head.html, a pasta atual se modifica via , sem que mude seu valor em Index.html:

/* Head.htm */
/* o escritório de trabalho aqui é relativo ao arquivo incluído (FR/ ou US/) */
<!--#4DBASE Styles/-->
<!--#4DINCLUDE main.css-->
<!--#4DINCLUDE product.css-->
<!--#4DBASE Scripts/-->
<!--#4DINCLUDE main.js-->
<!--#4DINCLUDE product.js-->

4DIF, 4DELSE, 4DELSEIF e 4DENDIF

Sintaxe:  {...} {}

Utilizado com os comentários  (opcional),  (opcional) e , o comentário  oferece a possibilidade de executar partes de código de maneira condicional.

O parâmetro expressao pode conter toda expressão 4D válida devolvendo um valor booleano. Deve estar entre parêntese e cumprir com as regras de sintaxe de 4D.

Os bloqueios  ...  podem estar aninhados em vários níveis. Como em 4D, cada  deve ter um  correspondente.

Em caso de um erro de interpretação, o texto “: se esperava uma expressão booleana” se insere em lugar do conteúdo situado entre  e .

Da mesma forma, se não há tantos  como , o texto “: 4DENDIF esperado” se insere em lugar dos conteúdos localizados entre  e .

Utilizando a etiqueta , pode provar um número ilimitado de condições. Só se executa o conteúdo que segue a primeira condição avaliada como True. Se nenhuma condição é verdadeiro, não se executa nenhuma instrução (se não há  final).
Pode utilizar uma etiqueta  depois da última . Se todas as condições são falsas, as instruções seguintes a  se executam.

Os seguintes dois códigos são equivalentes.

Código utilizando unicamente 4DELSE:

<!--#4DIF Condition1-->
  /* Condition1 es true*/
<!--#4DELSE-->
    <!--#4DIF Condition2-->
        /* Condition2 es true*/
    <!--#4DELSE-->
        <!--#4DIF Condition3-->
            /* Condition3 es true */
        <!--#4DELSE-->
            /*Nenhuma das condições é verdadeira*/
        <!--#4DENDIF-->
    <!--#4DENDIF-->
<!--#4DENDIF-->

Código similar utilizando a etiqueta 4DELSEIF:

<!--#4DIF Condition1-->
     /* Condition1 é true*/
<!--#4DELSEIF Condition2-->
     /* Condition2 é true*/
<!--#4DELSEIF Condition3-->
    /* Condition3 é true */
<!--#4DELSE-->
    /* Nenhuma das condições é verdadeira*/
<!--#4DENDIF-->

Exemplo 1

Este exemplo insere páginas diferentes em função do usuário conectado:

<!--#4DIF LoggedIn=False-->
    <!--#4DINCLUDE Login.htm -->
<!--#4DELSEIF User="Admin" -->
    <!--#4DINCLUDE AdminPanel.htm -->
<!--#4DELSEIF User="Manager" -->
    <!--#4DINCLUDE SalesDashboard.htm -->
<!--#4DELSE-->
    <!--#4DINCLUDE ItemList.htm -->
<!--#4DENDIF-->

Exemplo 2

Esse exemplo de código inserido em uma página de HTML estática exibe uma etiqueta diferente de acordo com o resultado da expressão vname#""

<BODY>
...
<!--#4DIF (vname#"")-->
Nomes que começam com <!--#4DTEXT vname-->.
<!--#4DELSE-->
Nenhum nome foi encontrado.
<!--#4DENDIF-->
...
</BODY>

4DLOOP e 4DENDLOOP

Sintaxe:

Este comentário permite a repetição de uma parte de código HTML desde que se cumpra a condição. A porção está delimitada por  e .

Os blocos  ...  podem estar aninhados. Como em 4D, cada  deve ter um  correspondente.

Há cinco tipos de condições:

Esta sintaxe realiza um loop para cada registro desde a seleção atual da tabela no processo atual. A porção de código HTML localizada entre os dois comentários se repite para cada registro da seleção atual.

Nota: quando a etiqueta 4DLOOP se utiliza com uma tabela, os registros se carregam em modo só leitura.

O exemplo de código seguinte:

<!--#4DLOOP [Pessoas]-->
<!--#4DTEXT [Pessoas]Nome--> <!--#4DVAR [Pessoas]Sobrenome-><BR>
<!--#4DENDLOOP-->

... pode ser traduzido em linguagem 4D como:

 FIRST RECORD([Pessoas])

 While(Not(End selection([Pessoas])))

    ...

    NEXT RECORD([Pessoas])

 End while

Esta sintaxe realiza um loop para cada elemento do array. O elemento atual do array se incrementa quando se repete a porção de código HTML.

Nota: esta sintaxe não pode ser utilizada com arrays de duas dimensões. Neste caso, é melhor combinar um método com loops aninhados.

O seguinte exemplo de código:

<!--#4DLOOP arr_names-->
<!--#4DTEXT arr_names{arr_names}--><BR>
<!--#4DENDLOOP-->

... pode ser traduzida em linguagem 4D da seguinte maneira:

 For($Elem;1;Size of array(arr_names))

    arr_names:=$Elem

    ...

 End for

Esta sintaxe realiza um loop enquanto o método retorna True. O método admite um parâmetro de tipo Inteiro longo. Primeiro se chama com o valor 0 para permitir uma fase de inicialização (se for necessária); depois se chama com os valores 1, 2, 3, ... enquanto retorna True.

Por razões de segurança, no contexto de um processo web On Web Authentication database method pode ser chamada, só uma única vez, antes da fase de inicialização (execução do método com 0 como parâmetro). Se se confirma a autenticação, se se realiza a fase de inicialização.

Advertência: C_BOOLEAN($0) e C_LONGINT($1) DEVEM ser declaradas dentro do método por motivos de compilação.

O exemplo de código seguinte:

<!--#4DLOOP meu_metodo-->
<!--#4DTEXT var--> <BR>
<!--#4DENDLOOP-->

... pode ser traduzida em linguagem 4D da seguinte maneira:

 If(AuthenticationWebOK)

    If(meu_metodo(0))

       $counter:=1

       While(meu_metodo($counter))

          ...

          $counter:=$counter+1

       End while

    End if

 End if

O método meu_metodo pode ser realizado dessa forma:

 C_LONGINT($1)

 C_BOOLEAN($0)

 If($1=0)

  `Initialisação

    $0:=True

 Else

    If($1<50)

       ...

       var:=...

       $0:=True

    Else

       $0:=False `Para o loop

    End if

 End if


Com esta sintaxe, a etiqueta 4DLOOP realiza um loop sempre que a expressão 4D devolva True. A expressão pode ser toda expressão booleana válida e deve conter uma parte variável a avaliar em cada loop para evitar loops infinitos.
Por exemplo, o seguinte código:

<!--#4DEVAL $i:=0-->
<!--#4DLOOP ($i<4)-->
<!--#4DEVAL $i-->
<!--#4DEVAL $i:=$i+1-->
<!--#4DENDLOOP-->

produz o seguinte resultado:


Neste caso, a etiqueta 4DLOOP funciona como é feito com um array: faz um loop para cada elemento do array referenciado pelo ponteiro. O elemento do array atual se incrementa cada vez que a porção de código se repete.
Esta sintaxe é útil quando se passa um ponteiro array como parâmetro ao comando PROCESS 4D TAGS.
Exemplo:

 ARRAY TEXT($array;2)

 $array{1}:="hello"

 $array{2}:="world"

 $input:="<!--#4DEVAL $1-->"

 $input:=$input+"<!--#4DLOOP $2-->"

 $input:=$input+"<!--#4DEVAL $2->{$2->}--> "

 $input:=$input+"<!--#4DENDLOOP-->"

 PROCESS 4D TAGS($input;$output;"elements = ";->$array)

  // $output = "elements = hello world "

Em caso de um erro de interpretação, o texto “: Descrição” é inserido em vez do conteúdo localizado entre  e .

Pode aparecer uma das seguintes mensagens:
- Não se esperava uma expressão deste tipo (erro padrão)
- Nome de tabela incorreto (erro no nome da tabela)
- Um array era esperado (a variável não é um array ou é um array de duas dimensões)
- O método não existe
- Erro de sintaxe (quando o método for executado)
- Erro de acesso (não tem os privilégios de acesso apropriados para acessar a tabela ou ao método)
- 4DENDLOOP esperado (o número de  não corresponde a ).

Notas de uso

Processamento recursivo

Etiquetas 4D são interpretadas recursivamente: 4D sempre tente reinterpretar o resultado da transformação e, se uma nova transformação for executada, uma interpretação adicional é realizada, e assim em diante até que o produto obtido não necessite de mais transformações. Por exemplo, dada a seguinte ordem:

<!--#4DHTML [Mail]Letter_type-->

Se o campo texto [Mail]Letter_type contiver uma etiqueta, por exemplo , esta etiqueta será avaliada recursivamente depois da interpretação da etiqueta 4DHTML.

Este princípio poderoso atende a maioria das necessidades relativas à transformação de texto. Note, entretanto, que em alguns casos isto pode permitir a inserção de código malicioso, para saber mais, veja a próxima seção.

Prevenir inserção de código malicioso

As etiquetas de transformação 4D aceita diferentes tipos de dados como parâmetros: texto, variáveis, métodos, nomes de comandos, etc. Quando esses dados forem oferecidos por seu prórpio código, não há risco de inserção de código malicioso, já que você controla o input. Entretanto, seu código de banco de dados funciona com dados que fora, em um momento ou outro, introduzidos por uma fonte externa (input de usuário, importação, etc.)

Neste caso, é recomendável não usar etiquetas de transformação como 4DEVAL ou 4DSCRIPT, que avaliam parâmetros, diretamente com este tipo de dados.

Além disso, de acordo com o princípio de recursão (ver seção anterior), código malicioso pode dentro de si mesmo incluir etiquetas de transformação. Neste caso, é imperativo usar a etiqueta 4DTEXT.

Imaginar, por exemplo, um campo de formulário Web chamado "Nome", no qual usuários devem colocar seu nome. Este nome é então exibido usando uma etiqueta  na página. Se texto do tipo "" for inserido ao invés do nome, interpretar essa etiqueta vai fazer com que saia da aplicação.

Para evitar esse risco, pode usar a etiqueta 4DTEXT sistematicamente nesse caso. Já que essa etiqueta escapa os caracteres especiais HTML, qualquer código recursivo malicioso que possa ter sido inserido não será reinterpretado. No exemplo acima, o campo "Nome" vai conter, nesse caso, "" que não será transformado.

Ver também

Ações URL e Formulário
Binding 4D objects with HTML objects
Páginas semi dinâmicas
PROCESS 4D TAGS