Componentes HTML e inclusão de scripts personalizados na Ficha de Inscrições e Matrículas Rubeus

HTML

Como mencionado em nosso conteúdo sobre componentes, uma das opções disponibilizadas é identificada como HTML. Resumidamente, trata-se de um recurso nativo da Plataforma Rubeus que permite a inserção manual de elementos(HTML) ou funcionalidades (Scripts personalizados) na página. Vamos ver a seguir como utilizá-la!

||❗Dica: Recomendamos a leitura dos nossos conteúdos sobre componentes e botões para contextualizar o conteúdo abordado aqui! 😉 

Ações iniciais

Dentro da Plataforma, ao criar um novo componente, selecione a opção HTML.

Configurações > Componentes > Novo componente

Configuração Geral

Após clicar em próximo, o novo componente HTML estará criado. A seguir, é preciso definir um nome para o componente, você pode fazer isso nas configurações da aba Geral, veja só:

 

Inserindo elementos

A aba ao lado se chama Básico, é  nela que iremos definir se este componente terá o HTML de um item ou um script personalizado. Selecione a opção desejada:

Aqui, você pode inserir a tag HTML no campo indicado acima, podendo ser de qualquer tipo, incluindo a tag Style, a depender do propósito do componente. 

⚠️ Atenção: não recomendamos a utilização da tag SCRIPT no tipo de código  HTML. Para o bom funcionamento e a redução de possíveis quebras de página, utilize o tipo de código script.

Utilize a Classe CSS para definir um atributo class para esse item. Você também pode usar outros atributos, com valores fixos ou atribuindo valores de campos do sistema. Veja abaixo:

Posteriormente, utilize a área destinada ao conteúdo para incluir o código para o recurso desejado:

⚠️  Dica: Clique com o botão direito do mouse na área de conteúdo para acessar funcionalidades extras da ferramenta de inserção de códigos.

Você pode ainda optar por esconder o elemento inserido, acionando a opção slidetoggle exibida logo abaixo do bloco de conteúdo.

Lembre-se de utilizar a opção Script para incluir scripts no seu formulário. O corpo da aba de edição é muito similar, com exceção da tag HTML que não é editável e a ausência de um campo para definição da classe.

Não se esqueça de salvar as alterações após finalizar! 😉

Caso tenha alguma dúvida, não deixe de compartilhá-la com algum especialista Rubeus ou em nossa Comunidade.