> 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.

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

A Trading Widget SDK incorpora a interface de negociação 6MM numa página web detida por um parceiro. A integração mais rápida requer um contentor visível, o script de produção SDK e uma chamada para `TradingWidget.create()`.

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

* Executar o exemplo a partir de uma página web que possa carregar recursos a partir de `https://app.6mm.com`.
* Dar ao contentor do widget uma largura e altura explícitas.
* Carregue a SDK antes de chamar `TradingWidget.create()`.
* Planeie o [fluxo de autenticação](/pt-PT/sdk/trading-widget/authentication) antes de ativar funcionalidades 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`. Capturar `onError` durante o desenvolvimento para que falhas de configuração e carregamento fiquem visíveis.

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

| Ambiente | Guião 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 pertencentes a parceiros, passe baseUrl para que o iframe aponte sempre para o domínio Web 6MM .

<h2 id="display-controls">
  Controlos de ecrã
</h2>

Os embeds parceiros escondem o cabeçalho do PC e o ticker do mercado inferior por defeito. Usa `display` quando precisares de mostrar essas áreas de concha ou esconder contentores de alto nível na página de troca embutida.

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

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

| Superfície             | Mínimo recomendado |
| ---------------------- | ------------------ |
| Ambiente de Secretária | 1024 x 720         |
| Móvel                  | 390 x 700          |

Para layouts responsivos, mantenha a largura fluida e defina uma altura mínima adequada para cada ponto de interrupção. Um contentor com altura zero pode carregar o SDK com sucesso, deixando a interface de negociação invisível.

<h2 id="verify-the-integration">
  Verificar 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 o `symbol`, `locale`, o tema e as secções ocultas configuradas.
4. Redimensione a página entre os pontos de interrupção do ambiente de trabalho e do telemóvel.
5. Completar um teste autenticado com um utilizador não produtivo antes do lançamento.

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

| Sintoma                                 | O que verificar                                                           |
| --------------------------------------- | ------------------------------------------------------------------------- |
| Área de widget em branco                | Confirma que o recipiente tem largura e altura visíveis.                  |
| `TradingWidget` é indefinido            | Confirma que o script v1 foi carregado antes da chamada create.           |
| Página ou ambiente errado               | Defina `baseUrl` explicitamente e verifique o ambiente configurado.       |
| O evento pronto nunca dispara           | Capturar `onError` e inspecionar iframes ou pedidos de script bloqueados. |
| 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-PT/sdk/trading-widget/authentication)

Ligue o terminal embutido a uma sessão de utilizador aprovada.

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

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

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

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