C cenaly.com
Começar grátis

Pedidos online no seu próprio site

Botões "Adicionar ao carrinho" e checkout sobrepostos ao seu site existente

On this page 10

Pedido online no seu site

O widget "Pedido online" adiciona o recebimento de pedidos ao site que você já tem. Não é preciso migrar nem refazer o layout: o widget lê as páginas do seu site, coloca nelas os botões "Adicionar ao carrinho" e conduz o carrinho e a finalização do pedido por cima do seu layout.

Onde: Marketing → "Meu site" → card "Pedido online" → engrenagem. O código de instalação é o mesmo para todos os widgets, consulte Meu site.


Quatro modos de operação#

Modo O que o visitante vê Quando escolher
Vitrine própria Botão "Pedir"; ao clicar, abre a sua vitrine com menu e carrinho sobre a página Site institucional, página de destino, blog — não há produtos nas páginas
Sobre o site Nossos botões "Adicionar ao carrinho" diretamente no seu layout — na página do produto e no catálogo, carrinho no canto da tela O site já tem catálogo de produtos, mas não tem recebimento de pedidos (ou ele é inconveniente)
Substituir botões O mesmo, mais os botões "comprar" nativos e o carrinho do site ficam ocultos Você quer que todos os pedidos passem somente por nós
Interceptação total O site parece intacto: os botões continuam nativos, mas ao clicá-los o produto vai para o nosso carrinho, o acesso ao carrinho do site abre o nosso, e os contadores e valores mostram os nossos números A vitrine já está bem montada — você não quer mudar a aparência dela, mas os pedidos e preços devem ser os nossos

Escaneamento do site#

Todos os modos, exceto a "vitrine própria", funcionam por um mapa do site: onde nas suas páginas estão o nome do produto, o preço, a imagem, o botão de compra nativo e o carrinho nativo.

O mapa é construído pelo scanner: informe o endereço e clique em "Escaneie o site" — geralmente 1–3 minutos. Por dentro:

  1. Presets de plataformas — há um conjunto pronto de seletores para oito plataformas: WooCommerce, Shopify, Magento, PrestaShop, Bitrix, InSales, Tilda, OpenCart. O scanner reconhece por impressão digital também Ecwid, Squarespace e Wix, mas não há preset para eles — o mapa é construído por análise de IA;
  2. Análise de IA do layout — para sites feitos sob medida e temas não padronizados;
  3. Verificação de cada seletor encontrado em páginas reais; os dados são conferidos com a marcação de produto. Um seletor não verificado não entra no mapa — é melhor menos botões do que um botão no lugar errado.

No final, é possível ver: a plataforma identificada, o número de páginas escaneadas, um exemplo de produto reconhecido e, separadamente, a página do produto e os cards do catálogo. O mapa é aplicado por um botão e salvo junto com as configurações do widget. O site mudou — basta escanear novamente.


Posicionamento dos botões e aparência#

Configura-se em maquetes com pré-visualização ao vivo — uma página de produto típica e o catálogo:

  • Botão na página do produto: abaixo do preço, ao lado do botão nativo do site, flutuante na parte inferior da tela ou desativado (o cenário principal da "interceptação total" — não há botão próprio, o visitante clica no nativo);
  • Botão no card do catálogo: sobre o card, abaixo do card ou desativado;
  • Botão do carrinho: qualquer um dos quatro cantos da tela;
  • Cor dos botões e texto ("Adicionar ao carrinho", "Pedir", personalizado) — o rótulo pode ser definido separadamente para cada idioma do seu site.

Seus preços#

Um botão separado: o widget recalcula o preço do seu site para o seu e o mostra ao visitante — na página do produto, no catálogo e no carrinho.

  • Regra base para todos os produtos: percentual, acréscimo em moeda, limites "não inferior / não superior" e arredondamento (para inteiro, final …9, centavos .99, dezenas exatas …0, múltiplo de 10/50/100).
  • Substituições pontuais por endereço da página, nome ou código do produto: preço próprio, regra própria, outro nome no carrinho ou "fora de venda" — nesse caso o botão não é colocado.
  • Opções de exibição: preço antigo riscado ao lado do novo, rótulo como "preço promocional", rótulo próprio de moeda, locais adicionais com preços (painel fixo, bloco "produtos semelhantes"). A reescrita de preços diretamente na marcação do site também pode ser desativada: o visitante verá o preço do site, mas o seu preço irá para o carrinho.
  • Na conta há uma pré-visualização "antes → depois" em um preço de exemplo do seu site.

