ℹ️ Note: Este artigo foi traduzido automaticamente utilizando IA e pode conter imprecisões. Se algo parecer errado, entre em contato com nossa equipe de suporte.

Quer recompensar os clientes por comprarem mais do mesmo produto? 🛍️

Isso é exatamente o que o Quebra de Quantidades oferta em Hoppy Bundles foi concebido para o efeito.

Com este tipo de oferta, você pode criar níveis de desconto baseados em quantidade, tais como:

• 🛒 Comprar 1 → Preço Padrão
• 💸 Comprar 2 → 10% OFF
• 💰 Comprar 3 → 20% OFF

—e exibi-los como um widget puro e clicável diretamente em sua página do produto.

Os clientes simplesmente escolher o nível de quantidade que eles gostam, eo desconto é aplicado automaticamente no checkout ✨

📍 Onde aparece o elemento de quebra de quantidade

O elemento de quebra de quantidade aparece no seu Página do produto, logo abaixo do botão Adicionar ao Carrinho (posição padrão).

Você também pode colocá-lo em qualquer outro lugar na página do produto usando o Colocação personalizada opção (coberto mais tarde neste guia).

ℹ️ A mesma tela de configuração também é usada para BOGO (Compre um Obter um) e Comprar X Obter Y ofertas – essas são simplesmente ofertas Quantity Break pré-cheias com níveis estilo BOGO.

🛠️ Configuração de Exemplo Usada nesta Documentação

Nesta documentação, vamos configurar a seguinte estrutura de níveis:

• 🛒 1 par → Preço padrão (sem desconto)
• 💸 2 Par → 10% OFF
• 💰 3 Pare → 20% OFF

A oferta será aplicada a Produtos específicos e exibido na Disposição vertical.

Este guia explica cada configuração que você vai tocar durante a configuração, então você sabe exatamente como cada opção se comporta ⚙️

✅ Antes de começar — habilite o aplicativo para incorporar

Para que o widget Quantity Break apareça na frente da sua loja, a incorporação do aplicativo deve ser ativada dentro de sua Shopify tema.

Ir para:

Shopify Admin → Canais de Vendas → Loja online → Temas → Personalizar → App Inbeds

Depois:

• Procurar Pacotes App Incorporar
• Activar
• Clique em Salvar

⚠️ Importante: Sem o aplicativo incorporado habilitado, sua oferta publicada não será visível na frente do store — mesmo que tudo dentro do aplicativo esteja configurado corretamente.

🎯 Passo 1 — Crie uma nova oferta de quebra de quantidade

Abrir o Hoppy Bundles app a partir da sua Shopify Admin.

Depois:

→ Clique Criar uma Nova Oferta para abrir a página de seleção do tipo de oferta.

→ Selecionar Quantity Break (Um produto) e clique Criar uma quebra de quantidade.

ℹ️ A BOGO e Comprar X Obter Y cartões nesta página também abrir a configuração Quantity Break — eles apenas pré-preencha seus níveis com ofertas estilo BOGO (por exemplo, “Compre 2 Obter 1”), assim você pode começar a partir daqueles se esse é o negócio que você quer executar.

🧩 Passo 2 — Nomeie sua oferta e escolha onde se aplica

A primeira tela pede o básico antes de qualquer outra coisa.

🏷️ Nome da Oferta

Este campo é utilizado apenas para fins internos.

Os clientes nunca verão este nome.

Você pode usar qualquer nome reconhecível como:

• Venda de tênis de verão
• Promoção do volume da camiseta
• Black Friday Tiers

💡 Usar nomes internos adequados torna mais fácil identificar configurações mais tarde, especialmente se sua loja executar várias ofertas.

📦 Aplicar a Oferta

Esta configuração controla quais os produtos que o widget de quebra de quantidade e descontos se aplicam.

Existem 3 opções disponíveis:

• Todos os Produtos → a oferta se aplica a todos os produtos da sua loja
• Produto → a oferta se aplica apenas aos produtos que você seleciona
• Colecção → a oferta se aplica a cada produto dentro das coleções que você selecionar

Se você escolher Produto ou Colecção, a Selecionar produto / Selecionar coleção O botão aparece. Clique nele para abrir seu Shopify Recolhedor de recursos e escolha um ou mais itens.

⚠️ Importante:

