Retorna o conjunto de banners cadastrados para uma página específica do site.
Utilize nosso dashboard (https://banner.chaordic.com.br) para definir regras de negócio e configurar os banners que deverão ser exibidos em cada página do seu site.
Detalhes sobres os parâmetros
deviceId
O deviceId
é o campo responsável por identificar o dispositivo do usuário. Ele é de extrema importância, pois é através dele que a nossa api de banners consegue gerar métricas, além de personalizar a ordem dos slides, buscando exibir o conteúdo de maior aderência ao usuário, gerando um maior engajamento, e maior receita.
Esse campo deve ser único e permanente para cada dispositivo de usuário diferente.
Exemplo
Um usuário acessa a loja utilizando os seguintes canais:
- Website no navegador Chrome em um laptop;
- Website no navegador Firefox no mesmo laptop acima;
- App da loja em um dispositivo Android;
Em cada um dos dispositivos mencionados, as requests devem ser feitas utilizando-se um deviceId diferente, e esse deviceId deve ser mantido durante todos os acessos do usuário no dispositivo em questão.
Atenção
Caso a coleta de eventos seja realizada pelos nossos scripts, através do
loader.js
, odeviceId
é gerado automaticamente pelo nosso script, e armazenado no cookiechaordic_browserId
. Nesse caso, o valor do campo enviado nas requisições deve ser igual ao conteúdo do cookie mencionado.
userId
O userId
é o campo que identifica o usuário entre todos os dispositivos. É o identificador único do usuário, o mesmo utilizado no site. É através dele que conseguimos identificar um único usuário mesmo acessando entre diversos dispositivos diferentes, e dessa forma unificar o seu histórico de navegação nos múltiplos dispositivos de acesso e trazer uma experiência unificada, melhorando ainda mais a qualidade da personalização.
Esse campo apesar de ser opcional, é tão importante quanto o deviceId
e deve ser enviado em conjunto com o mesmo, sempre que o usuário estiver autenticado no site.
Exemplo
Um usuário acessa a loja utilizando os seguintes canais:
- Website no navegador Chrome em um laptop, estando logado;
- Website no navegador Firefox no mesmo laptop acima, sem estar logado;
- App da loja em um dispositivo Android, estando logado;
No caso dos acessos 1, e 3 o valor do campo userId
deve ser o mesmo, pois é o mesmo usuário que está autenticado. No caso do acesso 2, o userId
não pode ser enviado na requisição, uma vez que o usuário não está autenticado no site.
Tracking de eventos
Para termos o acompanhamento de performance dos banners e slides cadastrados, existem dois eventos que devem ser fornecidos: visualizações e clicks em slides.
Cada slide retornado contém dois links prontos para serem enviados, conforme a trigger de disparo.
{
"name": "Novo slide",
"url": "www.customer.com/my-product",
"clickUrl": "https://banner.chaordicsystems.com/v1/events/clicks/?clickId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"viewUrl": "https://banner.chaordicsystems.com/v1/events/views/?viewId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"content": {
"type": "image",
"imageUrl": "//myimage.com/my",
"html": null
}
}
Eventos de visualizações de slides
Cada Banner é formado por uma lista de slides. Quando um slide é apresentado a um cliente, é necessário que seja disparado um evento de visualização de slide no link viewUrl.
Eventos de clicks de slides
Quando ocorre um click em um slide apresentado, precisamos que o evento de click seja disparado no lin clickUrl.
OBSERVAÇÃO: Devido ao browser cancelar requisições que são disparadas durante uma troca de página, recomendamos que no evento de click em um slide, o disparo do evento seja retardado para o próximo carregamento de página. Assim evitamos perder eventos.
Tipos de Página
Tipo | Descrição |
---|---|
home | Página inicial da aplicação |
product | Produto |
category | Categoria |
subcategory | Subcategoria |
cart | Carrinho de compras |
confirmation | Confirmação de compra |
userprofile | Página do usuário |
not_found | Erro 404 |
search | Busca |
landing_page | Landing page |
other | Outras |
Formato do JSON de Resposta
A resposta da API é um JSON com uma lista de banners que estão configurados para a página definida na consulta.
Cada Banner possiu uma série de atributos referentes ao design configurado na nossa central de controles. Estes atributos determinam como o banner deverá ser renderizado, efeitos de transição, padrão de setas, paginação, etc.
Além dos atributos de estilo do banner, temos também uma lista de slides. Cada slide representa um conteúdo que deverá ser impresso no banner. Eles funcionam como os produtos dentro da vitrine, que é o banner.
[{
"name": "Category Banner TV",
"div": "lnc-banner",
"slides": [{
"name": "Primeiro slide",
"url": "www.customer.com/my-product",
"clickUrl": "https://banner.chaordicsystems.com/v1/recommendations/events/clicks/?clickId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"viewUrl": "https://banner.chaordicsystems.com/v1/events/views/?viewId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"content": {
"type": "image",
"imageUrl": "//myimage.com/my",
"html": null
}
}, {
"name": "Segundo slide",
"url": "www.customer.com/my-favorite-brand",
"clickUrl": "https://banner.chaordicsystems.com/v1/events/clicks/?clickId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"viewUrl": "https://banner.chaordicsystems.com/v1/events/views/?viewId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"content": {
"type": "html",
"imageUrl": null,
"html": '<html></html>'
}
}]
}]
Exemplo de resposta contendo as configurações de layout
[{
"name": "Category Banner TV",
"div": "lnc-banner",
"slides": [{
"name": "Primeiro slide",
"url": "www.customer.com/my-product",
"clickUrl": "https://banner.chaordicsystems.com/v1/recommendations/events/clicks/?clickId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"viewUrl": "https://banner.chaordicsystems.com/v1/events/views/?viewId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"content": {
"type": "image",
"imageUrl": "//myimage.com/my",
"html": null
}
}, {
"name": "Segundo slide",
"url": "www.customer.com/my-favorite-brand",
"clickUrl": "https://banner.chaordicsystems.com/v1/events/clicks/?clickId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"viewUrl": "https://banner.chaordicsystems.com/v1/events/views/?viewId=CgtuZXRzaG9lcy1ichIIY2F0ZWdvcnkaCGRlc2t0b3BzIgNkZXYyJDMwMDM3NjE5LTNlM2MtNGExNy1iMTU2LTM4Y2E0NTJmNzI0NTokNjhlZDNmMDAtNDdlZC0xMWU4LThjOWYtM2JiMWExNzkwYTBk",
"content": {
"type": "html",
"imageUrl": null,
"html": '<html></html>'
}
}],
"layout": {
"arrows": {
"type": "default",
"width": "10px",
"height": "10px",
"leftSpace": "10px",
"rightSpace": "10px"
},
"navigation": {
"type": "circle",
"width": "10px",
"height": "10px",
"leftSpace": "10px",
"rightSpace": "10px",
"bottomPosition": "10px",
"leftPostion": "10px",
"centerPosition": false,
"activeColor": "#FFF",
"inactiveColor": "#000",
"borderSize": "1px",
"borderActiveColor": "#CCC",
"borderInactiveColor": "#111"
},
"transition": {
"type": "fade",
"transitionDuration": 100,
"slideDuration": 5
}
}
}]