HyTari Studios · Guide visuel officiel

Menu Info Pages

Apprenez le JSON en voyant le résultat.

Une référence visuelle pratique pour configurer MenuInfoPages. Commencez par la fenêtre centrale, construisez la navigation dans les barres latérales, puis personnalisez les raccourcis O-Key et les objets interactifs. Chaque exemple contient un JSON copiable et une représentation simplifiée du résultat.

À lire d’abord

Premiers pas

ÉTAPE 01

Activer les tutoriels

Dans config.json, définissez languages.fr-FR.enabled et demo sur true. Le paquet Full comprend des tutoriels dans 25 langues.

ÉTAPE 02

Créer une page

Utilisez /infopages newpage <name> <command> ou créez un fichier JSON dans mods/MenuInfoPages/pages/fr-FR/.

ÉTAPE 03

Recharger et tester

Exécutez /infopages reload après une modification du contenu ou des images. Une nouvelle commande joueur ou une modification structurelle d’ItemCommands peut nécessiter un redémarrage.

Ces exemples reposent sur la configuration JSON et les fichiers de tutoriel inclus dans l’édition Full actuelle. Les aperçus sont des schémas pédagogiques, et non des captures d’écran ou un rendu natif de l’interface Hytale. Remplacez les commandes, cibles et noms PNG d’exemple par des ressources disponibles sur votre serveur. Conservez une sauvegarde de vos fichiers existants.

CHAPITRE 01 · 10 EXEMPLES

Interface centrale

Commencez par la page elle-même : texte, sections, images, boutons, permissions et AutoOpen.

01JSON de page

Votre première page

Un fichier JSON crée une page avec sa propre commande, son titre et son introduction.

Configuration JSON
{
  "command": "welcome",
  "title": "BIENVENUE SUR NOTRE SERVEUR",
  "intro": "Bonjour {player} ! Voici tout ce qu’il vous faut pour commencer.",
  "images": [],
  "sections": [
    {
      "title": "PREMIERS PAS",
      "text": "Lisez le règlement, trouvez un endroit où construire et profitez de l’aventure !",
      "images": []
    }
  ],
  "buttons": [],
  "footer": "Bon séjour !"
}

pages/fr-FR/welcome.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

BIENVENUE SUR NOTRE SERVEUR

Bonjour Alex ! Voici tout ce qu’il vous faut pour commencer.

PREMIERS PAS

Lisez le règlement, trouvez un endroit où construire et profitez de l’aventure !

Bon séjour !

Le nom du fichier peut être différent de la commande. Les nouvelles commandes joueur peuvent nécessiter un redémarrage du serveur après leur création.

02JSON de page

Texte enrichi et placeholders

Formatez votre texte et insérez des informations dynamiques provenant du joueur et du serveur.

Configuration JSON
{
  "command": "player-info",
  "title": "INFORMATIONS DU JOUEUR",
  "intro": "{center}{#54DAF4}{b}Bon retour, {player} !{/}{/}",
  "images": [],
  "sections": [
    {
      "title": "{#F894FF}{b}VOS INFORMATIONS{/}{/}",
      "text": "{b}Joueur :{/} {player}\n{b}Monde :{/} {world}\n{b}En ligne :{/} {online}/{max_players}\n{m}Informations utiles sur le serveur{/}",
      "images": []
    }
  ],
  "buttons": []
}

pages/fr-FR/player-info.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

INFORMATIONS DU JOUEUR

Bon retour, Alex !{/}{/}

VOS INFORMATIONS{/}{/}

Joueur :{/} Alex Monde :{/} Survival En ligne :{/} 12/256 Informations utiles sur le serveur{/}

Le texte enrichi est rendu par Hytale. L’aperçu schématique supprime les balises de formatage au lieu de reproduire le moteur de rendu de police natif.

03JSON de page

Couleurs de fond des sections

Combinez des sections standard, transparentes et colorées en HEX dans le même menu.

