Introduction à l'XML
Tout d'abord, sachez que les fichiers manialinks sont des fichiers .xml Je ne vais pas vous faire un cours sur le XML, pour cela allez sur le
Site du Zero rubrique Site Web, les premiers chapitres. En effet, le xHTML étant un dérivé du XML, il vous suffit de comprendre la syntaxe Clin d'oeil
Dans l'ordre, balise par couple et balise simple
Code:
<balise>contenu</balise>
<balise>
Dans les manialinks, les attributs doivent être spécifiés entre guillemets et non apostrophes.Lecture des manialinks par le jeuPour visualiser un manialink sur le jeu, il suffit de taper l'adresse du fichier xml (hébergé au préalable sur un serveur FTP ordinaire) dans la barre d'adresse du jeu et c'est tout Sourire Il y a aussi des raccourcis avec lesquels il suffit d'inscrire le pseudo du joueur, pour cela il faut s'inscrire chez
NadeoMaintenant, passons au vif du sujet Très content
Structure du fichierUn manialink a une structure de base commune à toutes les pages.
Code:
<xml>
<manialink>
<type>default</type>
<background>
<format>
<commentaire>
</manialink>
La première ligne informe le type de fichier (il faut absolument encoder en UTF8). Puis, on ouvre une balise <manialink> (pour la bêta, la balise s'appelait <manianet>, mais ça a changé). C'est uniquement dans celle-ci que l'on va travailler. Puis, viennent 3 balises qui donnent des informations : la première donne le type (je ne sais pas à quoi elle sert, mieux vaux la mettre ^^), la deuxième donne la couleur de fond et la taille des bordures et la troisième la couleur/taille du texte (3 semble êter un bon compromis). Pour les tailles, il n'y a pas de systèmes de pixels ou autre. C'est une valeur qui ressemble au em en CSS. Le mieux pour s'en rendre compte est de faire des tests Clin d'oeil
Pour définir une couleur par le biais d'une balise (il y a une autre façon qui est différente), on utilise un code RVBA (ou RGBA en anglais)
Rouge/Red : la valeur de rouge
Vert/Green : la valeur de vert
Bleu/Blue : la valeur de bleu
Alpha : la valeur de la transparence. Plus elle est élevée, plus la couleur sera opaque
Toutes ces valeurs s'expriment en héxadécimal (chiffres de 0 à 9 et lettres de A à F ; du plus petit au plus grand 0-1-2-3-4-5-6-7-8-9-A-B-C-D-E-F)
Ca marche de la même manière que les couleurs de la lumière (cf cours de physique de 4ème M. Green )
En gros, voici quelques exemples :
F006 : rouge transparent
FF00 : jaune invisible
0FFA : cyan moyennement transparent
0CFF : bleu clair opaque
Les lignes et cellulesSi vous avez souhaité continué à lire les cours de xHTML jusqu'aux tableaux, cela pourrait vous être utile pour comprendre le principe même de la composition d'un manialink. En effet, la page est séparée en lignes et cellules, de la même manière que les tableaux Clin d'oeil Donc, si vous avez compris, il suffit de créer des lignes avec des cellules.
Une ligne doit obligatoirement comporter une cellule afin d'être affichée. La structure est donc la suivante.
Code:
<line>
<cell>contenu ...</cell>
</line>
Vous voyez, c'est simple
Pour afficher du texte, on le place dans la balise
<text>le texte à écrire</text>Maintenant, sachez qu'il est possible :
- de séparer la ligne en plusieurs cellules
- de donner des couleurs de fond à une cellule
- de donner une couleur au texte
- de spécifier la hauteur de la ligne et la largeur de la colonne (je dis comme ça puisque les attributs vont dans ces balises, c-a-d qu'on ne peux pas mettre l'attribut sur la largeur dans la ligne Clin d'oeil )
Code:
<line>
<cell>
<text>Maps</text>
</cell>
<cell>
<text>Skins</text>
</cell>
</line>
Ici, il y aura une ligne d'une certaine auteur (0.25 unités de TMU) dont le total de la largeur des cellules sera égal à 1 unité (0.5 + 0.5). Chaque cellule aura une couleur de fond et une couleur de texte spécifique (ici fond violet pâle et texte blanc/bleu léger)
Avec tout ce que vous savez, vous êtes déjà capable de faire pas mal de choses (n'oubliez pas qu'il faut essayer pour progresser Clin d'oeil )
Les liens internes/externesVous pouvez créer plusieurs types de liens : des internes, qui s'ouvrent directement dans le navigateur de TMU, ou des externes, qui s'ouvrent dans une nouvelle page d'un navigateur classique (ie, ff etc...).
Pour les premiers (les internes), on utilisera la forme
$h [adresse du lien
] intitulé du lien
$hCode:
$h[http://lien_interne] intitulé du lien $h
Pour les externes, on remplace le
$h par
$l :
Code:
$l[http://lien_externe] intitulé du lien $l
Notez que si vous avez enregistré votre raccourci Manialink chez NADEO, il suffit d'écrire le nom du raccourci dans l'url du lien. Par exemple, pour un raccourci de http://bidule.com/home.xml au nom de bidule:home, vous pouvez directement saisir le nom du raccourci dans l'url du lien Clin d'oeilLes médias (images/sons/vidéos)Pour insérer une image, on place une balise
<icon> à l'intérieur d'une cellule (donc d'une ligne Idée ), et l'on indique à l'intérieur l'URL :
Code:
<icon>URL DE L'IMAGE</icon>
Encore une fois très simple Très content Vous pouvez attribuer une taille et hauteur (toujours avec le même système d'unités Confus ), ainsi qu'un lien (lorsque l'on clique sur l'image, cela mènera à une page dans le navigateur).
Code:
<icon>URL DE L'IMAGE</icon>
Pour insérer un son (bande sonore, ...) au format
.ogg,
.wav ou
.mux dans votre page, balise
<audio> avec les attributs :
- longueur/largeur : définissent la taille le bouton Play/pause
- play : il a 2 valeurs possibles : 0 et 1. Si il est égal à 1, la musique se jouera automatiquement lorsque l'on rentre dans la page (dumoins à la fin du chargement, puisqu'il faut attendre que les médias soient chargés entièrement pour qu'il soient joués)
- vous pouvez également si vous le souhaitez placer un attribut
halign qui alignera le bouton selon la valeur de cet attribut (left, center, right) Clin d'oeil
Code:
<audio>URL DU SON</audio>
C'est exactement la même chose pour les vidéos, à cela près que les fichiers sont au format .bik et que la balise est .......
Alors, à votre avis, c'est quoi M. Green
Flèche
Code:
<video>URL DE La VIDEO</video>
Voilà, maintenant vous êtes capables de créer vos pages manialinks Très content
N'oubliez pas que pour les visualiser, vous avez le
Manialink viewer
Ce tuto a été réalisé par
graphi05 >>> ICI <<<
njones03
.