• Alternando entre Todos os Produtos, Produto, e Colecção limpa sua seleção atual — escolha o modo certo primeiro e selecione seus itens.
• Apenas uma oferta publicada é permitida por produto ou coleçãoSe outra oferta publicada já cobre o mesmo produto, você não será capaz de publicar este até que a oferta existente seja convertida de volta para um rascunho.

🎨 Passo 3 — Escolha um modelo

Rolar para baixo para o Selecione sua oferta preferida secção.

Aqui você vai encontrar modelos prontos que você pode passar através:

• Construir um do zero → começar com um layout limpo, mínimo
• Agrupar & Gravar → o olhar verde clássico multi-camada
• Oferta de Tempo Limitado → laranja, tema de urgência
• Loucura da Venda Flash! → rosa, tema de venda
• Yay! É BOGO → violeta, pré-cheia com Comprar X Obter níveis de estilo Y

Clique em um modelo para selecioná-lo e, em seguida, pressione Aplicar o modelo seleccionado.

ℹ️ A Aplicar o modelo seleccionado botão permanece desativado até que você tenha selecionado pelo menos um produto ou coleção (ao usar o Produto ou Colecção modo).

Uma vez aplicado, o editor de configuração completo abre - com uma visualização ao vivo do seu widget no lado direito da tela 👀

⚙️ Passo 4 — Configure Suas Ofertas (Abas Gerais)

O editor está organizado em 3 abas:

• Geral → oferecer conteúdo, descontos e comportamento
• Desenho → fontes, cores e bordas
• & Colocação de Destino → quem vê a oferta e onde aparece

Este guia foca nas configurações que você precisa para obter a oferta ao vivo. Vamos passar pelo Geral secção por secção.

✏️ Nome da Oferta & Oferta Seleccionada

No topo da página Geral você pode ver o seu Nome da Oferta e o Oferta Seleccionada (o modelo que você escolheu).

Clique na ícone lápis ao lado do nome da oferta para renomeá-lo a qualquer momento.

💡 Este nome só é visível para você — para sua própria referência interna.

📐 Disposição do Modelo

Escolha como seus níveis de quantidade são organizados dentro do widget:

• Vertical → níveis empilhados em cima uns dos outros (melhor para a maioria das páginas de produto)
• Horizontal → níveis lado a lado

ℹ️ Quando Vertical é selecionado, um extra Escolha um tema aparece a opção, permitindo- lhe alternar rapidamente Azul, Vermelho, e Verde temas de cores.

💡 Escolher o Vermelho tema também desbloqueia um extra Subtítulo da Oferta campo dentro de cada nível de oferta (mais em que abaixo).

🎁 Editar oferta — seus níveis de desconto

Este é o coração da configuração ❤️

Cada nível de quantidade vive em sua própria aba (Oferta 1, Oferta 2, Oferta 3...). Clique em uma aba para editar essa camada.

Para nossa configuração de exemplo:

• Oferta 1 → Quantidade 1, Tipo de desconto No Discount
• Oferta 2 → Quantidade 2, Tipo de desconto % Discount, Desconto 10
• Oferta 3 → Quantidade 3, Tipo de desconto % Discount, Desconto 20

💸 Tipo de Desconto

Este dropdown controla que tipo de negócio o nível oferece:

Tipo de Desconto

O que ele faz

Sem desconto

Preço-padrão — útil como uma linha de base “Compra 1”

% de desconto (por exemplo, 25% de desconto)

Percentagem do total do nível

Desconto plano (por exemplo, $29.00 de desconto)

Montante fixo do total do nível

Em cada unidade de desconto plano

Montante fixo desligado cada unidade no nível

Preço específico (por exemplo, $29.00)

Os clientes pagam exatamente este preço pela camada

BOGO (Compre um Obter um)

Comprar X itens, obter Y itens do mesmo produto grátis

Comprar X Obter Y Grátis

Comprar X itens, obter um produto diferente desconto/livre

Dependendo do tipo de desconto, campos extras aparecem automaticamente:

• % / Plano / Por unidade / Preço Específico → a Desconto campo de entrada para o valor
• BOGO → Comprar e Vai-te embora. campos (A compra está bloqueada para a quantidade do nível)
• Comprar X Obter Y Grátis → Comprar e Vai-te embora. campos, mais a Selecionar produto Y botão para escolher qual produto o cliente recebe

⚠️ Por favor note: Para Comprar X Obter Y Grátis, certifique-se de que você realmente selecionar um produto “Y” – sem um, a camada não tem nada para dar.

🔢 Quantidade

O número de itens que o cliente deve comprar para desbloquear esta camada.