Configuration JSON
{
  "command": "colors",
  "title": "SECTIONS PERSONNALISÉES",
  "intro": "Choisissez un style visuel pour chaque zone de contenu.",
  "images": [],
  "sections": [
    {
      "title": "PAR DÉFAUT",
      "text": "Style natif de la section.",
      "backgroundColor": "default",
      "images": []
    },
    {
      "title": "TRANSPARENT",
      "text": "Le panneau de fond est supprimé.",
      "backgroundColor": "none",
      "images": []
    },
    {
      "title": "HEX PERSONNALISÉ",
      "text": "Une couleur personnalisée pour la section.",
      "backgroundColor": "#243D59",
      "images": []
    }
  ],
  "buttons": []
}

pages/fr-FR/colors.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

SECTIONS PERSONNALISÉES

Choisissez un style visuel pour chaque zone de contenu.

PAR DÉFAUT

Style natif de la section.

TRANSPARENT

Le panneau de fond est supprimé.

HEX PERSONNALISÉ

Une couleur personnalisée pour la section.

Utilisez backgroundColor sur la section individuelle, pas sur toute la page.

04JSON de page

Introduction et images d’en-tête fixes

Une introduction et jusqu’à six images restent au-dessus des sections défilantes.

Configuration JSON
{
  "command": "header",
  "title": "NOTRE COMMUNAUTÉ",
  "intro": "{center}Explorez le serveur et ses fonctionnalités.",
  "images": [
    {
      "image": "server-logo.png"
    },
    {
      "image": "welcome-banner.png"
    }
  ],
  "sections": [
    {
      "title": "CONTENU DÉFILANT",
      "text": "Cette section défile tandis que l’introduction et les images d’en-tête restent visibles.",
      "images": []
    }
  ],
  "buttons": []
}

pages/fr-FR/header.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

NOTRE COMMUNAUTÉ

Explorez le serveur et ses fonctionnalités.

server-logo.png
welcome-banner.png
CONTENU DÉFILANT

Cette section défile tandis que l’introduction et les images d’en-tête restent visibles.

Placez server-logo.png et welcome-banner.png dans mods/MenuInfoPages/images/ avant d’ouvrir la page. Utilisez des PNG ; garder chaque fichier sous 2 Mo est recommandé pour un chargement plus rapide, mais ce n’est pas obligatoire.

05JSON de page

Plusieurs images dans une section

Placez jusqu’à six images dans une section. Elles sont réparties dans des cellules horizontales de même taille.

Configuration JSON
{
  "command": "places",
  "title": "LIEUX À VISITER",
  "intro": "Choisissez une destination.",
  "images": [],
  "sections": [
    {
      "title": "DESTINATIONS",
      "text": "Choisissez où vous souhaitez aller.",
      "images": [
        {
          "image": "spawn.png",
          "command": "spawn",
          "runAs": "player",
          "close": true,
          "delayMs": 100
        },
        {
          "image": "market.png",
          "command": "warp market",
          "runAs": "player",
          "close": true,
          "delayMs": 100
        },
        {
          "image": "website.png",
          "command": "https://example.org",
          "close": false
        }
      ]
    }
  ],
  "buttons": []
}

pages/fr-FR/places.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

LIEUX À VISITER

Choisissez une destination.

DESTINATIONS

Choisissez où vous souhaitez aller.

spawn.png
market.png
website.png

Chaque nom de fichier correspond à un PNG que vous placez dans mods/MenuInfoPages/images/.

06JSON de page

Boutons dans une section

Donnez à une section ses propres actions interactives primary, secondary et danger.

Configuration JSON
{
  "command": "section-actions",
  "title": "COMMANDES UTILES",
  "intro": "Les différents styles de boutons rendent les actions faciles à identifier.",
  "images": [],
  "sections": [
    {
      "title": "NAVIGATION",
      "text": "Une section peut contenir du texte, des images et des boutons.",
      "images": [],
      "buttons": [
        {
          "text": "SPAWN",
          "command": "spawn",
          "runAs": "player",
          "close": true,
          "delayMs": 250,
          "style": "primary"
        },
        {
          "text": "RÈGLEMENT DU SERVEUR",
          "page": "rules",
          "style": "secondary"
        },
        {
          "text": "EXEMPLE DANGER",
          "style": "danger"
        }
      ]
    }
  ],
  "buttons": []
}

