Adicione colunas com o Editor de conteúdo avançado

  • Versão de lançamento: Zurich
  • Atualizado 31 de jul. de 2025
  • 3 min. de leitura
  • Use Editor de conteúdo avançado tela para criar colunas para ajudar a definir e organizar seu layout para sua página.

    Antes de Iniciar

    Função necessária: sn_cd.content_manager

    Depois de concluir Novo conteúdo (consulte Criar conteúdo avançado) E navegado até a tela de conteúdo avançado, você pode criar conteúdo avançado.

    Você pode adicionar 1, 2 ou 3 colunas. Cada coluna atua como um contêiner para outros componentes. Cada componente de coluna também pode ser editado selecionando o componente e atualizando as propriedades nas configurações.
    Nota:
    A altura mínima de uma célula em uma coluna é 75px. Se você definir a altura da célula como menor, a célula transbordará a linha.

    Procedimento

    1. Navegue até a tela selecionando Editor aberto botão do Design . Novo conteúdo formulário.
    2. Em Editor de conteúdo avançado tela, você pode usar um método de arrastar e soltar para adicionar colunas.
      As colunas atuam como contêineres para o conteúdo que você está criando.
      Figura 1. Editor de conteúdo avançado
      Editor de conteúdo avançado - Tela e colunas

      Depois de soltar um Coluna 1 , Coluna 2 ou Coluna 3 em Editor de conteúdo avançado tela, há dois separadores que aparecem. O separador externo é rotulado Linha . O separador interno é rotulado Célula .

    Adicione estilo à linha ou às células, como cor de fundo, largura máxima ou preenchimento. Se você não quiser adicionar estilo, prossiga para os links na parte inferior desta página.
    1. Selecione uma linha ou célula para editar.
    2. Navegue até Configurações guia.
    3. Use qualquer uma das seguintes configurações de estilo:
      Nota:
      Gerentes de conteúdo e administradores têm a opção de aplicar cores de fundo aos elementos da tela selecionados, incluindo imagens. Os recursos disponíveis incluem o uso de cores sólidas e degradadas, bem como ajustes para opacidade da cor. Essas configurações podem ser acessadas no painel direito na guia Estilo de configurações ao adicionar conteúdo avançado a um elemento de tela.
      Tabela 1. Configurações de estilo
      Campo Configurações Descrição
      Estilização
      Cor de fundo Use o seletor de cores (quadrado cinza) para selecionar uma cor ou insira o código de cor que representa a cor de fundo que você deseja exibir.
      Todas as cores HTML são compatíveis. Para obter mais informações, consulte Nomes de cores HTML .
      Nota:
      O elemento de cor de fundo para tela mostra as opções de fundo para gradiente, cor e imagem. Ative e selecione as opções de plano de fundo.
      Estilo avançado
      Largura Especifique o valor inserindo um número ou arrastando o lado direito da célula.
      Selecione a unidade de medida:
      • pixel
      • percentual: percentual
      Altura Especifique o valor inserindo um número ou arrastando a parte inferior da linha.
      Selecione a unidade de medida:
      • pixel
      • percentual: percentual
      Preenchimento Preenchimento é o espaço entre o conteúdo e a borda de um elemento. Especifique o valor para preenchimento superior, inferior, direito ou esquerdo inserindo um número.
      Margem (somente para linhas) Margem é o espaço entre uma linha e outro elemento/o limite da tela. Especifique o valor para preenchimento superior, inferior, direito ou esquerdo inserindo um número.
      Borda (somente para células) Defina a largura, o estilo da borda e a cor.
      Raio da borda (somente para células) A configuração de raio arredonda o canto da borda.
      Propriedades
      ID Um ID exclusivo que identifica o elemento HTML.
      Título Uma dica de ferramenta ou informações que aparecem quando um usuário passa o mouse sobre o componente.
    4. Selecione Save (Salvar).

    O que Fazer Depois

    Adicione e estilize mais colunas para criar um layout para todo o conteúdo da página.