DocumentaçãoCommercePage Builder

Adicionar conteúdo - Bloquear

Last update: Sun Jul 14 2024 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Tópicos:

Criado para:

  • Iniciante
  • Intermediário
  • Usuário

Use o tipo de conteúdo Bloco para adicionar um bloco ativo existente ao Page Builder estágio. No exemplo a seguir, a primeira coluna contém o bloco com um menu lateral para a página. A segunda coluna contém uma imagem.

Bloquear com um menu lateral {width="600" modal="regular"}

NOTE
Se você estiver fazendo alterações significativas no conteúdo de Page Builder, é recomendável aumentar o Tempo de Vida da Sessão de Administrador para evitar que a sessão atinja o tempo limite enquanto você trabalha.

Bloquear caixa de ferramentas

Ferramenta
Ícone
Descrição
Mover
Ícone Mover
Move o contêiner de bloco e seu conteúdo para outra posição no palco.
Configurações
Ícone de configurações
Abre a página Editar Bloco, onde você pode escolher o bloco e alterar as propriedades do contêiner.
Ocultar
Ícone Ocultar
Oculta o container de bloco atual e seu conteúdo.
Mostrar
Mostrar ícone
Mostra o contêiner de bloco oculto e seu conteúdo.
Duplicar
Ícone duplicado
Faz uma cópia do contêiner de bloco e de seu conteúdo.
Remover
Ícone Remover
Exclui o contêiner de bloco e seu conteúdo do estágio.
NOTE
Os elementos ocultos são armazenados no banco de dados e invisíveis para os clientes. No entanto, esses elementos são visíveis para mecanismos de pesquisa e outros bots que rastreiam seu site. Eles também são retornados como parte do conteúdo, se solicitado por meio de uma chamada de API com um atributo de invisibilidade, a menos que você os remova do estágio.

Adicionar um bloco existente

  1. Navegue até o espaço de trabalho Page Builder na página de destino, bloco, bloco dinâmico, produto ou categoria.

  2. No painel Page Builder, expanda Add Content e arraste um espaço reservado Block para o estágio.

    Arrastando um bloco para o palco {width="600" modal="regular"}

  3. Passe o mouse sobre o contêiner de blocos vazios para exibir a caixa de ferramentas e escolha o ícone Configurações ( Configurações {width="25"} ).

  4. Clique em Select Block.

    Selecionando um bloco {width="200"}

  5. Na linha do bloco que deseja adicionar, clique em Select na última coluna.

    Bloco selecionado {width="600" modal="regular"}

    O nome do bloco selecionado aparece na página.

    Nome do bloco {width="200"}

  6. Preencha as configurações restantes conforme necessário, usando as descrições de campo no final desta página para referência.

  7. Quando terminar, clique em Save para aplicar as configurações e retornar ao espaço de trabalho Page Builder.

Configurações avançadas

  1. Para controlar o posicionamento do bloco no contêiner pai, escolha um Alignment:

    table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto
    Opção Descrição
    Default Aplica a configuração padrão de alinhamento especificada na folha de estilos do tema atual.
    Left Alinha a lista ao longo da borda esquerda do contêiner principal, com permissão para qualquer preenchimento especificado.
    Center Alinha a lista no centro do contêiner pai, com permissão para qualquer preenchimento especificado.
    Right Alinha o bloco ao longo da borda direita do contêiner principal, com permissão para qualquer preenchimento especificado.

  2. Defina um estilo Border que seja aplicado a todos os quatro lados do contêiner de bloco:

    table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 5-row-2 6-row-2 7-row-2 8-row-2 9-row-2 10-row-2 layout-auto
    Opção Descrição
    Default Aplica o estilo de borda padrão especificado pela folha de estilos associada.
    None Não fornece nenhuma indicação visível das bordas do contêiner.
    Dotted A borda do contêiner aparece como uma linha pontilhada.
    Dashed A borda do contêiner aparece como uma linha tracejada.
    Solid A borda do contêiner aparece como uma linha sólida.
    Double A borda do contêiner aparece como uma linha dupla.
    Groove A borda do contêiner é exibida como uma linha com ranhura.
    Ridge A borda do contêiner aparece como uma linha estriada.
    Inset A borda do contêiner aparece como uma linha interna.
    Outset A borda do contêiner aparece como uma linha de saída.

  3. Se você definir um estilo de borda diferente de None, conclua as opções de exibição de borda:

    table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto
    Opção Descrição
    Border Color Especifique a cor escolhendo uma amostra, clicando no seletor de cores ou inserindo um nome de cor válido ou um valor hexadecimal equivalente.
    Border Width Insira o número de pixels para a largura da linha de borda.
    Border Radius Insira o número de pixels para definir o tamanho do raio usado para arredondar cada canto da borda.

  4. (Opcional) Especifique os nomes de CSS classes da folha de estilos atual para aplicar ao contêiner.

    Separe vários nomes de classe com um espaço.

  5. Insira valores, em pixels, para que Margins and Padding determine as margens externas e o preenchimento interno do contêiner de blocos.

    Insira os valores correspondentes no diagrama.

    table 0-row-2 1-row-2 2-row-2 layout-auto
    Área de contêiner Descrição
    Margins A quantidade de espaço em branco aplicada à borda externa de todos os lados do container. Opções: Top / Right / Bottom / Left
    Padding A quantidade de espaço em branco aplicada à borda interna de todos os lados do contêiner. Opções: Top / Right / Bottom / Left

Editar configurações de bloco

  1. Passe o mouse sobre o contêiner de blocos e escolha o ícone Configurações ( Ícone Configurações {width="25"} ) na caixa de ferramentas.

    Caixa de Ferramentas de Bloqueio {width="600" modal="regular"}

  2. Para escolher um bloco diferente, clique em Select Block.

    • Na lista de blocos ativos, clique no bloco Select que deseja adicionar.
    • Clique em Add Selected.

  3. Atualize as configurações restantes conforme necessário, usando as descrições de campo no final desta página para referência.

  4. Quando terminar, clique em Save para aplicar as configurações e retornar ao espaço de trabalho Page Builder.

Duplicar um bloco

  1. Passe o mouse sobre o contêiner de blocos para exibir a caixa de ferramentas e escolha o ícone Duplicar ( Duplicar ícone ).

    A duplicata é exibida logo abaixo do original.

  2. Para mover o novo bloco para uma nova posição, passe o mouse sobre o contêiner e clique em Mover ( ícone Mover ) na caixa de ferramentas.

  3. Selecione e arraste o bloco até que a diretriz vermelha apareça na nova posição.

    As bordas superior e inferior de cada contêiner são exibidas como linhas tracejadas enquanto o bloco é movido.

Remover um bloco do estágio

  1. Passe o mouse sobre o contêiner de blocos para exibir a caixa de ferramentas e escolha o ícone Remover ( Remover ícone ).

  2. Quando for solicitada a confirmação, clique em OK.

recommendation-more-help
85b60248-86a4-4d5f-9933-5179643f608d