pages/fr-FR/section-actions.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

COMMANDES UTILES

Les différents styles de boutons rendent les actions faciles à identifier.

NAVIGATION

Une section peut contenir du texte, des images et des boutons.

SPAWN
RÈGLEMENT DU SERVEUR
EXEMPLE DANGER

Utilisez page pour ouvrir directement une autre page MenuInfoPages. Utilisez command pour exécuter des commandes ; runAs: console ne doit être utilisé que pour des actions de confiance.

07JSON de page

Barre d’actions inférieure

Placez jusqu’à six actions en bas, séparées des sections défilantes.

Configuration JSON
{
  "command": "shortcuts",
  "title": "ACTIONS RAPIDES",
  "intro": "Les raccourcis courants réunis au même endroit.",
  "images": [],
  "sections": [
    {
      "title": "AIDE",
      "text": "Choisissez une action ci-dessous.",
      "images": []
    }
  ],
  "buttons": [
    {
      "text": "RÈGLEMENT",
      "page": "rules",
      "style": "primary"
    },
    {
      "text": "SPAWN",
      "command": "spawn",
      "runAs": "player",
      "close": true,
      "delayMs": 250,
      "style": "secondary"
    },
    {
      "text": "SITE WEB",
      "command": "https://example.org",
      "style": "secondary"
    }
  ]
}

pages/fr-FR/shortcuts.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

ACTIONS RAPIDES

Les raccourcis courants réunis au même endroit.

AIDE

Choisissez une action ci-dessous.

RÈGLEMENT
SPAWN
SITE WEB

Les cibles comme rules ou warp market doivent exister sur votre serveur. Une cible page correspond à la commande interne d’une page MenuInfoPages.

08JSON de page

Permissions de page

Ajoutez un nœud de permission facultatif pour réserver une page aux utilisateurs autorisés.

Configuration JSON
{
  "command": "staff-info",
  "permission": "server.staff",
  "title": "INFORMATIONS DU STAFF",
  "intro": "Informations réservées aux joueurs autorisés.",
  "images": [],
  "sections": [
    {
      "title": "NOTES DU STAFF",
      "text": "Seuls les joueurs disposant de la permission server.staff peuvent ouvrir cette page.",
      "images": []
    }
  ],
  "buttons": []
}

pages/fr-FR/staff-info.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

INFORMATIONS DU STAFF

Informations réservées aux joueurs autorisés.

NOTES DU STAFF

Seuls les joueurs disposant de la permission server.staff peuvent ouvrir cette page.

Le nœud de permission est un exemple. Accordez-le via le système de permissions de votre serveur. AutoOpen respecte également les permissions de page.

09JSON de page

Ouverture automatique à la connexion

Affichez une page d’accueil une seule fois, toujours, ou jusqu’à ce que le joueur la désactive.

Configuration JSON
{
  "autoOpen": {
    "enabled": true,
    "mode": "dismissible",
    "version": 1,
    "worlds": [],
    "delayMs": 1500
  },
  "command": "server-guide",
  "title": "GUIDE DU SERVEUR",
  "intro": "Bienvenue ! Cochez Ne plus afficher pour masquer cette page lors de vos prochaines connexions.",
  "images": [],
  "sections": [
    {
      "title": "PREMIERS PAS",
      "text": "Lisez notre règlement et découvrez comment vous orienter.",
      "images": []
    }
  ],
  "buttons": []
}

pages/fr-FR/server-guide.json

Résultat visuelAperçu schématique
MENUINFOPAGES · SCHÉMA×

GUIDE DU SERVEUR

Bienvenue ! Cochez Ne plus afficher pour masquer cette page lors de vos prochaines connexions.

PREMIERS PAS

Lisez notre règlement et découvrez comment vous orienter.

Configurez autoOpen sur la version de cette page correspondant à la langue de secours. N’activez pas plusieurs pages AutoOpen qui se chevauchent pour le même monde : si plusieurs pages correspondent, aucune ne s’ouvre automatiquement.

