Como adicionar um botão para adicionar um produto a um Giflist em um template da prateleira

pablo · July 6, 2017, 7:39pm

edson_erg · July 6, 2017, 11:48pm

Pablo,

Neste caso basta você utilizar o controle abaixo para adicionar o item à uma lista:

$product.InsertSku

Seguem abaixo 2 artigos com os controles que a VTEX lhe oferece,caso queira dar uma olhada:

http://help.vtex.com/pt/tutorial/controles-do-template-de-prateleira

http://help.vtex.com/pt/tutorial/lista-de-controles-para-templates

Abs

pablo · July 7, 2017, 2:21pm

Olá @Edson Gagliardi , obrigado por responder.

Isto é o que mostra o controlador:

controlador

Mas como funciona? Como eu sei o que lista eu estou adicionando o produto?

obrigado

edson_erg · July 7, 2017, 2:31pm

No momento em que clicar no botão para adicionar à lista :

1 - A VTEX pedirá para o cliente se autenticar

2 - O item será adicionado a uma nova lista ou à uma lista pré existente.

Abaixo coloco 2 exemplos de loja que enviam produtos para a lista à partir das prateleiras ou da página de produto, caso queira dar uma olhada:

http://www.thenorthface.com.br

http://www.fnac.com.br

ykarolemes · July 7, 2017, 2:53pm

@Edson Gagliardi No caso dessas duas lojas foi a Enext que desenvolveu essa funcionalidade enviando para o Master Data os produtos e depois consultando.

O controle padrão da Vtex traz o que o "$product.InsertSku" renderiza mesmo.

Mas é possível fazer com o Master Data essa Wishlist.

gutvalente · August 13, 2017, 1:52am

Se for uma lista que o usuário precisa criar, por exemplo, lista de entrega ou crédito, você pode fazer da seguinte forma:

1. Criar um template incluindo na marcação o controle <vtex.cmc:GiftListInsertSkuV2 popup="false" />.

2. Criar um layout dentro da pasta /Quick-View, selecionando o template criado acima

3. Inserir um botão no seu template da prateleira com a função de chamar a página criada acima, por exemplo, em uma janela modal.

Exemplo:

<a class="btn-list" rel="$product.Id">Adicionar a lista</a>

$('body').on('click', '.btn-list', function(){		
    var _idProduct = $(this).attr('rel');
    var _lid = '{lid_do_seu_template}';
    $('body').prepend(
        '<div class="wrap-modal">' +
            '<div class="container-modal">' +
                '<iframe id="addlist" src="/quick-view/?idproduto='+_idProduct+'&KeepThis=true&lid='+_lid+'" frameborder="0" scrolling="no"></iframe>' +
                '<a class="close-modal">Fechar</a>' +
            '</div>' +
        '</div>'
    );
});