TLN tln.design
Articles

Esporte · 19/07/2026

Integração Copa do Mundo 2026 em WordPress: placar, tabela e artilharia em tempo real

Placar ao vivo Senegal 5 x 0 Iraque na matéria Copa 2026 Muita Informação

Na Copa do Mundo 2026, o leitor de um portal de notícias espera placar ao vivo, tabela de grupos, chaveamento do mata-mata e artilharia — sem derrubar o site e sem estourar a cota da API. Neste artigo documento como entreguei essa integração no Muita Informação: sync no servidor, banco como fonte da verdade e front que só lê REST interna.

Contents

Introduction

A cobertura da Copa no Muita Informação não é um iframe de terceiros. É produto editorial dentro do tema WordPress: templates PHP, CSS do portal, sidebar de “Mais Lidas”, banners e REST própria. Página pública de referência: Tabela de jogos Copa 2026. Exemplo de matéria com placar embutido: Senegal 5 x 0 Iraque.

Truth Box

Key PointInsight
Front nunca chama a APISó o cron CLI (sync context) fala com a API Futebol.
Banco é a fonteVisitante lê mi_copa_* + REST /wp-json/mi/v1/copa/….
“Tempo real” pragmáticoSync ~15 min com jogo; poll no browser 60–90 s.
Whitelist de endpointsCota diária controlada; sem rajadas que esgotam o plano.
UI nativa do portalPlacar, grupos, mata-mata e artilharia no tema — não plugin genérico.

O problema de produto

Na Copa o leitor quer quatro coisas na mesma experiência: placar (ao vivo e encerrado), classificação dos 12 grupos, chaveamento eliminatório e artilharia. Tudo isso em portal WordPress com LiteSpeed e pico de visitas — e com API que cobra por request. Polling ingenuo (cada pageview na API, ou cron a cada 30 s) esgota a cota em horas.

Arquitetura em uma frase

API Futebol → cron PHP (Hostinger) → tabelas mi_copa_* + options → PHP monta snapshot HTML → JS lê REST interna e atualiza placar/tabela. Não é WebSocket. É sync isolado no tema (MI_Copa_Do_Mundo), com DISABLE_WP_CRON e sync só no CLI do hPanel (e URL manual com token).

CamadaResponsabilidade
Cron CLIAgenda 1×/dia, ao-vivo, detalhe de partida, tabela/artilharia no fim do jogo
BancoCache de partidas, legado de placar, log de API
TemplatesTabela, sidebar, card na single, chaveamento mata-mata
JS + RESTAbas, poll, pintura do DOM sem bater na API externa

Placar ao vivo na matéria

Na single, se o título casa com um confronto, o tema injeta o card de placar com gols, cartões e estatísticas (posse, finalizações, escanteios…). O JS atualiza o DOM via REST enquanto o jogo está na janela de polling — a matéria vira produto esportivo, não só texto.

Placar ao vivo Senegal 5 x 0 Iraque na matéria Copa 2026 Muita Informação
Placar na matéria: placar, gols, cartões e estatísticas atualizados a partir do banco (não da API no browser).

Fase de grupos

A tabela da Copa não é pontos corridos: a API devolve objeto aninhado por fase e grupo (A–L). O template ordena e renderiza colunas # Time P J V E D SG, com abas entre Fase de Grupos e Mata-mata.

Classificação final dos 12 grupos Copa do Mundo 2026 no portal Muita Informação
Classificação dos 12 grupos — grid editorial alinhado ao visual do portal.

Mata-mata e chaveamento

O chaveamento (16 avos → oitavas → quartas → semis → final) é montado no PHP a partir de partidas + detalhes — sem gastar cota em endpoints caros de fases. Filtros por etapa e widget da final na sidebar mantêm a navegação clara no desktop e no mobile.

Chaveamento mata-mata Copa do Mundo 2026 Espanha campeã no Muita Informação
Mata-mata: bracket visual com placares e filtros por fase.

Artilheiros

A artilharia sincroniza quando um jogo termina (mesmo pulso da tabela) ou em sync manual. Ranking com bandeira, nome e gols — útil na home da Copa e como prova social de cobertura completa.

Tabela de artilheiros Copa do Mundo 2026 Mbappé Messi no portal Muita Informação
Artilheiros atualizados após os gols — mesma fonte de dados do placar e da tabela.

Decisões duras (cota e performance)

  • Front nunca chama api.api-futebol.com.brfetch_api() recusa fora do sync context.
  • Cron automático whitelist: agenda, ao-vivo, detalhe allowlist; tabela/artilharia no finalize.
  • Bloqueados no auto: rodadas caras, fases em massa, backfill de partidas que já esgotaram cota no passado.
  • Janela do torneio: fora de 11/06–19/07/2026 o sync não gasta request.
  • Tema, não plugin: UI 100% templates do portal; uma Page nativa com template dedicado.

Isso é o tipo de entrega que empresas de mídia pedem quando o evento é grande: integração estável, custo de API sob controle e UX nativa do veículo.

Common Misconceptions

Mito: Tempo real na Copa exige WebSocket. Correção: Sync servidor + poll curto na REST interna cobre o produto editorial sem complexidade operacional.

Mito: Basta embutir o widget da FIFA/API no front. Correção: Cota, identidade visual e SEO ficam fora de controle; o portal perde o produto.

Mito: Qualquer cron WP resolve. Correção: Visitas não podem spawnar sync; CLI dedicado + whitelist evita rajadas.

FAQ

Qual API foi usada?

API Futebol (api.api-futebol.com.br/v1), Bearer só no wp-config.php — nunca no JavaScript.

Onde está o código?

Classe singleton no tema do Muita Informação (class-wp-copa-do-mundo.php), templates copa-*, JS/CSS dedicados e REST mi/v1/copa.

Posso ver no ar?

Sim: tabela e chaveamento e matérias da editoria Copa com placar embutido. Case do portal: Muita Informação no portfólio.

Como contratar algo assim?

Pelo contato do TLN Design — integrações de dados esportivos, migração e portais de notícias em WordPress.

Conclusion

Integração de Copa em portal de notícias é engenharia de produto: cota, cron, banco, REST e UI editorial no mesmo tema. O Muita Informação mostra o resultado — placar na matéria, grupos, mata-mata e artilheiros — pronto para empresas que precisam da mesma capacidade sob tráfego real.

#API Futebol #Copa do Mundo 2026 #integração #portal de notícias #tempo real #WordPress
Tiago Luvizoto Neves

Tiago Luvizoto Neves

Full Stack Developer, writing about code, UX and the web since 2004