10JSON de configuration

Activer les tutoriels inclus

Choisissez les langues chargées indépendamment de celles pour lesquelles les pages de démonstration sont générées.

Configuration JSON
{
  "fallbackLanguage": "en-US",
  "languages": {
    "en-US": {
      "enabled": true,
      "demo": true
    },
    "it-IT": {
      "enabled": true,
      "demo": false
    },
    "de-DE": {
      "enabled": true,
      "demo": false
    }
  }
}

config.json — top-level fields

Résultat visuelAperçu schématique

Paramètres de langue

en-USChargée · Demo ON
it-ITChargée · Demo OFF
de-DEChargée · Demo OFF

La langue du client sélectionne la traduction de la page ; les traductions manquantes utilisent la langue de secours configurée.

L’édition Full contient 25 dossiers de langue. enabled et demo doivent tous deux être true pour générer les pages de tutoriel d’une langue. Définissez demo sur false lorsque vous n’en avez plus besoin.

CHAPITRE 03 · 4 EXEMPLES

O-Key & HUD

Créez des raccourcis rapides, positionnez leurs indicateurs et configurez leur comportement par monde.

01JSON de configuration

Raccourci O-Key global

Définissez la commande par défaut, les permissions et l’indicateur HUD pour chaque monde.

Configuration JSON
{
  "O-Key": {
    "Enabled": true,
    "RequirePermission": false,
    "Permission": "menuinfopages.okey",
    "OpPermission": "hytale.command.gamemode",
    "AllWorlds": {
      "Command": "menuinfopages",
      "OpCommand": "menuinfopages",
      "AppliesOnOP": true,
      "CooldownMs": 250,
      "Hud": {
        "Enabled": true,
        "Horizontal": "right:-8",
        "Vertical": "top:245",
        "Title": "menuinfopages.hud.okey.press",
        "Image": "default",
        "Width": 112,
        "Height": 112
      }
    }
  }
}

config.json — O-Key object

Résultat visuelAperçu schématique

O-Key · HUD illustratif

O

Représentation de l’écran de jeu

Position du HUD : right:-8, top:245. Les commandes et le comportement sont configurés dans config.json.

Modifiez l’objet O-Key existant au lieu de remplacer tout votre config.json. La valeur default de l’image HUD fait référence à l’icône incluse.

02JSON de configuration

Centrer le HUD O-Key

Utilisez center indépendamment sur chaque axe et ajustez l’autre axe depuis un bord.

Configuration JSON
{
  "Hud": {
    "Enabled": true,
    "Image": "default",
    "Width": 112,
    "Height": 112,
    "Horizontal": "center",
    "Vertical": "top:190"
  }
}

config.json — O-Key.AllWorlds.Hud

Résultat visuelAperçu schématique

O-Key · HUD illustratif

O

Représentation de l’écran de jeu

Position du HUD : center, top:190. Les commandes et le comportement sont configurés dans config.json.

Cet exemple est un objet Hud partiel ; intégrez ces valeurs à vos paramètres O-Key.AllWorlds.Hud existants.

03JSON de configuration

Overrides par monde et instance

Attribuez un autre raccourci à certains mondes, y compris aux instances générées avec un wildcard final.

Configuration JSON
{
  "WorldOverrides": [
    {
      "Worlds": [
        "Survival"
      ],
      "Enabled": true,
      "Command": "welcome",
      "Hud": {
        "Enabled": true,
        "Horizontal": "right:-5",
        "Vertical": "center"
      }
    },
    {
      "Worlds": [
        "instance-Forgotten_Temple-*"
      ],
      "Enabled": true,
      "Command": "server-guide",
      "Hud": {
        "Enabled": true,
        "Horizontal": "center",
        "Vertical": "top:190"
      }
    }
  ]
}

config.json — O-Key.WorldOverrides

Résultat visuelAperçu schématique

O-Key · HUD illustratif

O

Représentation de l’écran de jeu

Survival → /welcome
instance-Forgotten_Temple-* → /server-guide

