Introdução ao HyperCode

Usando HyperCode em suas postagens

Entenda a linguagem HyperCode e veja como utilizá-la para formatar e decorar suas postagens.

Introdução

A Linguagem HyperCode é a principal linguagem de marcação hipertexto original e recomendada para as postagens escritas e publicadas no HyperFluxCMS.

Ela foi desenvolvida para ser poderosa, cobrindo as necessidades de pelo menos 95% dos sites, sendo ainda muito mais simples e compacta do que HTML.

HyperCode é uma linguagem que é inspirada em outras linguagens de marcação tradicionais como BBCode e HTML.

Hypercode é baseada em "TAGs".

As TAGs são expressões entre colchetes [ ].

O nome da Tag deve ser informado imediatamente após abrir o colchete. Exemplos: [center], [audio] e [pagination]

O HyperFluxCMS não diferencia letras maiúsculas e minúsculas no nome das tags. [img], [Img] e [IMG] tem o mesmo efeito.

Propriedades

Uma TAG deve obrigatoriamente ter o nome da tag, que representa a função dela. Em seguida, há a lista de Propriedades. Cada Tag tem sua própria lista de Propriedades.

Algumas Propriedades são obrigatórias, outras são opcionais. Por exemplo, a Tag [img] insere uma imagem no texto, e tem como propriedade obrigatória o nome do arquivo ou URL da imagem a ser inserida, enquanto tem como opcionais propriedades como o tamanho que a imagem será mostrada.

As propriedades devem ser informadas no formato nome-da-propriedade="valor-da-propriedade".

Nome da propriedades deve ser informado sem aspas. O valor da propriedades deve ser informado entre aspas.

Havendo mais de uma propriedade a ser informada, elas devem ser separadas por espaço ou por quebra de linha.

Exemplo: Para inserir a imagem chamada "thumbnail-sample.jpg", no tamanho de 240 x 135 pixels, utilize

O que resulta em

A lista de propriedades obrigatórias e opcionais de cada tag é descrita na página referente a cada tag. No fim desta página há links para a lista de tags, em ordem alfabética e por função.

Assim como os nomes das tags, o HyperCode aceita que os nomes das propriedades possamm ser informados em letras minúsculas, maiúsculas ou uma mistura. "URL", "url" e "Url" tem o mesmo efeito.

Já para os valores, pode haver diferença, dependendo da propriedade.

Por exemplo, para a propriedade "color" com valor "red", não há diferença entre "red", "Red" ou "RED".

Mas para a propriedade "src" há diferença, quando se tratar de um arquivo hospedado em ambiente Linux (que diferencia arquivos com letras maiúsculas e minúsculas), "https://website/image.jpg" É diferente de "https://website/IMAGE.JPG".

Propriedades Anônimas

Algumas tags tem Propriedades Anônimas. Propriedades Anônimas são aquelas que são tão óbvias que são a função principal de uma tag, que o nome da propriedade pode até ser omitida, desde que seja informado imediatamente após o nome da tag, usando o símbolo de =.

Por exemplo, na tag [img], é tão óbvio que a propriedade mais importante é a URL da imagem (propriedade "url"), que a propriedade "url" pode ser omitida, se for informada logo após o nome da Tag.

Dessa forma, [img src="sample.jpg"]
pode ser resumido como
[img="sample.jpg"].
E [link url="https://hyperfluxcms.com"]
pode ser substituido por
[link="https://hyperfluxcms.com"]

Tags Compostas

A maior parte das Tags HyperCode são compostas, usadas em pares. Elas são compostas de uma Tag de "abertura", que indica o local do texto onde se inicia o efeito da Tag, e a Tag de "Fechamento", que indica onde a Tag deixa de fazer efeito.

A Tag de abertura é iniciada pelo nome tag entre colchetes [tag]. A tag de fechamento é a mesma tag de fechamento, mas o nome da tag é precedida por /, como em [/tag]. Isso é bem parecido com a sintaxe HTML e BBCode.

Por exemplo, para se marcar um pedaço do texto em negrito, se usa [b] Este texto está em negrito [/b] e agora não está mais.

Como em XHTML e em HyperLite, a linguagem HyperCode EXIGE que o fechamento ocorra na ordem inversa à abertura. As últimas Tags que foram abertos devem ser os próximos a serem fechados e vice-versa.

Por exemplo:

Este é um texto que agora está em negrito e agora está em itálico e agora sublinhado mas agora não está mais sublinhado nem mais em itálico e agora nem em negrito está mais.

Exemplo de Tags compostas são as de formatação de textos como itálico [i], negrito [b], sublinhado [u], headings [h1],[h2],[h3]..., tabelas [table] [tr] [th] [td], etc.

Tags Simples ou Autocontidas

Algumas Tags não são formadas por pares Abre-Fecha. Algumas, como por exemplo as que representam imagens ou linhas, são usadas de forma isolada.

Essas Tags devem simplesmente inseridas no local adequado do texto. Por exemplo, para inserir uma imagem:

E para inserir uma linha horizontal no texto

Exemplo de Tags Simples ou autocontidas são as de imagens, áudio, vídeo, linhas em branco, índices, paginação, Templates, "search forms" e conjuntos de botões de mídias sociais.

Tags de Fechamento Anônimas

A sintaxe das tags compostas pode ser simplificada. Na tag de FECHAMENTO, o nome da tag pode ser omitido, sendo usado simplesmente [/], o que chamamos de "Tag de Fechamento Anônima".

Ao compilar uma página e encontrar uma tag de fechamento anônima, o HyperFluxCMS automaticamente associa à Tag mais recentemente aberta.

Por exemplo, um trecho de texto que esteja marcado com a tag [style] pode ser fechada simplesmente com [/].

Exemplo:

Texto comum em negrito com fundo amarelo e letras vermelhas agora letras comuns agora fundo comum agora não mais negrito.

Veja também:
Usando HTML no HyperFluxCMS
Usando HyperCode no HyperFluxCMS
Guia de Referência de Tags HyperCode
Tags HyperCode - Ordem Alfabética