Funcionalidades

Articles

Adicione o Google Avaliações do Consumidor
Neste tutorial veremos como adicionar o selo de pesquisas do Google em sua loja. HTML 1. Na pasta static/js , adicionamos o arquivo google-survey.js.tpl : {# Google survey JS for Tiendanube /#} {% if store.google_merchant_id %} <sc...
Pontos de ancoragem para aplicações
Os layouts da Nuvemshop possuem seletores HTML projetados para que aplicativos ou agentes externos possam ser ancorados ao design de cada loja sem ter que adaptar seu código com base em cada layout. Esses componentes são representados...
Página em construção
A página em construção permite ocultar produtos e páginas internas da loja quando a mesma não puder receber visitas, seja porque ainda não foi lançada ou está recebendo atualizaçã...
Selos personalizados
Neste tutorial, explicaremos como você pode adicionar um selo ou logotipo personalizado para aparecer no rodapé da loja, na seção ‘Personalizar meu layout atual’ no Administrador Nuvem. Geralmente é usad...
Promoções
Neste tutorial vamos adicionar as promoções em seu layout, oferecendo a possibilidade de mostrar e aplicar promoções do tipo: 2x1, 3x1,% de desconto em um produto ou de um determinado número de unidades. As promo&...
Botão de contato por meio do WhatsApp
Neste tutorial, te ensinamos a implementar o botão que possibilita o contato com o administrador da loja, pelo WhatsApp: HTML 1. Crie o arquivo whatsapp-chat.tpl dentro da pasta snipplets com o seguinte conteúdo: {% if store...
Lazy load
Em alguns tutoriais, incluímos a técnica de lazy load, para a qual usamos o plugin Lazysizes . Ele evita o carregamento de imagens que não estão dentro do campo visual na tela do dispositivo onde o site é exibido...
Classes helper ou utilities
Nos layouts da Nuvemshop, usamos classes chamadas Helpers ou Utilities, que são usadas para aplicar uma propriedade CSS isolada. Por exemplo, se precisarmos de um texto para ser alinhado ao centro, usamos a classe "text-center": &...
Resultados de entrega e retirada
Neste tutorial, explicamos como exibir os resultados da calculadora de frete, destacando as melhores opções e dividindo entre as opções de entrega em domicílio e os pontos de retirada. Antes de iniciar, é...
Mensagem informativa
Neste tutorial, explicamos como adicionar uma mensagem de demoras na calculadora de frete antes da finalização da compra. HTML No snipplet shipping_options.tpl adicionamos o seguinte código para que se mostre uma mensagem...
Mensagem de envio gratuito na calculadora de envio
No tutorial a seguir, explicamos como adicionar uma mensagem à calculadora de envio para quando a compra tiver frete grátis. A compra com frete grátis depende de fatores como o valor mínimo de compra, a região ...
Loja com produtos digitais e / ou físicos
No tutorial a seguir, explicamos como fazer uma loja adaptar o fluxo de compras ao vender produtos físicos e produtos digitais ou serviços, considerando a possibilidade de ter carrinhos “mistos” com os dois tipos de produto...
Imagem da loja ao compartilhar seu link
Neste tutorial veremos como adicionar a possibilidade de usar uma imagem diferente do logo da loja ao compartilhar o link de sua página inicial. Essa imagem, tecnicamente conhecida como imagem OG (Open Graph Image), é a utilizada por ...
Informação de meios de pagamento e parcelas
Neste tutorial, vamos adicionar visibilidade aos meios de pagamento e parcelas em seu design: O código neste tutorial inclui: Parcelas na lista de produtos, detalhes do produto e carrinho (aplica-se apenas em lojas no Brasil) Modal que mo...
Como aplicar CSS no checkout
Neste tutorial veremos como adicionar CSS para o checkout e assim adaptar seu design ao de nossa loja. IMPORTANTE: Antes de continuar, vale esclarecer que o checkout é uma etapa crítica para a compra e na hora de efetuar alt...
Links do YouTube e TikTok
Neste tutorial te ensinamos como adicionar essas 2 redes sociais em sua loja. HTML 1. Dentro da pasta snipplets/social vamos editar o arquivo social-links.tpl com o seguinte conteúdo: {% for sn in ['instagram', 'facebo...
Discount API
A Discount API é um conjunto de ferramentas que permite o desenvolvimento de uma ampla gama de regras promocionais. Antes de começar a ver onde e como as promoções e descontos devem ser exibidos nas lojas, vamos explicar...
Bloqueio de início de sessão depois de várias tentativas sem sucesso
Nesse tutorial apresentamos como alterar o código para ativar a funcionalidade de bloqueio de sessão a fim de proteger a conta dos usuários registrados na sua loja. HTML Quando um usuário tenta por várias veze...
Calculadora de frete
No tutorial a seguir explicamos como adicionar o calculador de frete e as lojas físicas em seu layout: O código neste tutorial inclui: A calculador de frete, tanto no detalhe do produto como no carrinho O filtro entre opç&ot...
Validação de usuários registrados
Queremos verificar se o usuário insere seu e-mail real, adicionando uma instância de validação através de um link que enviaremos para o e-mail que foi inserido. As alterações que descrevemos neste ...
Resultados de entrega e retirada
Neste tutorial, explicamos como exibir os resultados da calculadora de frete, destacando as melhores opções e dividindo entre as opções de entrega em domicílio e os pontos de retirada. Antes de iniciar, é...
Cálculo de fretes internacionais
Neste tutorial veremos como adicionar a possibilidade de calcular frete para outros países sem ter que mudar a moeda ou idioma. Vale a pena explicar que nas lojas existem dois tipos de entidades para cada país configuradas na tela Con...
Notificação sobre o uso de cookies
Neste tutorial vamos adicionar uma notificação que informa a seus clientes sobre o uso de cookies. Isso não afetará a experiência de compra ou as estatisticas Aplicar esta funcionalidade fará com que voc&...