Principal Construtor de Sites/Builder Como funciona o elemento Embed na Rockty

Como funciona o elemento Embed na Rockty

Última atualização em Jan 30, 2025

Introdução

O elemento Embed permite a inserção de códigos externos (como scripts) diretamente em suas páginas na Rockty, possibilitando a adição de funcionalidades que não estão disponíveis nativamente. Você pode, por exemplo, integrar vídeos, botões, animações, formulários, mapas, entre outros.

1. Como Adicionar um Elemento Embed

Para adicionar um elemento Embed à sua página, siga estas etapas:

  1. Adicione um novo elemento na sua página.

  2. Selecione o elemento 'Embed' na lista de opções disponíveis no menu lateral esquerdo.

💡 Dica: Caso precise de mais detalhes sobre como adicionar elementos, confira nosso tutorial Gerenciando Elementos na Rockty: Adicionar, Excluir e Personalizar para orientações iniciais.

2. Inserindo o Código no Elemento Embed

Após adicionar o elemento Embed à sua página, siga os passos abaixo para inserir o código:

  1. Clique no elemento Embed para abrir a janela de inserção de código, como mostrado na imagem abaixo.
    ​

  2. Insira o código desejado na área especificada.

  3. Para fechar a janela sem excluir o elemento, clique no ícone em formato de "X".

  4. Caso queira excluir o elemento Embed, clique no ícone de lixeira.

  5. Após inserção do código, feche a janela e salve/publique a página para concluir.
    ​

❗ Importante: O elemento que você inserir por código ficará visível apenas na página publicada.

3. Configurações do Elemento Embed

Para acessar as configurações do elemento Embed, clique na engrenagem do elemento. As configurações disponíveis são:
​

Ajustes

  • Visibilidade: Configure a visibilidade do elemento para diferentes dispositivos (Desktop, Tablet, Mobile). Para ocultar ou mostrar o elemento, clique no ícone do dispositivo desejado. Para reverter, clique novamente no ícone.
    ​

  • Posição | Margem | Espaçamento Interno: Ajuste a posição (esquerda, centro, direita), margem (topo) e espaçamento interno (topo, baixo, esquerda, direita) do elemento. Insira valores manualmente ou ajuste as barras de controle.
    ​

    💡 Dica: Evite usar margens negativas, pois podem causar conflitos com outros elementos da página.
    ​

Avançado

  • Efeitos de Movimento - Animação: Adicione animações ao elemento. Escolha um efeito da lista e configure o comportamento (exibir uma vez ou em loop), ativação (ao entrar na página ou ao passar o mouse) e duração (normal, devagar ou rápido). Para remover a animação, clique na lixeira ao lado do nome da animação.

  • CSS Classes: Utilize CSS Classes para aplicar estilos personalizados ao elemento. Insira um nome para a classe no campo "Insira ou Selecione" e utilize o elemento de Script para adicionar o código CSS relacionado. Para mais detalhes, confira nosso tutorial Como Funciona a Configuração CSS Classes na Rockty.
    ​

Conclusão

O elemento Embed oferece flexibilidade para integrar recursos externos em suas páginas na Rockty. Sempre teste o comportamento dos códigos inseridos para garantir compatibilidade e funcionalidade desejada.

Dicas Adicionais

  1. Teste Sempre na Página Publicada: Nem todos os códigos externos se comportam da mesma forma no ambiente de edição e na página publicada. Sempre teste o funcionamento do código após publicar a página para garantir que tudo está funcionando conforme o esperado.

  2. Verifique a Compatibilidade do Código: Alguns códigos externos podem não ser compatíveis com a estrutura da Rockty ou podem afetar o desempenho da página. Antes de publicar, faça testes para verificar se o código não está causando lentidão ou outros problemas.

  3. Mantenha o Código Limpo e Simples: Evite adicionar códigos muito extensos ou complexos no elemento Embed, pois isso pode impactar a performance da página. Sempre prefira códigos otimizados e necessários.

  4. Use de Forma Moderada: Inserir muitos elementos Embed em uma mesma página pode sobrecarregar o carregamento da página, especialmente se os códigos forem pesados ou envolverem múltiplas chamadas externas. Use com moderação para manter uma boa experiência do usuário.

  5. Segurança do Código: Certifique-se de que o código que você está inserindo é de uma fonte confiável. Códigos maliciosos podem comprometer a segurança do seu site e dos dados dos usuários.

  6. Considere Alternativas Nativas: Sempre que possível, prefira usar funcionalidades nativas da Rockty em vez de códigos externos. Isso garante maior compatibilidade e menor risco de problemas de desempenho ou segurança.

  7. Atualize e Monitore Regularmente: Códigos de terceiros podem mudar ou expirar. Monitore regularmente os embeds em sua página para garantir que eles ainda funcionam como esperado.

  8. Evite Margens Negativas e Ajustes Extremos: Quando posicionar o elemento Embed, evite usar margens negativas ou valores extremos que possam afetar o layout da página. Isso ajuda a prevenir conflitos de posicionamento com outros elementos.

  9. Considere a Responsividade: Lembre-se de testar o comportamento do código inserido em diferentes dispositivos (desktop, tablet, mobile) para garantir que ele seja responsivo e se adapte bem a todas as telas.

  10. Tutoriais Relacionados: Se você estiver interessado em aprender como inserir mapas ou formulários usando o elemento Embed, confira nossos tutoriais dedicados a esses recursos:

Precisa de Ajuda?

Se tiver dúvidas ou precisar de suporte adicional, entre em contato com nossa equipe de Suporte!