As vitrines da solução Onsite permitem exibir uma loja diferente para cada cliente que acessa seu ecommerce. Conheça este produto.

A configuração de integração é bastante simples: basta disponibilizar um método para adição ao carrinho e inserir algumas divs nas páginas onde serão exibidas as vitrines.

1. Método de adição ao carrinho

As vitrines Carrinho ("leve também" na página de carrinho) e Complementar ("compre junto" na página de produto) permitem que o cliente adicione produtos ao carrinho diretamente através destas vitrines. Para que isso seja possível, é necessário que você disponibilize o método utilizado para adicionar itens ao carrinho no site. O método deve possibilitar a adição de um ou mais produtos simultaneamente.

A seguir exibimos 2 exemplos de métodos de adição ao carrinho. Sinta-se à vontade para utilizá-los como referência se precisar implementar o método do zero.

Exemplo 1 – via Javascript

Assinatura do método: function addToCart(skus) { ... }
Parâmetro skus: Array dos SKUs a serem inseridos no carrinho.
Exemplo da chamada:

var skus = [],
skus.push("1234");  /* SKUs dos produtos a serem incluidos no carrinho */
skus.push("5678");
skus.push("9012");
addToCart(skus);

Exemplo 2 – via Web Service

Método: POST
Formato de parâmetros: application/x-www-form-urlencoded
Nome do parâmetro: skus[]
Exemplo da chamada:

var cartUrl = "http://www.sualoja.com/addtocart",
    skus = [];
skus.push("skus[]=1234");  /* SKUs dos produtos a serem incluidos no carrinho */
skus.push("skus[]=5678");
skus.push("skus[]=9012");
jQuery.ajax({
    type: "POST",
    url: cartUrl,
    data: skus.join("&"),
    success: function() { alert("Produtos adicionados ao carrinho") }
});

2. Adição das DIVS

Adicione as 3 divs genéricas (TOP, MIDDLE e BOTTOM) com marcações da Linx nos lugares onde as vitrines serão exibidas. Você não precisa definir uma altura para as divs mas certifique-se que elas estão dentro do container principal para que não ultrapassem a largura da página.

Posteriormente você poderá configurar através da Central Impulse quais vitrines ocuparão cada área reservada.

<!-- Linx TOP -->
<div chaordic="top"></div>

<!-- Linx MIDDLE -->
<div chaordic="middle"></div>

<!-- Linx BOTTOM -->
<div chaordic="bottom"></div>

Posicionamento das divs nas páginas do ecommerce

Insira as divs conforme o recomendado para cada tipo de página.

Adicione as divs às demais páginas do ecommerce, como landing page, perfil do cliente e páginas de erro conforme o layout da página e estratégia de exibição das vitrines.

Validando o posicionamento

Vá até a página do plugin na Chrome Web Store e adicione-o ao seu navegador.

Em cada tipo de página, clique no plugin e verifique se o posicionamento está como esperado.