Módulo de caixa de compra

Este artigo abrange os módulos de caixa de compra e descreve como adicioná-los às páginas de site no Microsoft Dynamics 365 Commerce.

O termo caixa de compra geralmente se refere à área de uma página de detalhes de produto (PDP) que está "na primeira página" e que hospeda todas as informações mais importantes necessárias para a compra de um produto. (Uma área que está na "primeira página" fica visível quando a página é carregada pela primeira vez, para que os usuários não precisem rolar para baixo para vê-la).

Um módulo de caixa de compra é um contêiner especial usado para hospedar todos os módulos mostrados na área da caixa de compra de uma página de detalhes do produto.

A URL da página de detalhes do produto inclui a ID do produto. Todas as informações necessárias para renderizar um módulo de caixa de compra são derivadas dessa ID de produto. Se uma ID de produto não for fornecida, o módulo da caixa de compra não será renderizado corretamente em uma página. Portanto, um módulo de caixa de compra pode ser usado somente em páginas que têm contexto de produto. Para usá-lo em uma página que não tenha um contexto de produto (por exemplo, uma página inicial ou uma página de marketing), você deve fazer personalizações adicionais.

A imagem a seguir mostra um exemplo de um módulo de caixa de compra em uma página de detalhes de produtos.

Exemplo de um módulo de caixa de compra.

Propriedades e slots do módulo de caixa de compra

Na página de detalhes do produto, uma caixa de compra é dividida em duas regiões: uma região de mídia à esquerda e uma região de conteúdo à direita. Por padrão, a razão entre a largura da coluna da região da mídia e a largura da coluna da região do conteúdo é 2:1. Nos dispositivos móveis, as duas regiões são empilhadas, para que uma região apareça abaixo da outra região. Os temas podem ser usados para personalizar as larguras de coluna e a classificação de empilhamento.

Um módulo de caixa de compra renderiza o título, a descrição, o preço e as classificações de um produto. Ele também permite que os clientes selecionem grades de produtos que têm atributos de produto diferentes, como tamanho, estilo e cor. Quando uma grade de produto é selecionada, outras propriedades na caixa de compra (por exemplo, a descrição e as imagens do produto) são atualizadas para refletir as informações da grade.

Um seletor de quantidade é fornecido para que os clientes possam especificar a quantidade de itens a comprar. A quantidade máxima que pode ser comprada pode ser definida nas configurações do site.

Na caixa comprar, os clientes também podem executar ações como adicionar um produto ao carrinho, adicionar um produto à sua lista de desejos e selecionar um local de retirada. Essas ações podem ser executadas em um produto ou em uma grade de produto. Para adicionar um produto a uma lista de desejos, o cliente deve estar conectado.

Os temas podem ser usados para remover ou alterar a ordem das propriedades do produto da caixa de compra e os controles de ação.

Propriedades do módulo

  • Marca do título – Esta propriedade define a marca do título para o título do produto. Se a caixa de compra estiver na parte superior da página, essa propriedade deverá ser definida como h1 para atender aos padrões de acessibilidade.

  • Habilitar recomendações de "comprar looks semelhantes" - Esta propriedade permite à caixa de compra mostrar links para produtos semelhantes ao item exibido no momento. Este recurso está disponível nas versões 10.0.13 e posterior do Commerce.

Módulos que podem ser usados em um módulo de caixa de compra

  • Galeria de mídia – Este módulo é usado para mostrar imagens de um produto em uma página de detalhes do produto. Para obter mais informações sobre esse módulo, consulte Módulo de galeria de mídia.
  • Seletor de loja – Este módulo mostra uma lista de lojas próximas, onde um item está disponível para retirada. Ele permite que os usuários insiram um local para encontrar lojas próximas. Para obter mais informações sobre esse módulo, consulte Módulo de seletor de loja.
  • Compartilhamento social - Este módulo pode ser adicionado à caixa de compra para permitir que os usuários compartilhem informações do produto nas redes sociais. Para obter mais informações, consulte Módulo de compartilhamento social.

Configurações do módulo de caixa de compra

As seguintes configurações de módulo de caixa de compra podem ser definidas em Configurações de Site > Extensões:

  • Limite de quantidade de linha de carrinho – Esta propriedade é usada para especificar o número máximo de cada item que pode ser adicionado ao carrinho. Por exemplo, um varejista pode decidir que apenas 10 de cada produto podem ser vendidos em uma única transação.
  • Estoque – para obter informações sobre como aplicar configurações de estoque, consulte Aplicar configurações de estoque.
  • Adicionar produto ao carrinho – Para obter informações sobre como aplicar as configurações de Adicionar produto ao carrinho, consulte configurações de Adicionar produto ao carrinho.

