Guia de referência de Tags HyperCode

Lista completa de Tags HyperCode

Veja a lista completa de tags HyperCode suportadas pelo HyperFluxCMS, agrupadas em ordem de função.

O HyperCode possui dezenas de tags de variados tipos e funções.

Grosso modo, eles podem ser divididos nas seguintes categorias. Clique em uma delas para abrir a página referente.

Estilos de fonte

• Tag [i]: itálico
• Tag [b]: negrito
• Tag [u]: sublinhado
• Tag [s]: riscado
• Tag [k]: teclado
• Tag [del]: deletado
• Tag [ins]: inserido
• Tag [mark]: destacado
• Tag [monospace]: monoespaçado
• Tag [sup]: superscrito
• Tag [sub]: subscrito
• Tag [style]: estilo complexo

Tamanhos de fonte

• Tag [xlarge]: fonte tamanho extra grande
• Tag [large]: fonte tamanho grande
• Tag [medium]: fonte tamanho médio
• Tag [small]: fonte tamanho pequeno
• Tag [xsmall]: fonte tamanho extra pequeno

Cores de fonte

• Tag [aliceblue]: fonte cor "aliceblue"
• Tag [antiquewhite]: fonte cor "antiquewhite"
• Tag [aqua]: fonte cor "aqua"
• Tag [aquamarine]: fonte cor "aquamarine"
• Tag [azure]: fonte cor "azure"
• Tag [beige]: fonte cor "beige"
• Tag [bisque]: fonte cor "bisque"
• Tag [black]: fonte cor "black"
• Tag [blanchedalmond]: fonte cor "blanchedalmond"
• Tag [blue]: fonte cor "blue"
• Tag [blueviolet]: fonte cor "blueviolet"
• Tag [brown]: fonte cor "brown"
• Tag [burlywood]: fonte cor "burlywood"
• Tag [cadetblue]: fonte cor "cadetblue"
• Tag [chartreuse]: fonte cor "chartreuse"
• Tag [chocolate]: fonte cor "chocolate"
• Tag [coral]: fonte cor "coral"
• Tag [cornflowerblue]: fonte cor "cornflowerblue"
• Tag [cornsilk]: fonte cor "cornsilk"
• Tag [crimson]: fonte cor "crimson"
• Tag [cyan]: fonte cor "cyan"
• Tag [darkblue]: fonte cor "darkblue"
• Tag [darkcyan]: fonte cor "darkcyan"
• Tag [darkgoldenrod]: fonte cor "darkgoldenrod"
• Tag [darkgray]: fonte cor "darkgray"
• Tag [darkgreen]: fonte cor "darkgreen"
• Tag [darkgrey]: fonte cor "darkgrey"
• Tag [darkkhaki]: fonte cor "darkkhaki"
• Tag [darkmagenta]: fonte cor "darkmagenta"
• Tag [darkolivegreen]: fonte cor "darkolivegreen"
• Tag [darkorange]: fonte cor "darkorange"
• Tag [darkorchid]: fonte cor "darkorchid"
• Tag [darkred]: fonte cor "darkred"
• Tag [darksalmon]: fonte cor "darksalmon"
• Tag [darkseagreen]: fonte cor "darkseagreen"
• Tag [darkslateblue]: fonte cor "darkslateblue"
• Tag [darkslategray]: fonte cor "darkslategray"
• Tag [darkslategrey]: fonte cor "darkslategrey"
• Tag [darkturquoise]: fonte cor "darkturquoise"
• Tag [darkviolet]: fonte cor "darkviolet"
• Tag [deeppink]: fonte cor "deeppink"
• Tag [deepskyblue]: fonte cor "deepskyblue"
• Tag [dimgray]: fonte cor "dimgray"
• Tag [dimgrey]: fonte cor "dimgrey"
• Tag [dodgerblue]: fonte cor "dodgerblue"
• Tag [firebrick]: fonte cor "firebrick"
• Tag [floralwhite]: fonte cor "floralwhite"
• Tag [forestgreen]: fonte cor "forestgreen"
• Tag [fuchsia]: fonte cor "fuchsia"
• Tag [gainsboro]: fonte cor "gainsboro"
• Tag [ghostwhite]: fonte cor "ghostwhite"
• Tag [gold]: fonte cor "gold"
• Tag [goldenrod]: fonte cor "goldenrod"
• Tag [gray]: fonte cor "gray"
• Tag [green]: fonte cor "green"
• Tag [greenyellow]: fonte cor "greenyellow"
• Tag [grey]: fonte cor "grey"
• Tag [honeydew]: fonte cor "honeydew"
• Tag [hotpink]: fonte cor "hotpink"
• Tag [indianred]: fonte cor "indianred"
• Tag [indigo]: fonte cor "indigo"
• Tag [ivory]: fonte cor "ivory"
• Tag [khaki]: fonte cor "khaki"
• Tag [lavender]: fonte cor "lavender"
• Tag [lavenderblush]: fonte cor "lavenderblush"
• Tag [lawngreen]: fonte cor "lawngreen"
• Tag [lemonchiffon]: fonte cor "lemonchiffon"
• Tag [lightblue]: fonte cor "lightblue"
• Tag [lightcoral]: fonte cor "lightcoral"
• Tag [lightcyan]: fonte cor "lightcyan"
• Tag [lightgoldenrodyellow]: fonte cor "lightgoldenrodyellow"
• Tag [lightgray]: fonte cor "lightgray"
• Tag [lightgreen]: fonte cor "lightgreen"
• Tag [lightgrey]: fonte cor "lightgrey"
• Tag [lightpink]: fonte cor "lightpink"
• Tag [lightsalmon]: fonte cor "lightsalmon"
• Tag [lightseagreen]: fonte cor "lightseagreen"
• Tag [lightskyblue]: fonte cor "lightskyblue"
• Tag [lightslategray]: fonte cor "lightslategray"
• Tag [lightslategrey]: fonte cor "lightslategrey"
• Tag [lightsteelblue]: fonte cor "lightsteelblue"
• Tag [lightyellow]: fonte cor "lightyellow"
• Tag [lime]: fonte cor "lime"
• Tag [limegreen]: fonte cor "limegreen"
• Tag [linen]: fonte cor "linen"
• Tag [magenta]: fonte cor "magenta"
• Tag [maroon]: fonte cor "maroon"
• Tag [mediumaquamarine]: fonte cor "mediumaquamarine"
• Tag [mediumblue]: fonte cor "mediumblue"
• Tag [mediumorchid]: fonte cor "mediumorchid"
• Tag [mediumpurple]: fonte cor "mediumpurple"
• Tag [mediumseagreen]: fonte cor "mediumseagreen"
• Tag [mediumslateblue]: fonte cor "mediumslateblue"
• Tag [mediumspringgreen]: fonte cor "mediumspringgreen"
• Tag [mediumturquoise]: fonte cor "mediumturquoise"
• Tag [mediumvioletred]: fonte cor "mediumvioletred"
• Tag [midnightblue]: fonte cor "midnightblue"
• Tag [mintcream]: fonte cor "mintcream"
• Tag [mistyrose]: fonte cor "mistyrose"
• Tag [moccasin]: fonte cor "moccasin"
• Tag [navajowhite]: fonte cor "navajowhite"
• Tag [navy]: fonte cor "navy"
• Tag [oldlace]: fonte cor "oldlace"
• Tag [olive]: fonte cor "olive"
• Tag [olivedrab]: fonte cor "olivedrab"
• Tag [orange]: fonte cor "orange"
• Tag [orangered]: fonte cor "orangered"
• Tag [orchid]: fonte cor "orchid"
• Tag [palegoldenrod]: fonte cor "palegoldenrod"
• Tag [palegreen]: fonte cor "palegreen"
• Tag [paleturquoise]: fonte cor "paleturquoise"
• Tag [palevioletred]: fonte cor "palevioletred"
• Tag [papayawhip]: fonte cor "papayawhip"
• Tag [peachpuff]: fonte cor "peachpuff"
• Tag [peru]: fonte cor "peru"
• Tag [pink]: fonte cor "pink"
• Tag [plum]: fonte cor "plum"
• Tag [powderblue]: fonte cor "powderblue"
• Tag [purple]: fonte cor "purple"
• Tag [rebeccapurple]: fonte cor "rebeccapurple"
• Tag [red]: fonte cor "red"
• Tag [rosybrown]: fonte cor "rosybrown"
• Tag [royalblue]: fonte cor "royalblue"
• Tag [saddlebrown]: fonte cor "saddlebrown"
• Tag [salmon]: fonte cor "salmon"
• Tag [sandybrown]: fonte cor "sandybrown"
• Tag [seagreen]: fonte cor "seagreen"
• Tag [seashell]: fonte cor "seashell"
• Tag [sienna]: fonte cor "sienna"
• Tag [silver]: fonte cor "silver"
• Tag [skyblue]: fonte cor "skyblue"
• Tag [slateblue]: fonte cor "slateblue"
• Tag [slategray]: fonte cor "slategray"
• Tag [slategrey]: fonte cor "slategrey"
• Tag [snow]: fonte cor "snow"
• Tag [springgreen]: fonte cor "springgreen"
• Tag [steelblue]: fonte cor "steelblue"
• Tag [tan]: fonte cor "tan"
• Tag [teal]: fonte cor "teal"
• Tag [thistle]: fonte cor "thistle"
• Tag [tomato]: fonte cor "tomato"
• Tag [transparent]: fonte cor "transparent"
• Tag [turquoise]: fonte cor "turquoise"
• Tag [violet]: fonte cor "violet"
• Tag [wheat]: fonte cor "wheat"
• Tag [white]: fonte cor "white"
• Tag [whitesmoke]: fonte cor "whitesmoke"
• Tag [yellow]: fonte cor "yellow"
• Tag [yellowgreen]: fonte cor "yellowgreen"

