Les variables de modèle

Précédemment, nous avons abordé le fonctionnement des gadgets et des sections , et appris à retrouver les éléments d'une page dans un modèle. Voyons maintenant des composants un peu particuliers, les variables de modèles.

Qu'est-ce qu'une variable de modèle ?

Comme dans les langages de programmation classiques, une variable est un objet auquel on attribue une valeur. A chaque utilisation d'une variable, elle sera automatiquement remplacée par sa valeur.

L'intérêt est de ne pas avoir à répéter plusieurs fois le même paramétrage, et ainsi faciliter les modifications ultérieures.

Déclaration d'une variable Blogger

Tout se passe dans le code HTML du modèle, entre les balises dédiées à la mise en forme CSS :

<b:skin><![CDATA[

et

]]></b:skin>

Généralement, dans les templates par défaut de Blogger ou ceux que vous pourrez trouver sur internet, la section de déclarations des variables est clairement indiquée par un commentaire informatif : Exemple :

/* Variable definitions
  ====================

Toutes les variables du modèle sont ensuite déclarées sur le modèle suivant :

<Variable name="nom_variable" description=">desc_variable"
type="type_variable" default="valeur_defaut" value="valeur_actuelle">

• nom_variable est le nom unique de la variable.
• desc_variable décrit le rôle de la variable
• type_variable est une valeur parmi font, color, ou automatic
• valeur_defaut représente la valeur par défaut de la variable dans le modèle.
• valeur_actuelle existe si vous avez redéfini la variable avec l'éditeur de polices et couleurs (voir plus bas)

Les types de variables

Types font et color

Les variables de type font et color bénéficient d'un traitement de faveur : elles sont automatiquement reconnues par Blogger, qui permet de les modifier grâce à l'éditeur de polices et couleurs. Les variables de type font pourront être modifiées grâce à l'éditeur de police permettant de choisir fonte utilisée, style, et taille des caractères.

Les variables de type color pourront être modifiées grâce à l'éditeur de couleur et sa palette intuitive.

Notez que les noms définissant les polices et couleurs à modifier sont récupérés de l'attribut name des variables, la valeur actuelle de l'attribut value, et que le lien Revenir au modèle par défaut réaffecte à la variable sa sa valeur default.

Type automatic

Les variables de type automatic sont, elles, destinées à contenir tout type de valeur autre que police et couleur. Leur valeur n'est modifiable que dans le code HTLM du modèle. Leur intêret ? Ne pas avoir à répéter plusieurs fois une même valeur. Exemple d'utilisation : Si vous utilisez un serveur FTP pour stocker vos images, vous pouvez définir son adresse URL comme variable.

<Variable name="FTPimage" description="Serveur hebergeant les images"
type="automatic" default="http://monftp.free.fr/images/"
value="http://monftp.free.fr/images/">

Utiliser une variable dans le modèle

Très simple. Pour utiliser une variable, utilisez la syntaxe $nom_variable Exemple avec une variable de type font :

#header {
  color: $textColor;
}

Exemple avec une variable de type automatic :

#header {
background:url($FTPimage/header.gif)