⚠️ Quantidade deve ser maior que 0 — você verá um erro inline se não for.

ℹ️ Pela BOGO e Comprar X Obter Y níveis, o Comprar A condição segue automaticamente esta quantidade.

🏷️ Título da Oferta

O texto principal mostrado no nível, por exemplo:

• 1 Par
• 2 Par
• 3 Par

🏷️ Rótulo e etiqueta de desconto

Cada camada tem duas decorações de texto opcionais:

• Rótulo de Desconto → o texto do negócio mostrado na camada, por exemplo “10% OFF”
• Marca → um pequeno crachá, por exemplo “Mais Popular”

Ambos os campos têm ícone do olho 👁️ do lado direito — clique nele para mostrar ou esconder esse elemento na frente da loja.

💡 Adicionar uma tag “Mais Popular” ao seu nível médio é uma maneira simples de empurrar os clientes para ele.

🎁 Presente grátis

Assinalar a Presente grátis caixa de seleção se você quiser que os clientes escolham esta camada para também receber um produto presente.

Uma vez activada, a Selecionar produtos botão aparece para que você possa escolher o produto(s) presente(s) de sua loja.

ℹ️ Desmarcar Presente grátis limpa os produtos de presente selecionados para esse nível.

📝 Subtítulo da Oferta (Somente Tema Vermelho)

ℹ️ Este campo só aparece quando o Vermelho o tema está selecionado em Disposição do Modelo → Escolha um tema.

Ele adiciona uma pequena linha de legendas dentro de cada nível, e também tem um ícone de olho para alternar visibilidade.

➕ Adicionar / 🗑️ Apagar os Níveis

Abaixo das abas da oferta você encontrará:

• Adicionar Oferta → adiciona uma nova aba de nível (máximo 6 níveis)
• Apagar → remove o nível atualmente selecionado (mínimo 2 níveis requerido)

Se atingires um destes limites, uma pequena mensagem de brinde vai avisar-te.

📰 Texto de & Rodapé do Título do Bloco

Estes controlam o texto acima e abaixo do widget:

• Título do Bloco → por exemplo, “Bundle & Save” ou “Limited Time Offer”
• Texto do Rodapé → Por exemplo, “Envio Livre”

Ambos os campos vêm com um ícone do olho para escondê-los completamente, se preferir um olhar mais limpo.

🛠️ Passo 5 — Configurar as Configurações

Rolar para baixo para o Configuração Cartão. Essas caixas de seleção controlam como o widget se comporta e o que os clientes veem.

👀 Aparência e aparência

• Mostrar o preço unitário → os clientes podem ver o preço por unidade dentro da oferta
• Mostrar o preço total → os clientes podem ver o preço total de cada camada
• Ocultar linhas de cabeçalho e rodapé → esconde as linhas divisor na parte superior e inferior do widget para uma aparência mais limpa
• Usar texto personalizado para Fora de stock → mostra sua própria mensagem quando o produto selecionado está fora de estoque

ℹ️ Habilitando Usar texto personalizado para Fora de stock revela um campo de texto onde você pode digitar sua mensagem (padrão: “Itens destacados estão fora de estoque”).

⚙️ Funcionalidade

• Deixe os clientes escolher diferentes variantes para cada item → se o produto tem variantes (tamanho, cores...), os clientes podem escolher uma variante diferente para cada unidade na camada
• Mostrar o elemento abaixo adicionar ao botão do carrinho → renderiza o widget diretamente abaixo do botão Adicionar ao Carrinho
• Saltar o carrinho diretamente para checkout → clientes são redirecionados diretamente para checkout após adicionar uma camada, pulando a página do carrinho
• Volume desconto (Extender Max desconto para todas as quantidades) → permite aos clientes comprar adicional Elementos para além do nível mais elevado à taxa máxima de desconto
• Mostrar comparar ao preço → exibe o preço de comparação (atropelamento) dentro da oferta

ℹ️ Habilitando Mostrar comparar ao preço revela dois campos adicionais:

• Preço de comparação personalizado → sobreponha o preço de comparação manualmente (deixar em branco ou 0 para usar o preço de sua Shopify lista de produtos)
• Shopify preço de comparação do produto → somente leitura, mostra o preço de comparação vindo de sua lista de produtos

🔄 Habilitar combinação de descontos

Estas opções permitem que o desconto Quantity Break combine com outros tipos de desconto no checkout:

• Descontos de encomendas
• Descontos de envio