Cores de fundo

• Tag [b.aliceblue]: fundo cor "aliceblue"
• Tag [b.antiquewhite]: fundo cor "antiquewhite"
• Tag [b.aqua]: fundo cor "aqua"
• Tag [b.aquamarine]: fundo cor "aquamarine"
• Tag [b.azure]: fundo cor "azure"
• Tag [b.beige]: fundo cor "beige"
• Tag [b.bisque]: fundo cor "bisque"
• Tag [b.black]: fundo cor "black"
• Tag [b.blanchedalmond]: fundo cor "blanchedalmond"
• Tag [b.blue]: fundo cor "blue"
• Tag [b.blueviolet]: fundo cor "blueviolet"
• Tag [b.brown]: fundo cor "brown"
• Tag [b.burlywood]: fundo cor "burlywood"
• Tag [b.cadetblue]: fundo cor "cadetblue"
• Tag [b.chartreuse]: fundo cor "chartreuse"
• Tag [b.chocolate]: fundo cor "chocolate"
• Tag [b.coral]: fundo cor "coral"
• Tag [b.cornflowerblue]: fundo cor "cornflowerblue"
• Tag [b.cornsilk]: fundo cor "cornsilk"
• Tag [b.crimson]: fundo cor "crimson"
• Tag [b.cyan]: fundo cor "cyan"
• Tag [b.darkblue]: fundo cor "darkblue"
• Tag [b.darkcyan]: fundo cor "darkcyan"
• Tag [b.darkgoldenrod]: fundo cor "darkgoldenrod"
• Tag [b.darkgray]: fundo cor "darkgray"
• Tag [b.darkgreen]: fundo cor "darkgreen"
• Tag [b.darkgrey]: fundo cor "darkgrey"
• Tag [b.darkkhaki]: fundo cor "darkkhaki"
• Tag [b.darkmagenta]: fundo cor "darkmagenta"
• Tag [b.darkolivegreen]: fundo cor "darkolivegreen"
• Tag [b.darkorange]: fundo cor "darkorange"
• Tag [b.darkorchid]: fundo cor "darkorchid"
• Tag [b.darkred]: fundo cor "darkred"
• Tag [b.darksalmon]: fundo cor "darksalmon"
• Tag [b.darkseagreen]: fundo cor "darkseagreen"
• Tag [b.darkslateblue]: fundo cor "darkslateblue"
• Tag [b.darkslategray]: fundo cor "darkslategray"
• Tag [b.darkslategrey]: fundo cor "darkslategrey"
• Tag [b.darkturquoise]: fundo cor "darkturquoise"
• Tag [b.darkviolet]: fundo cor "darkviolet"
• Tag [b.deeppink]: fundo cor "deeppink"
• Tag [b.deepskyblue]: fundo cor "deepskyblue"
• Tag [b.dimgray]: fundo cor "dimgray"
• Tag [b.dimgrey]: fundo cor "dimgrey"
• Tag [b.dodgerblue]: fundo cor "dodgerblue"
• Tag [b.firebrick]: fundo cor "firebrick"
• Tag [b.floralwhite]: fundo cor "floralwhite"
• Tag [b.forestgreen]: fundo cor "forestgreen"
• Tag [b.fuchsia]: fundo cor "fuchsia"
• Tag [b.gainsboro]: fundo cor "gainsboro"
• Tag [b.ghostwhite]: fundo cor "ghostwhite"
• Tag [b.gold]: fundo cor "gold"
• Tag [b.goldenrod]: fundo cor "goldenrod"
• Tag [b.gray]: fundo cor "gray"
• Tag [b.green]: fundo cor "green"
• Tag [b.greenyellow]: fundo cor "greenyellow"
• Tag [b.grey]: fundo cor "grey"
• Tag [b.honeydew]: fundo cor "honeydew"
• Tag [b.hotpink]: fundo cor "hotpink"
• Tag [b.indianred]: fundo cor "indianred"
• Tag [b.indigo]: fundo cor "indigo"
• Tag [b.ivory]: fundo cor "ivory"
• Tag [b.khaki]: fundo cor "khaki"
• Tag [b.lavender]: fundo cor "lavender"
• Tag [b.lavenderblush]: fundo cor "lavenderblush"
• Tag [b.lawngreen]: fundo cor "lawngreen"
• Tag [b.lemonchiffon]: fundo cor "lemonchiffon"
• Tag [b.lightblue]: fundo cor "lightblue"
• Tag [b.lightcoral]: fundo cor "lightcoral"
• Tag [b.lightcyan]: fundo cor "lightcyan"
• Tag [b.lightgoldenrodyellow]: fundo cor "lightgoldenrodyellow"
• Tag [b.lightgray]: fundo cor "lightgray"
• Tag [b.lightgreen]: fundo cor "lightgreen"
• Tag [b.lightgrey]: fundo cor "lightgrey"
• Tag [b.lightpink]: fundo cor "lightpink"
• Tag [b.lightsalmon]: fundo cor "lightsalmon"
• Tag [b.lightseagreen]: fundo cor "lightseagreen"
• Tag [b.lightskyblue]: fundo cor "lightskyblue"
• Tag [b.lightslategray]: fundo cor "lightslategray"
• Tag [b.lightslategrey]: fundo cor "lightslategrey"
• Tag [b.lightsteelblue]: fundo cor "lightsteelblue"
• Tag [b.lightyellow]: fundo cor "lightyellow"
• Tag [b.lime]: fundo cor "lime"
• Tag [b.limegreen]: fundo cor "limegreen"
• Tag [b.linen]: fundo cor "linen"
• Tag [b.magenta]: fundo cor "magenta"
• Tag [b.maroon]: fundo cor "maroon"
• Tag [b.mediumaquamarine]: fundo cor "mediumaquamarine"
• Tag [b.mediumblue]: fundo cor "mediumblue"
• Tag [b.mediumorchid]: fundo cor "mediumorchid"
• Tag [b.mediumpurple]: fundo cor "mediumpurple"
• Tag [b.mediumseagreen]: fundo cor "mediumseagreen"
• Tag [b.mediumslateblue]: fundo cor "mediumslateblue"
• Tag [b.mediumspringgreen]: fundo cor "mediumspringgreen"
• Tag [b.mediumturquoise]: fundo cor "mediumturquoise"
• Tag [b.mediumvioletred]: fundo cor "mediumvioletred"
• Tag [b.midnightblue]: fundo cor "midnightblue"
• Tag [b.mintcream]: fundo cor "mintcream"
• Tag [b.mistyrose]: fundo cor "mistyrose"
• Tag [b.moccasin]: fundo cor "moccasin"
• Tag [b.navajowhite]: fundo cor "navajowhite"
• Tag [b.navy]: fundo cor "navy"
• Tag [b.oldlace]: fundo cor "oldlace"
• Tag [b.olive]: fundo cor "olive"
• Tag [b.olivedrab]: fundo cor "olivedrab"
• Tag [b.orange]: fundo cor "orange"
• Tag [b.orangered]: fundo cor "orangered"
• Tag [b.orchid]: fundo cor "orchid"
• Tag [b.palegoldenrod]: fundo cor "palegoldenrod"
• Tag [b.palegreen]: fundo cor "palegreen"
• Tag [b.paleturquoise]: fundo cor "paleturquoise"
• Tag [b.palevioletred]: fundo cor "palevioletred"
• Tag [b.papayawhip]: fundo cor "papayawhip"
• Tag [b.peachpuff]: fundo cor "peachpuff"
• Tag [b.peru]: fundo cor "peru"
• Tag [b.pink]: fundo cor "pink"
• Tag [b.plum]: fundo cor "plum"
• Tag [b.powderblue]: fundo cor "powderblue"
• Tag [b.purple]: fundo cor "purple"
• Tag [b.rebeccapurple]: fundo cor "rebeccapurple"
• Tag [b.red]: fundo cor "red"
• Tag [b.rosybrown]: fundo cor "rosybrown"
• Tag [b.royalblue]: fundo cor "royalblue"
• Tag [b.saddlebrown]: fundo cor "saddlebrown"
• Tag [b.salmon]: fundo cor "salmon"
• Tag [b.sandybrown]: fundo cor "sandybrown"
• Tag [b.seagreen]: fundo cor "seagreen"
• Tag [b.seashell]: fundo cor "seashell"
• Tag [b.sienna]: fundo cor "sienna"
• Tag [b.silver]: fundo cor "silver"
• Tag [b.skyblue]: fundo cor "skyblue"
• Tag [b.slateblue]: fundo cor "slateblue"
• Tag [b.slategray]: fundo cor "slategray"
• Tag [b.slategrey]: fundo cor "slategrey"
• Tag [b.snow]: fundo cor "snow"
• Tag [b.springgreen]: fundo cor "springgreen"
• Tag [b.steelblue]: fundo cor "steelblue"
• Tag [b.tan]: fundo cor "tan"
• Tag [b.teal]: fundo cor "teal"
• Tag [b.thistle]: fundo cor "thistle"
• Tag [b.tomato]: fundo cor "tomato"
• Tag [b.transparent]: fundo cor "transparent"
• Tag [b.turquoise]: fundo cor "turquoise"
• Tag [b.violet]: fundo cor "violet"
• Tag [b.wheat]: fundo cor "wheat"
• Tag [b.white]: fundo cor "white"
• Tag [b.whitesmoke]: fundo cor "whitesmoke"
• Tag [b.yellow]: fundo cor "yellow"
• Tag [b.yellowgreen]: fundo cor "yellowgreen"

