Editar o código de origem no Editor de conteúdo avançado

  • Versão de lançamento: Washingtondc
  • Atualizado 1 de fev. de 2024
  • 2 min. de leitura

    • Modifique o código de origem HTML e CSS de todos os elementos na tela ou de um elemento específico.

    Crie o layout usando elementos HTML, edite diretamente o CSS de um elemento para adicionar um estilo que não está disponível na interface da tela ou copie e cole o código para migrar conteúdo de outras fontes.Adicionar uma borda ao redor de uma linha e personalizar a fonte do cabeçalho

    Recursos e capacidades

    Garantir a segurança do portal
    Quando você clica em Aplicar na janela Editar código, o editor de código remove marcadores HTML que podem ser usados para comprometer sua instância. Para obter mais informações, consulte HTML sanitizer.
    Identificar código importante
    A janela de edição destaca os fragmentos de CSS em vermelho se eles não devem ser excluídos. Isso indica uma configuração que faz parte do tema do portal ou que vários elementos usam esse código.
    Além disso, se você excluir uma regra de CSS que seja referenciada por um dos seguintes elementos HTML, o editor de código restabelecerá a regra de CSS:
    • Linha
    • Célula
    • Tela
    • Divisor
    • Botão
    • Bloco de link
    • Guias
    Remover código desnecessário
    Quando você salva suas mudanças, o editor de código remove todas as regras de CSS não utilizadas.
    Por outro lado, se o editor de código restabelecer uma regra de CSS que você está tentando remover, realce esse bloco de código CSS e clique no botão Remover CSS para substituir o editor de código.
    Figura 1. Exemplo de uso do botão Remover CSS

    No vídeo a seguir, o usuário tenta excluir uma regra de CSS usando a tecla de exclusão, mas o sistema restabelece o código. Em seguida, o usuário realça o código e clica em Remover CSS, o que remove o código com sucesso.

    O usuário tenta sem sucesso excluir uma regra de CSS usando a tecla de exclusão, então ele usa o botão Remover CSS, que remove o código realçado
    Nota:
    Este recurso não está disponível por padrão. Um administrador deve habilitar a propriedade Editar código. Veja Propriedades instaladas com o Content Publishing

    Considerações importantes

    • Adicionar HTML e CSS personalizados pode prejudicar seu design. Prossiga com cuidado ao usar este recurso. O Editor de conteúdo avançado não rastreia as mudanças no editor de código, portanto, o botão Desfazer não reverterá de forma confiável as mudanças de código.
    • Não recomendamos o uso de elementos HTML (como div ou p) para definir regras de CSS, pois isso pode ter consequências não intencionais.
      Figura 2. Exemplo de resultado inesperado ao usar o elemento HTML para definir a regra de CSS

      No exemplo a seguir, o usuário define uma regra de CSS para o elemento p em uma célula. No entanto, na visualização da página, as regras de estilo se aplicam aos elementos p em todas as caixas de texto, bem como no rodapé.

      O usuário define uma regra de CSS usando o elemento HTML p para uma célula, mas a regra é aplicada em toda a página