ℹ️ A combinação de desconto de produto está sempre ligada. Também note que devido a Shopify restrições, esta configuração aplica-se globalmente a todas as novas ofertas Quantity Break.

🌍 Mercados Múltiplos & Tradução

Abaixo Configurações que você também vai encontrar:

• Mercados múltiplos → definir preços específicos do mercado para a oferta
• Tradução → traduzir textos widget para idiomas adicionais da sua loja

ℹ️ Estes são opcionais e não são necessários para obter sua oferta ao vivo — eles estão cobertos em seus próprios guias dedicados.

🎯 Etapa 6 — Segmentação e colocação (Opcional)

Mudar para o & Colocação de Destino aba para controlar onde o widget aparece e quem o vê.

📍 Colocação

• Abaixo Adicionar ao Botão do Carrinho (Padrão) → o widget é colocado automaticamente — recomendado para a maioria das lojas
• Personalizado (somente na página do produto) → coloque o widget em qualquer lugar que você gosta na página do produto

Se você escolher Personalizado, o aplicativo dá-lhe duas coisas após a gravação:

• Hoppy bundles ID → usá-lo para adicionar / reposicionar o Hoppy Bundles bloco de aplicativo em seu editor de tema
• Hoppy bundles excerto de código → um pequeno <div> você pode colar em qualquer lugar em seu código de tema

ℹ️ Até que a oferta seja salva uma vez, você verá “Salve para ver Hoppy bundles ID e trecho de código”.

👤 Alvo do Cliente & 🌍 Meta de Geolocalização

Estas secções opcionais permitem-lhe:

• Mostrar a oferta apenas para Clientes registados
• Mostrar ou ocultar a oferta com base em etiquetas de clientes ou vida útil
• Limitar a oferta Países específicos (padrão: Todo o mundo)

Há também um Agendamento secção para definir a início e fim data/hora para a oferta — útil para vendas em flash

ℹ️ Todos estes são opcionais. Se os ignorares, a oferta mostra-se a todos, em todo o lado, imediatamente. Segmentação avançada é coberto em detalhe em seu próprio guia dedicado.

🎨 Página de Desenho (Opcional)

A Desenho tab controla o estilo visual do widget:

• Tipografia & Cor → família de fontes, tamanhos de texto, pesos e cores para cada elemento
• Variante → tamanho pequeno / médio / grande para seletores variante
• Contorno → largura da borda e controles de raio de canto

💡 Cada mudança reflete instantaneamente na visualização ao vivo à direita — ambos na desktop e móvel painéis de visualização.

ℹ️ Os padrões já estão ótimos fora da caixa, então este passo é totalmente opcional. Styling é coberto em profundidade no guia de design dedicado.

✅ Passo Final — Salvar e Publicar

Uma vez que tudo fica bem na pré-visualização:

1. Clique Gravar na barra de gravação no topo da página
2. Clique Publicar para fazer a oferta viver ⚠️ Por favor note:

• A Publicar o botão está desativado enquanto a oferta é nova em folha — salvar primeiro, em seguida, publicar.
• A publicação cria um desconto automático na sua Shopify Admin → Descontos. Isto é o que realmente aplica os preços da camada no checkout — por favor, não exclua ou edite manualmente.
• Se o aplicativo incorporado não estiver habilitado no seu tema, um banner aparecerá após salvar com um Activar a Entrada da Aplicação botão de atalho — clique nele, ative a inserção e salve seu tema.
• Se a publicação falhar porque outra oferta publicada já cobre o mesmo produto ou coleção, converta essa oferta existente para um rascunho primeiro, então publique novamente.

Sua oferta Quantity Break está agora ao vivo 🚀

🎉 Resultado Final

Uma vez configurado com sucesso:

✅ Clientes veem seus níveis de quantidade diretamente na página do produto ✅ Descontos se aplicam automaticamente no checkout ✅ Níveis, tags e etiquetas atualizados instantaneamente do aplicativo ✅ O elemento corresponde ao seu tema com a disposição e as cores que escolheu

Veja como o widget finalizado fica na frente da loja — níveis limpos, economias claras e seleção de um clique ✨

💡 Quer executar um negócio “Comprar 2 Obter 1 Grátis” em vez disso? Criar um novo BOGO oferecer a partir da página tipo oferta - ele usa exatamente o mesmo fluxo de configuração que você acabou de aprender, com níveis BOGO pré-preenchidos para você.

Actualizado em: 10/09/2026