Insertar

Widget del monitor de servidor

Pega una etiqueta <script> en tu sitio comunitario, foro o página de Wordpress. El widget rota entre tus servidores como un carrusel en vivo, obteniendo hostname, mapa actual, número de jugadores y bandera del país desde boost.warzonecs.com cada 30 segundos.

Vista previa en vivo — un servidor

Con una dirección, el widget muestra una única tarjeta estática — sin controles de carrusel. La vista previa de la derecha pasa data-lang="lt", así los textos de los botones (Connect, Donate, Boost, Copy address, etc.) vuelven en lituano.

Ancho, inglés (predeterminado)

Ancho, lituano

Estrecho (diseño apilado)

Vista previa en vivo — varios servidores

Con dos o más direcciones, el widget añade controles de carrusel debajo de la tarjeta y avanza automáticamente cada seis segundos. También puedes pasar con las flechas ‹ y › o tocando los puntos.

Ancho (diseño en fila)

Estrecho (diseño apilado)

Fragmento para copiar y pegar

<div id="wzcs-monitor" style="width: 820px; max-width: 100%;"></div>
<script src="https://boost.warzonecs.com/js/embed/monitor.js"
        data-servers="91.211.247.155:27015"
        data-target="#wzcs-monitor"
        data-lang="es"
        async></script>

El widget ocupa el ancho de su contenedor y cambia al diseño horizontal en fila por encima de 720 px. Envúelvelo en un elemento de tamaño fijo para controlar cómo se distribuye. Cambia data-lang por cualquier código soportado (ver tabla de opciones abajo) para localizar los textos de botones y tooltips.

Opciones

Atributo	Requerido	Predeterminado	Descripción
data-servers	Sí	—	Lista `ip:port` separada por comas. Máx. 12 servidores.
data-target	No	(inline)	Selector CSS del elemento donde renderizar. Omite para inyectar junto a la etiqueta script.
data-interval	No	30	Intervalo de actualización en segundos (mínimo 15).
data-cycle	No	6	Auto-avance del carrusel en segundos. Pon `0` para desactivar.
data-lang	No	en	Idioma de la interfaz. Soportados: `en`, `ru`, `pl`, `lt`, `de`, `fr`, `es`, `tr`, `cs`, `pt`, `ro`. Los valores desconocidos vuelven al inglés.

Personalización

Sobrescribe cualquier propiedad CSS personalizada de .wzcs-monitor en tu propia hoja de estilos — se aplica al instante, sin tocar el código del widget.

.wzcs-monitor {
    --wzcs-neutral-900-60: #0a0e1a;
    --wzcs-brand-500: #22d3ee;
    --wzcs-radius-xl: 4px;
    --wzcs-font: "Fira Sans", sans-serif;
}

Lista completa de tokens documentada al inicio de /js/embed/monitor.js — paleta neutra, brand naranja, esmeralda, rosa, ámbar, más --wzcs-radius-* y --wzcs-font{,-mono}.