tutorial

Cómo Poner la Tabla del Campeonato en tu Sitio (Widgets)

Torneyo · · 7 min de lectura

Cómo Poner la Tabla del Campeonato en tu Sitio (Widgets)

Si administras el sitio de una liga de barrio, escuelita de fútbol, portal deportivo regional o la página de tu empresa con el campeonato interno, sabes que mantener la tabla actualizada es un trabajo aparte. En cada fecha, alguien tiene que editar la página, actualizar puntos, subir una imagen nueva. Con los widgets embebibles de Torneyo, la tabla del campeonato embed en el sitio se actualiza sola en tiempo real — y nunca más tienes que tocar HTML.

En este tutorial vas a aprender a generar el código del widget, pegarlo en tu sitio y personalizar colores y elementos. Funciona en WordPress, Wix, Webflow, Squarespace, HTML puro y prácticamente cualquier otro CMS.

Qué Son los Widgets Embebibles

Un widget embebible es un pequeño bloque de HTML (normalmente un <iframe>) que pegas en tu sitio y muestra contenido de otra plataforma. Es la misma lógica del video de YouTube o del post de Instagram que incrustas en un artículo.

En Torneyo, los widgets muestran información en vivo de tu campeonato:

  • Clasificación completa
  • Próximos partidos
  • Últimos resultados
  • Goleadores
  • Tarjetas y disciplina
  • Llave eliminatoria

Todo actualizado automáticamente, sin tener que republicar nada.

Por Qué Usar Widgets

Un sitio deportivo con tabla estática pierde credibilidad rápido. Si el hincha o atleta visita el sitio el lunes y la tabla sigue siendo la de la fecha anterior, deja de volver.

Con un widget de campeonato deportivo en vivo, ganas:

  • Actualización en tiempo real — apenas se cierra la planilla, el widget lo refleja
  • Mejor SEO — páginas actualizadas rankean mejor
  • Mayor engagement — el hincha vuelve todos los días para chequear la tabla
  • Cero mantenimiento — te olvidas que el widget existe, se sostiene solo
  • Identidad visual de tu sitio — personalización de colores y tipografías

Tipos de Widgets Disponibles

Widget de Clasificación

El más popular. Muestra la tabla completa de la categoría: posición, equipo, partidos jugados, victorias, empates, derrotas, goles a favor, goles en contra, diferencia y puntos.

Ideal para la página principal de ligas y campeonatos de todos contra todos.

Widget de Próximos Partidos

Lista los próximos 5 o 10 partidos con fecha, hora, lugar y equipos. Útil para páginas de “agenda” o “calendario”.

Widget de Últimos Resultados

Muestra los últimos partidos jugados con el marcador final. Perfecto para la sección “resultados” o un banner lateral.

Widget de Goleadores

Ranking de los máximos goleadores con foto, equipo y cantidad de goles. Excelente para generar engagement de los atletas y buzz en redes sociales.

Widget de Llave Eliminatoria

Bracket visual interactivo para la fase eliminatoria. Quien hace clic en una llave ve los detalles del partido. Muy usado en semifinales y finales.

Widget de Disciplina

Listado de tarjetas y suspensiones de la fecha. Interesante para portales más completos.

Cómo Generar el Código del Widget

El proceso toma menos de dos minutos.

Paso 1 — Acceder al Menú de Widgets

En el área del campeonato, haz clic en “Widgets e Integración” en el menú lateral.

Paso 2 — Elegir el Tipo

Selecciona el widget deseado. Puedes generar tantos como quieras, todos apuntando al mismo campeonato.

Paso 3 — Personalizar

Para cada widget defines:

  • Categoría/fase — qué tabla mostrar (adulto, sub-15, cuartos de final, etc.)
  • Color principal — que combine con la identidad de tu sitio
  • Color de fondo — claro, oscuro o transparente
  • Tipografía — estándar o personalizada
  • Mostrar logo de Torneyo — encendido o apagado (disponible en planes pagos)
  • Tamaño — ancho completo, compacto, super compacto

Un preview en tiempo real muestra cómo va a quedar.

Paso 4 — Copiar el Código

El sistema genera un código así:

<iframe
  src="https://torneyo.com/embed/campeonato/123/clasificacion"
  width="100%"
  height="600"
  frameborder="0">
</iframe>

Copias ese código y lo pegas en tu sitio.

Cómo Pegarlo en Cada Plataforma

WordPress

En el editor por bloques, agrega un bloque “HTML Personalizado” y pega el código. Publica.

Wix

En modo edición, arrastra el elemento “Embed HTML” a la página, pega el código y guarda.

Webflow

Arrastra un “Embed” al canvas, pega el código, guarda y publica.

Squarespace

Agrega el bloque “Code” y pega el código. Ajusta la altura si hace falta.

HTML puro

Pega el código directamente dentro del <body>, donde quieras que aparezca el widget.

Elementor (WordPress)

Usa el widget “HTML” y pega el código.

Personalización Avanzada

Para quien busca integración total con el look del sitio, Torneyo ofrece:

CSS Personalizado (planes pagos)

Puedes inyectar reglas CSS propias vía parámetro en la URL del iframe. Esto permite alinear el widget al 100% con la identidad del sitio: cambiar colores de posición, bordes, tipografía y hasta mostrar logos de los equipos.

API Pública

Para desarrolladores, Torneyo también expone una API REST que devuelve los mismos datos en JSON. Así puedes construir tu propio widget desde cero, integrar en apps móviles, dashboards internos o generar cards para redes sociales.

Multi-idioma

El widget respeta el idioma configurado en el campeonato. Ideal para ligas internacionales que atienden público en español, inglés y portugués.

Actualización Automática

Los widgets se actualizan solos cada 30 segundos. Los hinchas con la página abierta ven aparecer el gol sin tener que recargar.

Casos de Uso Reales

Sitio de Liga de Fútbol Sala

Liga amateur con 12 equipos mantenía un Excel en un Google Drive compartido. Hoy incrusta la clasificación directo en el sitio oficial, con actualización en cada planilla cerrada. El tráfico del sitio se triplicó.

Escuelita de Fútbol

Una escuelita con 200 alumnos incrusta los goleadores de las categorías formativas en el sitio. Los padres lo visitan cada semana para ver al hijo en el ranking. Engagement y matrículas crecieron.

Portal Deportivo Regional

Un portal de noticias deportivas de barrio usa el widget de próximos partidos para recomendar eventos para ir el fin de semana. Se convirtió en la principal sección de retención de visitantes.

Copa Interna de Empresa

RRHH de la empresa incrusta el widget de clasificación en la intranet de Confluence. Los empleados siguen la copa del cuatrimestre y participan más.

Precauciones y Buenas Prácticas

  • Prueba en diferentes anchos — el widget es responsive, pero vale chequear en mobile
  • Elige altura adecuada — las tablas grandes necesitan más altura, o scroll interno
  • No abuses de widgets en la misma página — 3 o 4 es lo ideal, más pesa demasiado
  • Mantén coherencia visual — usa el mismo color principal en todos los widgets del sitio
  • Usa HTTPS — los widgets de Torneyo solo funcionan en sitios con HTTPS (estándar hoy)

Preguntas Frecuentes

¿El widget funciona aunque el hincha no tenga cuenta en Torneyo?

Sí. El widget es público. Cualquier visitante de tu sitio ve los datos, sin necesidad de loguearse en ningún lado.

¿Si cambio el campeonato, el widget se rompe?

No. El widget apunta al campeonato específico, aunque sea editado o renombrado después. Solo deja de funcionar si el campeonato se archiva definitivamente.

¿Puedo tener varios widgets en el mismo sitio?

Sí. Cada widget es independiente, así que puedes tener clasificación en una página, goleadores en otra y próximos partidos en la home.

¿Funciona en apps móviles?

Vía webview, sí. Para integración nativa, usa la API REST.

Empieza Hoy

Incrustar la tabla del torneo en tu sitio es uno de los cambios más simples y con mayor impacto visual del campeonato. En minutos tienes un sitio con look profesional y contenido siempre actualizado.

Si todavía no tienes el campeonato configurado, lee también nuestra guía sobre tabla de campeonato online gratis y después vuelve acá para incrustarlo.

Generar el widget de tu campeonato →