Estilos de blocos

• Tag [p]: parágrafo
• Tag [block]: bloco
• Tag [center]: bloco com conteúdo centralizado
• Tag [left]: bloco com conteúdo alinhado à esquerda
• Tag [right]: bloco com conteúdo alinhado à direita
• Tag [justify]: bloco com conteúdo justificado
• Tag [code]: bloco formatado como código
• Tag [hint]: bloco formatado como destaque de dica
• Tag [important]: bloco formatado como destaque importante
• Tag [warning]: bloco formatado com destaque de alerta
• Tag [quote]: bloco formatado como citação

Imagens

• Tag [image]: imagem simples. O mesmo que [img].
• Tag [img]: imagem simples
• Tag [thumb]: miniatura
• Tag [floatimg]: imagem flutuante
• Tag [coverimg]: imagem de capa
• Tag [modalimg]: imagem modal

Links

• Tag [link]: hyperlink
• Tag [url]: hyperlink. O mesmo que [link].

Headings/Cabeçalhos

• Tag [h1]: heading nivel 1
• Tag [h2]: heading nivel 2
• Tag [h3]: heading nivel 3
• Tag [h4]: heading nivel 4
• Tag [h5]: heading nivel 5
• Tag [h6]: heading nivel 6

Listas

• Tag [ul]: lista não ordenada
• Tag [ol]: lista ordenada
• Tag [li]: item da Lista

