ThéorieRéférences XMLTypes des variables d'habillage

Variables d'habillage - Les polices [font]

Les polices [font]
Le terme font est employé pour qualifier une variable d'habillage.
Une variable de type font contient les paramètres d'une police.

Syntaxe

Les variables d'habillage sont définies dans l'éditeur XML du modèle, entre les balises <b:skin></b:skin>. Elles permettent de reporter une valeur dans la section des CSS ou/et dans le reste du modèle XML.

<Variable name="name"
          description="description"
          type="font"
          default="value"
          value="value" />


Attributs

Paramètre Signification -
name Le nom ne peut contenir que des lettres ou des chiffres et doit être unique.
Exception : Le caractère . (point) peut être utilisé.
Ce nom sera utilisé pour extraire la valeur de la variable.
obligatoire
description Une courte description.
obligatoire
type Détermine le type de la valeur de la variable. obligatoire
default La valeur par défaut de la variable. obligatoire
value La valeur courante de la variable. obligatoire


La valeur

La valeur attendue doit contenir les paramètres de la police.

Syntaxe de la valeur
font-style font-weight font-size font-family

Exemple
italic bold 12px Georgia, Utopia, 'Palatino Linotype', Palatino, serif


Sortie des données

Lorsque la variable est définie, il est possible d'en extraire sa valeur dans la section réservée aux CSS ou/et à l'extérieur de la balise b:skin.

Dans la balise b:skin, il suffit de reprendre le nom de la variable, de l'encadrer de parenthèses et d'ajouter le préfixe $.

Par exemple, la variable dont le nom est text.font, sa syntaxe de sortie sera $(text.font).
A savoir : Les parenthèses ne sont requises que si le nom de la variable contient un point.

Définition de la variable
<Variable name="text.font"
          description="Text Font"
          type="font"
          default="italic bold 12px Georgia, Utopia, 'Palatino Linotype', Palatino, serif"
          value="italic bold 12px Georgia, Utopia, 'Palatino Linotype', Palatino, serif" />

Intégration de la variable dans les CSS
body {
  font: $(text.font);
}

Rendu HTML
body {
  font: italic bold 12px Georgia, Utopia, 'Palatino Linotype', Palatino, serif;
}


Lorsque l'on souhaite exporter la valeur à l'extérieur de b:skin, le langage XML reprend ses droits et la donnée peut être traitée comme les autres données issues d'un dictionnaire quelconque.
La donnée convertie, devient de type string et peut être injectée dans des expressions.

text.font devient : data:skin.vars.text_font.

Balise de sortie data
<data:skin.vars.text_font/>

Pour extraire uniquement la taille de la police, il faut ajouter le suffixe size à la donnée.

data:skin.vars.text_font devient : data:skin.vars.text_font.size.

Balise de sortie data
<data:skin.vars.text_font.size/>

Complément : Bibliothèque des variables "font" définies dans les modèles officiels.


Le formulaire dans le concepteur

Lorsqu'une variable de type font est définie dans le modèle, un formulaire est automatiquement affiché dans l'outil de conception de modèles :

  • Tableau de bord
  • Modèle
  • Personnalisé
  • Avancé




Polices Blogger

Nom Preview
Arial, Tahoma, Helvetica, FreeSans, sans-serif Arial, Tahoma, Helvetica, FreeSans, sans-serif
'Courier New', Courier, FreeMono, monospace 'Courier New', Courier, FreeMono, monospace
Georgia, Utopia, 'Palatino Linotype', Palatino, serif Georgia, Utopia, 'Palatino Linotype', Palatino, serif
Impact, sans-serif Impact, sans-serif
'Times New Roman', Times, FreeSerif, serif 'Times New Roman', Times, FreeSerif, serif
'Trebuchet MS', Trebuchet, sans-serif 'Trebuchet MS', Trebuchet, sans-serif
Verdana, Geneva, sans-serif Verdana, Geneva, sans-serif
Polices Web
Allerta Allerta
Allerta Stencil Allerta Stencil
Arimo Arimo
Arvo Arvo
Bentham Bentham
Calibri Calibri
Calligraffitti Calligraffitti
Cambria Cambria
Cantarell Cantarell
Cardo Cardo
Cherry Cream Soda Cherry Cream Soda
Chewy Chewy
Coming Soon Coming Soon
Consolas Consolas
Copse Copse
Corsiva Corsiva
Cousine Cousine
Covered By Your Grace Covered By Your Grace
Crafty Girls Crafty Girls
Crimson Text Crimson Text
Crushed Crushed
Cuprum Cuprum
Dancing Script Dancing Script
Droid Sans Droid Sans
Droid Sans Mono Droid Sans Mono
Droid Serif Droid Serif
EB Garamond EB Garamond
Fontdiner Swanky Fontdiner Swanky
GFS Didot GFS Didot
GFS Neohellenic GFS Neohellenic
Geo Geo
Gruppo Gruppo
Hanuman Hanuman
Homemade Apple Homemade Apple
IM Fell DW Pica IM Fell DW Pica
IM Fell DW Pica SC IM Fell DW Pica SC
IM Fell Double Pica IM Fell Double Pica
IM Fell Double Pica SC IM Fell Double Pica SC
IM Fell English IM Fell English
IM Fell English SC IM Fell English SC
IM Fell French Canon IM Fell French Canon
IM Fell French Canon SC IM Fell French Canon SC
IM Fell Great Primer IM Fell Great Primer
IM Fell Great Primer SC IM Fell Great Primer SC
Inconsolata Inconsolata
Indie Flower Indie Flower
Josefin Sans Josefin Sans
Josefin Slab Josefin Slab
Just Another Hand Just Another Hand
Kenia Kenia
Kranky Kranky
Lato Lato
Lobster Lobster
Lora Lora
Luckiest Guy Luckiest Guy
Merriweather Merriweather
Molengo Molengo
Montserrat Montserrat
Mountains of Christmas Mountains of Christmas
Neucha Neucha
Neuton Neuton
Nobile Nobile
Old Standard TT Old Standard TT
Open Sans Open Sans
Oswald Oswald
PT Sans PT Sans
PT Sans Caption PT Sans Caption
PT Sans Narrow PT Sans Narrow
Pacifico Pacifico
Paytone One Paytone One
Permanent Marker Permanent Marker
Philosopher Philosopher
Play Play
Puritan Puritan
Reenie Beanie Reenie Beanie
Roboto Roboto
Rock Salt Rock Salt
Schoolbell Schoolbell
Slackey Slackey
Sorts Mill Goudy Sorts Mill Goudy
Sue Ellen Francisco Sue Ellen Francisco
Sunshiney Sunshiney
Syncopate Syncopate
Tinos Tinos
Ubuntu Ubuntu
UnifrakturMaguntia UnifrakturMaguntia
Unkempt Unkempt
Vollkorn Vollkorn
Walter Turncoat Walter Turncoat
Yanone Kaffeesatz Yanone Kaffeesatz
Dernière modification :
Assistance publique pour le produit Blogger sur les Forums d'aides :

Certifiée par Google - Experte TC :
  • Affectation Google France, produit Blogger, du 11/07/2011 au 28/07/2014.
  • Affectation Google US, produit Blogger depuis le 28/07/2014.

Posts les plus consultés de ce blog

DéveloppementsMulti-versions
Facebook : Bouton J'aime [Like button]
Populaire
ThéorieRéférences XMLParamètres des données
Le paramètre Image redimensionnable [isResizable]
Populaire
ThéorieRéférences XMLTypes des variables d'habillage
Variables d'habillage - Les arrière-plans [background]
Populaire