⚠️ A reescrita é visual: o backend do seu site não sabe do novo preço. Por isso, preços próprios fazem sentido junto com a interceptação do pedido — caso contrário, o visitante que clicar em um botão nativo remanescente fará o pedido pelo preço antigo, fora de você. No modo "Interceptação total", os preços próprios vêm ativados por padrão, e o painel administrativo avisa se você os ativou sem a interceptação.


O que acontece após o pedido#

O visitante coloca os produtos no carrinho, abre-o e finaliza o pedido — nome, telefone, entrega ou retirada no local com endereço, comentário. O pedido chega à seção "Pedidos" da conta, em igualdade com os pedidos da vitrine, do caixa e dos agregadores: os mesmos status, notificações, impressão e envio para a cozinha. Não há uma "caixa de entrada do widget" separada. Cada linha do pedido vem com um link para a página do seu site de onde o produto foi colocado no carrinho — o operador vê exatamente o que foi pedido.

Todo o restante sobre o pedido online é configurado no mesmo lugar, no modal do widget: ele é organizado como um acordeão com as seções "Widget no seu site", "Recebimento de pedidos", "Entrega e retirada no local", "Pagamento", "Finalização do pedido" e "Fiscalização de recibos" — os mesmos formulários das seções correspondentes da conta, reunidos em um só lugar.


Botão "Avise-me quando chegar"#

A segunda tag, separada, do mesmo Widget — para a página de um produto esgotado no seu site. O visitante clica no botão, deixa o e-mail, confirma-o pelo link da mensagem e recebe um e-mail quando o produto voltar ao estoque; no e-mail de confirmação, ao lado de "confirmar" há também "recusar". As notificações são enviadas pelo mesmo mecanismo da Assinatura "avise-me quando chegar" na nossa Vitrine — não se cria uma segunda.

Como conectar: na janela de configurações do Pedido online, abra o cartão "🔔 Avise-me quando chegar", escolha o produto e, se houver, a variação do seu catálogo publicado — o gerador monta o código. Na página do produto, coloque o botão com o atributo data-cenaly-stock="<товар>" (exemplo pronto no mesmo cartão) e insira uma vez a tag stock/v1.js. O acionador pesa menos de um kilobyte e faz exatamente uma coisa — esperar o clique; o formulário de Assinatura, os dicionários e o envio chegam em um arquivo separado somente após a ação do visitante.

O que é importante saber:

  • O produto é vinculado manualmente. Não comparamos catálogo de terceiros nem lemos estoques de página de terceiros: "voltou ao estoque" é o estoque no seu catálogo conosco, o mesmo que a nossa Vitrine vê. Um produto que não está no catálogo publicado da Unidade não é aceito pelo botão.
  • A Assinatura é confirmada por e-mail (double opt-in): até o clique no link da mensagem, os e-mails de reposição não são enviados.
  • A Assinatura não reserva o produto. A notificação é enviada quando o produto volta ao estoque no nosso catálogo. Na versão atual, um e-mail é considerado uma vez por produto: uma nova Assinatura para outra variação do mesmo produto não substitui a variação já escolhida.
  • Com CSP estrita, apenas com nonce, o formulário de Assinatura ainda não abre sem uma permissão adicional de scripts do CDN ou uma política 'strict-dynamic' adequada: detalhes em "Meu site".
  • Não é uma tag única. O botão "Avise-me quando chegar" não é carregado pelo carregador único do "Meu site" — ele tem a própria tag e a própria marcação na página, porque fica apenas onde você o colocou.