Tabelas

• Tag [table]: tabela
• Tag [th]: cabeçalho de tabela
• Tag [tr]: linha de tabela
• Tag [td]: célula de tabela

Áudio e Vídeo

• Tag [audio]: áudio
• Tag [video]: vídeo
• Tag [youtube]: vídeo incorporado do YouTube

Menus

• Tag [menu]: menu ou submenu
• Tag [menuitem]: item de Menu

Documentação/Comentários

• Tag [!]: comentário

Templates

• Tag [template]: inserir/usar template
• Tag [footer]: rodapé
• Tag [Header]: cabeçalho
• Tag [post]: post

Componentes

• Tag [postlist]: lista de postagens
• Tag [pagination]: paginação
• Tag [searchform]: formulário de busca
• Tag [socialmediasharebuttons]: botões para mídias/redes sociais

Metadados e Comportamento

• Tag [summary]: sumário
• Tag [postinfo]: informações da postagem
• Tag [pragma]: diretivas de compilação

Objetos Úteis

• Tag [line]: linha horizontal
• Tag [blank]: linha em branco
• Tag [index]: Índice
• Tag [item]: item
• Tag [explain]: explicação sobre um item

Alguns lembretes importantes:

• Quase todas as tags podem levar como propriedades opcionais as propriedades id, class e style. Saiba mais.
• Algumas Tags HyperCode são auto-contidas e usadas forma pontual, por exemplo, para inserir uma imagem ou linha horizontal no texto.
• Outras Tags são usadas para marcar um bloco e precisam ser "abertas" [tag]" e "fechadas" [/tag].
• É possível usar nomes de tags em maiúsculo, minúsculo ou mesclando.

Antes de se aprofundar nas tags, é importante que você tenha lido e entendido de forma geral a sintaxe e o uso do HyperCode.

Se você ainda não fez isso, consulte a página Usando HyperCode no HyperFluxCMS para entender o conceito e saber como aproveitar ao máximo os recursos dessa linguagem.

Você também pode preferir acessar a página Tags HyperCode em Ordem Alfabética.