Extensões de definição do módulo de caixa de compra no tema Adventure Works

O módulo de caixa de compra que o tema da Adventure Works fornece tem uma extensão de definição de módulo que oferece suporte à implementação de um módulo de especificações de produtos em um módulo acordeão em uma caixa de compra de PDP. Para exibir atributos de especificação de produto em uma caixa de compra de PDP, adicione um módulo de especificação de produto ao slot do módulo acordeão no slot da caixa de compra.

Importante

O tema Adventure Works está disponível a partir da versão 10.0.20 do Dynamics 365 Commerce.

Interação do Commerce Scale Unit

O módulo de caixa de compra recupera informações do produto usando as interfaces de programação de aplicativos (APIs) de Commerce Scale Unit. A ID de produto na página de detalhes do produto é usada para recuperar todas as informações.

Adicionar um módulo de caixa de compra a uma página

Para adicionar um módulo de caixa de compra a uma nova página e definir as propriedades necessárias, siga estas etapas.

  1. Acesse Fragmentos e selecione Novo para criar um novo fragmento.
  2. Na caixa de diálogo Novo fragmento, selecione o módulo Caixa de compra.
  3. Em Nome do fragmento, digite o nome Fragmento de caixa de compra e selecione OK.
  4. No slot Galeria de Mídia do módulo de caixa de compra, selecione as reticências (...) e, depois, Adicionar módulo.
  5. Na caixa de diálogo Selecionar módulos, selecione o módulo Galeria de mídia e, depois, OK.
  6. No slot Seletor de loja do módulo de caixa de compra, selecione as reticências (...) e, depois, Adicionar módulo.
  7. Na caixa de diálogo Selecionar módulos, selecione o módulo Seletor de loja e, depois, OK.
  8. Selecione Salvar, Concluir edição para fazer check-in do fragmento e depois selecione Publicar para publicá-lo.
  9. Acesse Modelos e selecione Novo para criar um novo modelo.
  10. Na caixa de diálogo Novo modelo, em Nome do modelo, insira Modelo PDP e selecione OK.
  11. No slot Corpo, selecione as reticências (...) e, depois, Adicionar módulo.
  12. Na caixa de diálogo Selecionar módulos, selecione o módulo Página Padrão e, depois, OK.
  13. No slot Principal da página padrão, selecione as reticências (...) e, em seguida, selecione Adicionar fragmento.
  14. Na caixa de diálogo Selecionar um fragmento, selecione o fragmento Fragmento de caixa de compra criado anteriormente e, depois, selecione OK.
  15. Selecione Salvar, Concluir edição para fazer check-in do modelo e depois selecione Publicar para publicá-lo.
  16. Acesse Páginas e selecione Novo para criar uma nova página.
  17. Na caixa de diálogo Criar uma nova página, em Nome da página, insira uma Página PDP e, depois, selecione Avançar.
  18. Em Escolha um modelo, selecione Modelo de PDP e, depois, Avançar.
  19. Em Escolher um layout, selecione um layout de página (por exemplo, Layout flexível) e selecione Avançar.
  20. Em Revisar e concluir, revise a configuração da página. Se você precisar editar as informações da página, selecione Voltar. Se as informações da página estiverem corretas, selecione Criar página.
  21. No slot Principal da nova página, selecione as reticências (...) e, em seguida, selecione Adicionar fragmento.
  22. Na caixa de diálogo Selecionar um fragmento, selecione o fragmento Fragmento de caixa de compra criado anteriormente e, depois, selecione OK.
  23. Salve e exiba a página. Adicione o parâmetro da sequência de caracteres da consulta ?productid=<product id> à URL da página de exibição. Dessa forma, o contexto do produto é usado para carregar e renderizar a página de exibição.
  24. Selecione Salvar, Concluir edição para fazer check-in da página e depois selecione Publicar para publicá-lo. Uma caixa de compra deve aparecer na página de detalhes do produto.

Recursos adicionais

Visão geral da biblioteca de módulos

Módulo de seletor de loja

Módulo de galeria de mídia

Módulo de contêiner

Módulo de carrinho

Módulo de finalização da compra

Módulo de confirmação da ordem

Módulo de cabeçalho

Módulo de rodapé

Módulo de compartilhamento social

Configurações de adicionar produto ao carrinho

Calcular disponibilidade de estoque para canais de varejo

SDK e atualizações da biblioteca de módulos