Un seul * final est pris en charge dans un préfixe de nom de monde. Les noms exacts ont priorité sur les motifs wildcard ; sinon, le préfixe correspondant le plus long l’emporte.

04JSON de configuration

Image O-Key personnalisée

Utilisez votre propre PNG avec une taille et une position configurables.

Configuration JSON
{
  "Hud": {
    "Enabled": true,
    "Image": "okey-survival.png",
    "Width": 300,
    "Height": 200,
    "Horizontal": "right:-5",
    "Vertical": "top:138"
  }
}

config.json — O-Key.AllWorlds.Hud

Résultat visuelAperçu schématique

O-Key · HUD illustratif

O

Représentation de l’écran de jeu

Position du HUD : right:-5, top:138. Les commandes et le comportement sont configurés dans config.json.

Placez okey-survival.png dans mods/MenuInfoPages/images/. Faites correspondre Width/Height au ratio du PNG, par exemple 600×400 affiché en 300×200.

CHAPITRE 04 · 2 EXEMPLES

ItemCommands

Créez des objets avec des commandes distinctes pour le clic gauche et le clic droit.

01JSON de configuration

Activer un objet de démonstration

L’exemple inclus fournit un objet source interactif avec des actions séparées pour le clic gauche et le clic droit.

Configuration JSON
{
  "itemCommands": {
    "enabled": true,
    "items": [
      {
        "id": "demo",
        "sourceItem": "MenuInfoPages_Demo_Grimoire_Source",
        "name": "Pages de démonstration",
        "quality": "",
        "leftClickCommand": "menuinfopages",
        "rightClickCommand": "menuinfopages"
      }
    ]
  }
}

config.json — itemCommands object

Résultat visuelAperçu schématique

ItemCommands · carte des interactions

Pages de démonstration

Clic gauche/menuinfopages
Clic droit/menuinfopages

Il s’agit de l’ID réel de l’objet source de l’exemple inclus. Contrairement aux modifications de pages, les changements structurels des items peuvent nécessiter un redémarrage du serveur.

02JSON de configuration

Commandes gauche et droite séparées

Utilisez un objet Hytale existant ou provenant d’un mod installé comme source d’un nouveau raccourci interactif.

Configuration JSON
{
  "itemCommands": {
    "enabled": true,
    "items": [
      {
        "id": "server-shortcuts",
        "sourceItem": "MenuInfoPages_Demo_Grimoire_Source",
        "name": "Raccourcis serveur",
        "quality": "",
        "leftClickCommand": "welcome",
        "rightClickCommand": "spawn"
      }
    ]
  }
}

config.json — itemCommands object

Résultat visuelAperçu schématique

ItemCommands · carte des interactions

Raccourcis serveur

Clic gauche/welcome
Clic droit/spawn

Remplacez sourceItem par l’ID réel d’un objet installé sur votre serveur et choisissez des commandes existantes accessibles aux joueurs. ItemCommands est indépendant du JSON des pages.

Avant d’utiliser un exemple

Exemples de pages complètes : Placez chaque objet JSON dans son propre fichier sous mods/MenuInfoPages/pages/fr-FR/. Gardez une commande distincte pour chaque page et traduisez les fichiers correspondants dans les autres dossiers de langue si nécessaire.

Exemples de configuration : Les objets O-Key et ItemCommands sont des fragments de votre config.json existant. Intégrez les propriétés illustrées à leur emplacement correct ; ne remplacez jamais tout le fichier de configuration par un petit exemple.

Configuration sûre : Placez les PNG référencés dans le dossier d’images prévu. Pour de meilleures performances, il est recommandé, mais non obligatoire, de garder chaque image sous 2 Mo ; les fichiers plus grands peuvent demander davantage de temps et de mémoire au chargement. Les commandes de démonstration, cibles de navigation, permissions et URL externes sont des espaces réservés pour vos propres ressources. Évitez d’exécuter des commandes privilégiées pour des joueurs non fiables.

Schéma actuel : Ce guide documente le système actuel sections, leftContent et rightContent ; un éventuel futur modèle unifié content/cells n’est pas présenté comme une fonction déjà disponible.

RETOUR EN HAUT