> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # 📍 Como colocar Upsell & Cross Sell numa posição personalizada > ℹ️ **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. Quero o teu Upsell & Cross Sell widget para aparecer exatamente onde _você_ quer - não apenas nos pontos padrão? 🎯 Isso é exatamente o que o **Posição Personalizada** opção em Hoppy Upsell & Cross Sell foi concebido para o efeito. Em vez de confiar na colocação automática do aplicativo, a posição personalizada permite que você decida a localização exata do seu widget usando: * 🧩 Um tema **Bloco de Aplicação** (sem necessidade de codificação) * 📝 A **excerto de código** você pode colar em uma seção de líquido personalizado ou seus arquivos de tema Isso é perfeito quando você quer que o widget se sente entre seções específicas — por exemplo, sob a descrição do produto, dentro de uma aba, ou acima dos totais do carrinho — então ele combina naturalmente com o design da sua loja ✨ --- # **🗺️ Onde Funciona a Posição Personalizada** A posição personalizada pode ser usada nas seguintes páginas: * **Página do produto** → em qualquer lugar dentro do seu modelo de produto * **Página do Carrinho** → em qualquer lugar dentro do seu modelo de carrinho ℹ️ A posição personalizada só é suportada na **Página do produto** e **Página do Carrinho**. **Gaveta de Carrinhos** é renderizado dinamicamente pelo seu tema, então os blocos de aplicativos não podem ser colocados dentro dele — para a gaveta do carrinho, use o dedicado **Gaveta de Carrinhos** tipo de colocação. --- # **✅ Antes de começar** Certifique-se de que o seguinte está no lugar antes de configurar uma posição personalizada: * A **Upsell Cross-Sell Slider app embed** está habilitado em seu tema → **Shopify Admin → Loja online → Temas → Editar tema → App Incorpora → Upsell Cross-Sell Slider → ON → Salvar** ⚠️ Sem o aplicativo incorporado, o script widget nunca carrega — então nada aparecerá, mesmo que o bloco seja colocado corretamente. * Tens o teu **Upsell ID** A mão. Não sabe onde encontrá-lo? Ver 🔎 Como encontrar Upsell ID?. --- # **🛠️ Passo 1 — Habilitar posição personalizada na aplicação** Existem duas maneiras de ligar a Posição Personalizada — escolha o que corresponder à sua situação. ## **Opção A — Criar uma Nova Posição Personalizada Upsell** Abrir o **Hoppy Upsell & Cross Sell** aplicação, então: → Clique **Criar um novo upsell** → Na tela do tipo de colocação, selecione **Posição Personalizada** Isto cria um novo upsell cuja colocação já está definida para **Posição personalizada** — você irá configurar o seu conteúdo e design como de costume, em seguida, colocá-lo em seu tema nas próximas etapas. ## **Opção B — Mudar uma Upsell existente para uma posição personalizada** Já tenho um **Página do produto** ou **Página do Carrinho** Upsell? Você pode converter: → Abra o upsell do seu painel → Vá para o **Colocação** tab → Sob **Mostrar Ligado (Incluir)**, abra o dropdown de colocação e selecione **Posição personalizada** 💡 Mudar para **Posição personalizada** limpa a colocação automática, então o widget só aparecerá onde você mesmo colocá-lo no tema. --- # **💾 Passo 2 — Salvar para obter seu Upsell ID & Excerto de Código** Posição personalizada funciona combinando sua colocação do tema com um upsell específico usando o seu **Upsell ID**. Após selecionar **Posição personalizada**: → Clique **Gravar** Uma vez salvo, o **Colocação** A aba revela dois itens prontos para serem copiados: * **Upsell ID** → o ID único deste upsell (com um botão de cópia 📋) * **Excerto de código da Upsell** → um trecho em HTML pronto (também com um botão de cópia) ℹ️ Estes só aparecem **após a gravação**. Se você ver “Salvar para ver Upsell ID e trecho de código”, basta clicar em Salvar primeiro. --- # **🧩 Passo 3 — Coloque o elemento em seu tema** Agora escolha como deseja colocar o widget. Os dois métodos de trabalho **modelo de produto** e o **modelo do carrinho**. ## **Método 1 — Utilização do bloco de aplicação do tema (recomendado)** Esta é a maneira mais fácil, sem código 🎉 → Ir para **Shopify Admin → Loja online → Temas → Editar tema** → A partir do top dropdown, abra o modelo onde você quer o widget: * **Produtos → Produto padrão** (para as páginas do produto) * **Carrinho** (para a página do carrinho) → No painel esquerdo, clique **Adicionar bloco** (ou **Adicionar seção**) → Abaixo **Aplicativos**, selecionar **Bloco de venda cruzada Upsell** → Nas configurações do bloco, cole o seu **Upsell ID** na **Upsell ID** campo → Arraste o bloco para sua posição preferida ⬆️⬇️ → Clique **Gravar** 💡 Logo após a publicação de um upsell, o aplicativo também mostra **Adicionar Bloco de Aplicação** botão de atalho no banner de confirmação — ele abre seu editor de tema diretamente com o bloco pronto para adicionar. ⚠️ Se a **Upsell ID** campo é deixado em branco, o bloco exibe um “Por favor, configure o Upsell ID para usar App Block.” placeholder em vez de seu widget — então sempre cole o ID. ## **Método 2 — Usando um bloco líquido personalizado / corte de código** Prefere mais controle, ou quer que o widget em algum lugar blocos de aplicativo não estão disponíveis? Use o trecho de código em vez disso. → No editor de temas, adicione um **Liquido Personalizado** bloco ou seção onde você quer o widget → Colar o **Excerto de código da Upsell** Você copiou da aplicação. Parece isto: → Clique **Gravar** O aplicativo automaticamente encontra este placeholder na página e renderiza o widget upsell correspondente dentro dele — mesmo que seu tema re-render a seção mais tarde 🔄 💡 Você também pode colar o trecho diretamente nos arquivos Líquidos do seu tema (por exemplo, dentro de uma seção de produto personalizado) se você estiver confortável edição código. --- # **📌 Notas e Avisos Importantes** * ⚠️ **A incorporação do aplicativo deve permanecer on** — ambos os métodos dependem do **Upsell Cross-Sell Slider** A incorporação do aplicativo está ativada. * ⚠️ **Projetado para páginas de produto e carrinho** — A posição personalizada é construída e suportada para as páginas do produto e a página do carrinho. O widget renderiza onde quer que ele encontre o placeholder bloco / snippet na página, então só colocá-lo nesses modelos — colocando-o em outro lugar (como a página inicial ou coleções) não é suportado e pode produzir resultados inesperados. * 💡 **Um ID = um upsell** — o Upsell ID no interior do bloco ou snippet decide que upsell mostra. Para exibir um upsell diferente, troque em seu ID. * 💡 **Colocações múltiplas** — pode adicionar o mesmo bloco ou trecho em mais de um ponto (por exemplo, página do produto) _e_ página do carrinho) usando o mesmo Upsell ID. * ⚠️ **Publicar o seu upsell** — o volume de vendas deve ser: **publicado** no aplicativo, caso contrário, nada renderiza na frente da loja. * ℹ️ As condições de exibição ainda se aplicam — regras de segmentação como status de login do cliente, geolocalização, valor do carrinho ou agendamento ainda são respeitadas em posições personalizadas. Ver 🎯 Opções de Alvo Avançadas para Upsell & Cross Sell para mais pormenores. --- # **🎉 Resultado Final** Assim que tudo estiver preparado: ✅ Seu widget upsell aparece exatamente onde você colocou o bloco ou trecho ✅ Ele atualiza automaticamente com as configurações de conteúdo, design e segmentação do aplicativo ✅ Você pode mover, remover ou re-adicionar livremente a colocação a qualquer momento do editor do tema — não há necessidade de tocar no aplicativo novamente Aqui está o que parece em uma página de produto: --- # **🛟 Resolução de Problemas** Se seu widget não está aparecendo após a colocação: * 🔎 Verificar novamente o **app incorporar** está habilitado e salvo * 🔎 Confirmar **Upsell ID** no bloco corresponde ao upsell que publicou * 🔎 Certifique-se de colocar o bloco em um **produto** ou **carrinho** modelo * 🔎 Verificar o upsell é **publicado** e não agendado fora da data atual Ainda preso? Verificar Upsell & Cross Sell não está a mostrar na minha loja \[fixo\] para uma lista completa. --- # **📚 Guias relacionados** * 🔎 Como encontrar Upsell ID? * 🎨 Upsell & Cross Sell – Design e Styling * 🎯 Opções de Alvo Avançadas para Upsell & Cross Sell * Upsell & Cross Sell não aparece na minha loja