> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.6mm.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.6mm.com/_mcp/server.

# Incorpore o 6MM Trading Widget: Início Rápido

O Trading Widget SDK incorpora a interface de negociação 6MM dentro de uma página web de propriedade do parceiro. A integração mais rápida requer um contêiner visível, o script de produção SDK e uma chamada para `TradingWidget.create()`.

<h2 id="before-you-start">
  Antes de começar
</h2>

* Rodar o exemplo a partir de uma página web que pode carregar recursos de `https://app.6mm.com`.
* Atribuir ao contêiner do widget uma largura e altura explícitas.
* Carregue o SDK antes de chamar `TradingWidget.create()`.
* Planeje o [fluxo de autenticação](/pt-BR/sdk/trading-widget/authentication) antes de ativar recursos de conta ou negociação em produção.

<h2 id="minimal-example">
  Exemplo mínimo
</h2>

```html
<div id="trading-widget" style="width: 100%; height: 720px"></div>

<script src="https://app.6mm.com/sdk/trading-widget/v1/index.js"></script>
<script>
  const widget = TradingWidget.create('#trading-widget', {
    baseUrl: 'https://app.6mm.com',
    symbol: 'BTCUSDT',
    theme: 'dark',
    locale: 'en',
    layout: 'default',
    display: {
      showHeader: false,
      showTicker: false,
      hidden: [],
    },
    onReady(event) {
      console.log('ready', event)
    },
    onError(error) {
      console.error('error', error)
    },
  })
</script>
```

Quando a integração é bem-sucedida, o SDK cria um iframe dentro de `#trading-widget` e chama `onReady`. Capture `onError` durante o desenvolvimento para que falhas de configuração e carregamento fiquem visíveis.

<h2 id="sdk-urls">
  SDK URLs
</h2>

| Meio ambiente | Roteiro URL                                                                                              |
| ------------- | -------------------------------------------------------------------------------------------------------- |
| Produção      | [https://app.6mm.com/sdk/trading-widget/v1/index.js](https://app.6mm.com/sdk/trading-widget/v1/index.js) |

> **Definir baseUrl explicitamente**
>
> Ao testar a partir de páginas de propriedade do parceiro, passe baseUrl para que o iframe sempre aponte para o domínio 6MM Web.

<h2 id="display-controls">
  Controles de exibição
</h2>

Os embeds parceiros escondem o cabeçalho do PC e o ticker do mercado inferior por padrão. Use `display` quando precisar mostrar essas áreas de shell ou esconder contêineres de alto nível na página de negociação embutida.

```js
display: {
  showHeader: false,
  showTicker: false,
  hidden: ['account'],
}
```

<h2 id="container-size">
  Tamanho do recipiente
</h2>

| Superfície | Mínimo recomendado |
| ---------- | ------------------ |
| Desktop    | 1024 x 720         |
| Móvel      | 390 x 700          |

Para layouts responsivos, mantenha a largura fluida e defina uma altura mínima apropriada para cada ponto de interrupção. Um contêiner com altura zero pode carregar a SDK com sucesso enquanto deixa a interface de negociação invisível.

<h2 id="verify-the-integration">
  Verifique a integração
</h2>

1. Confirme que o script de SDK retorna com sucesso no painel de rede do navegador.
2. Confirme `onReady` dispara assim que o iframe for inicializado.
3. Teste as seções configuradas `symbol`, `locale`, tema e ocultas.
4. Redimensione a página entre os pontos de interrupção do desktop e do celular.
5. Concluir um teste autenticado com um usuário não produtivo antes do lançamento.

<h2 id="common-issues">
  Questões comuns
</h2>

| Sintoma                                 | O que verificar                                                            |
| --------------------------------------- | -------------------------------------------------------------------------- |
| Área de widget em branco                | Confirme que o recipiente tem largura e altura visíveis.                   |
| `TradingWidget` é indefinido            | Confirme que o script v1 carregou antes da chamada create.                 |
| Página ou ambiente errado               | Defina `baseUrl` explicitamente e verifique o ambiente configurado.        |
| Evento pronto nunca dispara             | Capture `onError` e inspecione requisições bloqueadas de iframe ou script. |
| Os dados da conta não estão disponíveis | Complete o fluxo de autenticação de widgets suportado.                     |

<h2 id="next-steps">
  Próximos passos
</h2>

#### [Autenticação por Widgets](/pt-BR/sdk/trading-widget/authentication)

Conecte o terminal embarcado a uma sessão de usuário aprovada.

#### [Opções e Eventos](/pt-BR/sdk/trading-widget/options-events)

Configure símbolos, localização, comportamento de exibição e retornos de retorno do ciclo de vida.

#### [Métodos de Instância](/pt-BR/sdk/trading-widget/instance-methods)

Controle a instância do widget criado após a inicialização.