Limitações#

  • O Scanner lê o HTML do servidor. Se o catálogo é desenhado inteiramente por JavaScript, as páginas de produto podem não ser encontradas — nesse caso, funciona o modo "Sua Vitrine".
  • Os produtos no carrinho são obtidos das páginas do seu site, e não do catálogo na Conta: o nome e o preço o Widget lê da própria página (e, se necessário, recalcula conforme a sua regra de preços). Não é preciso migrar o catálogo para nós por causa disso — mas esses Pedidos também não dão baixa nos estoques da Conta.
  • No carrinho do Widget, é possível escolher pagamento na entrega ou pagamento online, se para a Unidade estiver configurado um provedor compatível. Após a criação do Pedido, o visitante vai para a página do provedor; o próprio Widget não recebe os dados do cartão. Se não foi possível preparar o pagamento, é possível repeti-lo para um Pedido já criado.
  • No modo "Substituir botões", os botões nativos são ocultados visualmente; se o site tiver outro caminho para o checkout (por exemplo, um link direto para um carrinho de terceiros), é preciso removê-lo por conta própria — ou mudar para o modo "Interceptação total", que assume esses redirecionamentos.

Solução de problemas#

Não há botões "Adicionar ao carrinho" no site.

  1. Tag não encontrada — clique em "Verificar instalação" na seção "Meu site". "Código ausente" — a tag não foi inserida ou não está em todas as páginas do template; "código de outra Unidade" — a tag tem um data-domain de outra Unidade. Se a tag for inserida pelo Google Tag Manager, a verificação não a verá — confira o site com os próprios olhos.
  2. As alterações não chegaram — os arquivos dos Widgets são distribuídos via CDN com cache de 5 minutos: aguarde e atualize a página limpando o cache.
  3. O mapa do site não foi construído ou não foi aplicado — nos modos diferentes de "Sua Vitrine", os botões são posicionados pelo mapa: escaneie o site e aplique o resultado.
  4. O Scanner não encontrou as páginas de produto — ele lê o HTML do servidor; se o catálogo é desenhado inteiramente por JavaScript, mude para o modo "Sua Vitrine".
  5. O botão na página do produto está desativado nas configurações de posicionamento — é assim mesmo no cenário de "Interceptação total", em que o visitante clica no botão nativo do site.

O botão do carrinho desapareceu. Verifique o canto da tela escolhido nas configurações de posicionamento; se o multibotão estiver ativado e houver o item "Fazer Pedido" no leque dele, o botão próprio do Widget é ocultado de propósito.

Os botões ficaram no lugar errado ou desapareceram após a atualização do site. A marcação mudou — clique em "Reescanear": as configurações de posicionamento são mantidas.

Os preços na página não mudaram. A reescrita dos preços diretamente na marcação do site pode ser desativada nas configurações — nesse caso, o visitante vê o preço do site, e o seu preço vai para o carrinho. Verifique também se a regra de preços está ativada e se não há uma substituição pontual para esse produto.

O visitante fez um Pedido no site, mas o Pedido não está na Conta. Provavelmente o Pedido passou por fora de nós — por um botão nativo que sobrou ou por um link direto para o carrinho do site. Isso se resolve com o modo "Substituir botões" ou "Interceptação total".

O Pedido está com o preço errado. A reescrita de preços é visual: o backend do seu site não sabe dela. Faz sentido ativar os seus preços somente junto com a interceptação do Pedido — caso contrário, parte dos Pedidos será feita pelo preço antigo, por fora de você.


Seções relacionadas#

  • Meu site — código de instalação e os demais Widgets
  • Pedidos — o que acontece com o Pedido depois
  • Loja online — se você precisa de uma Vitrine completa

Perguntas frequentes#

É preciso migrar o catálogo para vocês? Não. O Widget trabalha com os produtos diretamente nas páginas do seu site — ele lê os nomes e os preços de lá. O catálogo na Conta é necessário se você quiser controle de estoque, análise por Item e a nossa Vitrine: é possível migrar por importação pelo endereço do site ou por arquivo — consulte Importação de catálogo com AI e Loja online.

E se o site mudou? Clique em “Escanear novamente” — o mapa será atualizado e as configurações de posicionamento serão mantidas.

O Widget vai quebrar o layout? Os botões são inseridos nos locais encontrados na sua marcação, e a aparência é configurável; o carrinho e o checkout abrem sobre a página e não alteram o seu layout.

Was this article helpful?