Intégration

Widget de suivi de serveur

Colle un tag <script> sur ton site communautaire, ton forum ou une page Wordpress. Le widget fait défiler tes serveurs comme un carrousel en direct, en récupérant le nom d'hôte, la carte actuelle, le nombre de joueurs et le drapeau du pays depuis boost.warzonecs.com toutes les 30 secondes.

Aperçu en direct — un serveur

Avec une seule adresse, le widget affiche une carte statique unique — sans contrôles de carrousel. L'aperçu de droite passe data-lang="lt", donc les libellés des boutons (Connect, Donate, Boost, Copy address, etc.) reviennent en lituanien.

Large, anglais (par défaut)

Large, lituanien

Étroit (mise en page empilée)

Aperçu en direct — plusieurs serveurs

Avec deux adresses ou plus, le widget ajoute des contrôles de carrousel sous la carte et défile automatiquement toutes les six secondes. Tu peux aussi passer d'une carte à l'autre avec les flèches ‹ et › ou en tapant sur les points.

Large (mise en page en ligne)

Étroit (mise en page empilée)

Extrait à copier-coller

<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="fr"
        async></script>

Le widget remplit la largeur de son conteneur et bascule sur la mise en page horizontale au-dessus de 720 px. Enveloppe-le dans un élément de taille fixe pour contrôler l'affichage. Change data-lang pour n'importe quel code supporté (voir tableau des options ci-dessous) pour localiser les libellés et infobulles.

Options

Attribut	Requis	Défaut	Description
data-servers	Oui	—	Liste `ip:port` séparée par des virgules. 12 serveurs max.
data-target	Non	(inline)	Sélecteur CSS de l'élément dans lequel rendre. Omets pour injecter à côté de la balise script.
data-interval	Non	30	Intervalle de rafraîchissement en secondes (15 minimum).
data-cycle	Non	6	Avancement automatique du carrousel en secondes. Mets `0` pour désactiver.
data-lang	Non	en	Langue de l'interface. Supportées : `en`, `ru`, `pl`, `lt`, `de`, `fr`, `es`, `tr`, `cs`, `pt`, `ro`. Les valeurs inconnues retombent sur l'anglais.

Thème

Redéfinis n'importe quelle propriété CSS personnalisée sur .wzcs-monitor dans ta feuille de style — l'effet est immédiat, sans toucher au code du widget.

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

Liste complète des tokens documentée en tête de /js/embed/monitor.js — palette neutre, brand orange, émeraude, rose, ambre, plus --wzcs-radius-* et --wzcs-font{,-mono}.