X
chargement ...
gamofile
facebook twitter google +
Tutoriel

Personnaliser son profil

GamoFile vous offre la possibilité de personnaliser votre profil. Il vous est possible de modifier la présentation des informations dans votre profil. Cette fonctionnalité sera améliorée dans le futur, nous espérons que les options disponibles vous contenterons en attendant.

Accéder à l'interface de personnalisation

Pour accéder à l'interface de personnalisation, direction votre profil et cliquer sur le "personnaliser" à droite de vos informations.

Petunia

Pour personnaliser votre profil, vous allez utiliser le langage de description de GamoFile: Petunia. Petunia ajoute des fonctionnalités à simpleText, cela implique que simpleText est intégré à Petunia.

Petunia détecte des sections du document pour générer votre profil. Ces sections sont activables grâce à différentes balises en début de ligne. Voici la liste des balises disponibles ainsi que leurs effets:

#onglet

La balise onglet permet de créer un onglet dans votre profil. Par defaut vous avez les onglets: accueil, console, jeux, accessoires, goodies
onglet par defaut
La synthaxe de cette balise est: #onglet: NOM DE L'ONGLET
Si vous souhaitez avoir du texte qui s'affiche sur tous les onglets, mettez ce texte avant la première balise #onglet ! Exemple:

texte visible sur tout les onglets
#onglet: accueil
texte dans l'onglet accueil
#onglet: jeux
texte dans l'onglet jeux

#style

La balise style vous permet de modifier le style d'affichage du texte qui est sous cette balise. Sa synthaxe est:
#style: STYLE CSS
Il faut remplacer "STYLE CSS" par du code CSS (beaucoup de tutoriels sont disponibles sur internet). Cependant, si vous ne connaissez pas ce langage et que vous ne souhaitez pas chercher sur internet son fonctionnement, une interface d'aide est disponible (voir la section 'interface de petunia').

Si une balise style est mise juste avant une autre balise (onglet, section), elle appliquera le style à toute la section comprise par la balise suivante.
Exemple ci-dessous, avec un changement de couleur de texte:

#style: color:red;
#onglet: accueil
couleur du texte de l'onglet en rouge (red);
#onglet: jeux
couleur du texte par defaut (noir)

#defaut

Cette balise vous permet de revenir au style par défaut. Plus précisement, elle ferme la précedente balise (sauf onglet). Grâce aux balises onglet, section, style, il vous est possible d'avoir 3 niveaux d'imbrications de style. Si vous souhaitez fermer une balise ouverte par section ou style, utilisez "#defaut"

#onglet: accueil
texte dans l'accueil en noir

#style: color:red;
texte de couleur rouge (red);
#style: color:green;
texte avec une couleur verte (green)!

toujours du texte vert

#defaut
texte de couleur noir, la partie de style vert a été fermé par défaut.

Champs automatiques

Dans l'interface de petunia, vous trouverez des boutons qui ajouteront des marqueurs pour permettre d'afficher des champs générés automatiquement (comme les vignettes des dernières consoles ajoutées à votre collection, le nombre de consoles que vous possédez ...)

Exemple illustré

Exemple illustrer

Utilisation avancée avec #section

Cette balise vous permet de créer une section dans un onglet qui pourra recevoir un style de texte. La section est active tant qu'une autre balise section ou une balise defaut n'ont pas été détecté. On vous conseille plutôt d'utiliser une balise section (sans style avant) pour fermer la section en cours. Cela vous permettra de ne pas vous perdre avec 2 #defaut à la suite.

Exemple illustré des sections

Exemple illustrer des sections

Présentation de l'interface de Petunia

L'interface de Petunia se présente ainsi:
interface de petunia

  1. Les boutons de simpleText
  2. Boite à outils Petunia
  3. Aperçu du rendu

La boite à outils

Elle change en fonction de la position de votre pointeur dans le texte. Nous allons voir dans un premier temps l'affichage classic de celle-ci.
interface de petunia
Les boutons onglet,section,style,defaut vous permettent d'insérer rapidement ces balises dans le texte en cliquant dessus. Astuce: les boutons deviennent vert avec un ✓ quand la balise est actuellement active, exemple: exemple section active
Dans cette exemple, à l'emplacement du pointeur, nous sommes dans un onglet avec un style actif.
Les boutons dans 'champs spéciaux' vous permettent d'ajouter le code correspondant à l'action décrite sur le bouton.

La boite à outils des styles apparait quand vous êtes sur une ligne commençant par #style. Comme pour les sections, les boutons deviennent vert avec un ✓ quand la propriété CSS est active. Il vous suffit de cliquer sur le bouton d'une propriété afin d'être guidé pour son utilisation.