Customizar a seção Meus Pedidos

Aparência da Loja

Daniel Fosco

Daniel Fosco

Última atualização

A nova seção Meus Pedidos (My Orders) é uma atualização major em relação à anterior, que altera todo o layout da página, por isso requer que a customização seja refeita.

Ela já está disponível no ambiente beta (sualoja.vtexcommercebeta.com.br) para testes, e é ativada sob demanda, conforme o nosso artigo de apresentação da nova seção.

Veja abaixo uma lista com as classes disponíveis para customização.

Customizações de interface não são oficialmente suportadas pela VTEX.

Estas classes e configurações podem ser alteradas ou removidas em futuras atualizações. Como boa prática, recomendamos tratar erros de javascript para que seu código de customização não quebre caso uma classe seja removida no futuro.
Caso você já possua um arquivo de customização para a antiga versão do My Orders, recomendamos que coloque a nova customização em um arquivo separado.

Lista de pedidos

Página de lista de pedidos com classes para customização destacadas sobre ela

CSS:

.myo-toggle // Toggle para seleção da lista de pedidos  
.myo-order-card // Card do pedido  
.myo-order-header // Header do card do pedido
.myo-order-sku // Elemento do SKU
.myo-invoice-btn // Botão de impressão de invoice
.myo-details-btn // Link para detalhes do pedido
.myo-cancel-btn // Link para cancelamento do pedido

Detalhe do pedido

Página de detalhe do pedido com classes para customização destacadas sobre ela

CSS:

.myo-workflow // Workflow do pedido
.myo-product-row // Linha do produto pedido

Cancelamento de pedido

Página de cancelamento do pedido com classes para customização destacadas sobre ela

CSS:

.myo-option-heading // Heading da seção de razões
.myo-option // Linha com opção de cancelamento
.myo-option-disclaimer // Box com avisos sobre cancelamento do pedido
.myo-summary // Sidebar com o sumário do pedido
.myo-summary-header // Header da sidebar
.myo-summary-product // Linha com o produto do pedido na sidebar

Este artigo foi útil?