# Order Bump - Produtos Relacionados

Esse recurso permite que ao adicionar um produto ao carrinho, os clientes tenham acesso a recomendações de produtos relacionados diretamente na modal de "Meu Carrinho" e na página de Carrinho, incentivando a exploração de outros itens.

Vale ressaltar que, para que o recurso seja exibido, o tema deve utilizar o modal padrão da plataforma. Assim, ao estar na página do produto e clicar para adicionar o item ao carrinho, a modal "Meu Carrinho" será exibida, mostrando o novo recurso logo abaixo.

<figure><img src="/files/2roYNsOJ289bmKgFsG6W" alt=""><figcaption><p><strong>Exemplo de exibição do Order Bump no Tema Padr</strong>ã<strong>o 2.0</strong></p></figcaption></figure>

Para habilitar o recurso, acesse pelo painel da plataforma em: **Configurações > Produto > Geral > Produtos Relacionados (Order Bump)**.

Nele é possível ativar ou desativar a exibição de produtos relacionados na modal de "Meu Carrinho" e na página de Carrinho.

<figure><img src="/files/I086t04cvlMJcLl44WNK" alt=""><figcaption><p><strong>Exemplo de exibição do painel da plataforma</strong></p></figcaption></figure>

Em Funções adicionais, a opção "**Adicionar produto ao carrinho sem sair da página**" também deve estar selecionada.

<figure><img src="/files/bMAErIY90fsilFN1uuZ4" alt=""><figcaption><p><strong>Exemplo de exibição do painel da plataforma</strong></p></figcaption></figure>

Para mais detalhes [acesse a doc](https://basedeconhecimento.tray.com.br/hc/pt-br/articles/6734047244827-Como-utilizar-a-ferramenta-de-Produtos-Relacionados?_gl=1%2A104fhm7%2A_ga%2AMTc1NDQxNTU0Ni4xNzM5Mjc0NDg3%2A_ga_7E8K3V34J2%2AMTczOTM1ODgzMS4yLjEuMTczOTM4MTY5Ny4zNy4wLjA.).

<figure><img src="/files/evtbtjJAx4gyjeIJ46lf" alt=""><figcaption><p><strong>Desktop - Exemplo de exibição do Order Bump na pagina de produto</strong></p></figcaption></figure>

<figure><img src="/files/u32DfCxn1z6Vh5FKdmuF" alt=""><figcaption><p><strong>Mobile - Exemplo de exibição do Order Bump na pagina de produto</strong></p></figcaption></figure>

Não é possível editar o HTML desse modal. Caso queira fazer algum ajuste junto aos arquivos da loja, o mesmo pode ser feito através de CSS e Javascript de maneira personalizada.

<figure><img src="/files/vg7L2p9JKoOPpsX4ZQnw" alt=""><figcaption><p><strong>Exemplo de exibição do Order Bump no checkout</strong></p></figcaption></figure>

No checkout não é possível fazer nenhum tipo de alteração.

Também é possível fazer consulta a API e retornar os produtos. Recomendado para as lojas que não utilizam o modal padrão da plataforma na página do produto e possuem o carrinho lateral.

<figure><img src="/files/kbBRQXn5FAzbllGhzFdj" alt=""><figcaption><p><strong>Exemplo de exibição do Order Bump no Tema Netstore 2.0 Home Decor</strong></p></figcaption></figure>

Para consultar produtos relacionados é obrigatório passar 2 parâmetros no header: o id da loja e o content type:&#x20;

```javascript
Store-id: <id da loja>
Content-Type: application/json
```

Também é necessário enviar, nos parâmetros da requisição, o nome de pelo menos 1 produto para buscar seus relacionados e no máximo o nome de 2 produtos.

```javascript
{dominio_loja}/cart-api/partners/v1/products/related?related_product_1={nome_do_produto}
{dominio_loja}/cart-api/partners/v1/products/related?related_product_1={nome_do_produto}&related_product_2={nome_do_segundo_produto}
```

Exemplo de consulta a API:&#x20;

```javascript
const url = `/cart-api/partners/v1/products/related?related_product_1=${nomeProduto}`;
jQuery.ajax({
    method: 'GET',
    url: url,
    headers: {
        'Store-id': idStore,
        'Content-Type': 'application/json'
    },
    success: function(response) {
        console.log(response);                
    },
    error: function(error) {
        console.error(error.responseJSON?.message || "Erro desconhecido");
    }
});

```

A montagem e exibição do bloco fica de acordo com o desejado para o tema/loja.

<figure><img src="/files/iCY820HCVMTytrFfw8Dm" alt=""><figcaption><p><strong>Exemplo de exibição do Order Bump no carrinho lateral</strong></p></figcaption></figure>

<figure><img src="/files/AYTTxAhwCh9rAkagBvIN" alt=""><figcaption><p><strong>Exemplo de exibição do Order Bump no carrinho flutuante</strong></p></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://partners.tray.com.br/themes/construindo-seu-template/desenvolver/order-bump-produtos-relacionados.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.