Thème graphique de Moodle v2

La page est créée Julien Martinez
 
CONTINUER À LIRE
UTC

Thème graphique de
Moodle v2
Comment fonctionne le système de thème graphique dans Moodle v2

Dominique Chambelant
03/03/2011
Themes Moodle v2.0.x
Introduction

Les thèmes sont en grande partie responsables du "look" d'un site Moodle. Ils fournissent les CSS pour les
couleurs, mises en page, les polices et ainsi de suite, et peut également modifier le code XHTML structurel.
Un thème peut contenir soit toutes les définitions (complètement autonome) ou hérité d’un thème existant
avec un ou plusieurs personnalisations.
La plupart des développeurs de thème utilisent la deuxième méthode. Il suffit d'ajouter quelques nouvelles
définitions CSS ou le layout de leur nouveau thème. Si une définition ou d'un élément n'est pas trouvé dans
le nouveau thème, il se tourne vers le «parent» (ou plus haut dans la hiérarchie des thèmes) pour en
trouver un. C’est un moyen facile d'obtenir n'importe quel look pour un thème.

Quoi de neuf dans la version 2.0

Le système de thème a été entièrement réécrit pour Moodle 2.0. Les problèmes connus ont été traités et de
nouvelles fonctionnalités ont été ajoutées pour répondre aux demandes de la communauté.
Malheureusement, il n'a pas été possible de maintenir la compatibilité ascendante. Tous les thèmes Moodle
1.x besoin d'être recréée pour Moodle 2.0.

Les principaux changements comprennent:

   Classes CSS et ID plus clair et cohérent.
   Introduction des fichiers de mise en page (templates) décrivant la disposition générale du HTML pour
    de nombreux types de pages dans Moodle.
   Introduction des renderers, qui produisent des morceaux d'une page HTML. Les thèmes avancés
    peuvent choisir de remplacer ces renderers.
   Introduction de méthodes normalisées pour ajouter du JavaScript.
   Un contrôle plus facile sur les icones et des images de Moodle.
   Le vieux "standard" thème a été divisé en deux thèmes:
       base - base contient un layout (mise en page) basique, et
       standard - ajoute le CSS au thème de base pour la faire ressembler au ‘vieux’ thème.
   Optimisation des performances: En mode de production normal, les fichiers CSS sont combinés en un
    seul fichier optimisé, et les deux fichiers CSS et JavaScript sont réduits au minimum pour s'assurer qu'il
    n'y a pas de gaspillage de connexions ou de la bande passante. Les fichiers sont fortement mis en
    cache, mais aussi version, ainsi les utilisateurs n'ont jamais besoin d'effacer leurs caches.
Structure d’un thème Moodle

Important à savoir pour construire un bon thème moodle :

config.php – Requis pour chaque thème, il définit la configuration du thème.

layouts – Dans config.php, les types de page sont définis (voir annexe A : Theme layouts pour un aperçu des 12 types
de page). Chaque définition indique a Moodle quel layout utiliser, quel bloc région doit être affiché, etc. Le fichier
layout contient du HTML et un minimum de PHP requis pour afficher la structure de la page.

Le thème « Base » - Il n’est pas prévu pour être utilisé tel quel. Il contient un layout le plus simple et générique
possible et le CSS ne défini que l’essentiel. C’est une base pour celui qui souhaite développer un thème.

Fichiers et répertoires

Répertoire     Fichier           Description
               /config.php       Contient toutes les configurations et les définitions pour chaque thème
               /lib.php          Contient les classes et les fonctions qui sont utilisées par le thème
               /renderers.php    Contient tous les moteurs de rendu personnalisé pour le thème.
                                 Contient les paramètres personnalisés du thème. Ces paramètres locaux permettent à l'utilisateur
               /settings.php
                                 de modifier facilement le thème. (Par exemple une couleur de fond ou une image d'en-tête)
/javascript/                     Tous les fichiers JavaScript du thème doivent être placés ici.
/lang/                           Tous les fichiers de langue du thème doivent être placés ici.
/layout/                         Contient les fichiers de mise en page pour le thème.
                                 Contient toutes les images que le thème utilise soit dans les règles CSS ou dans les fichiers de
/pix/
                                 configuration.
/pix           /favicon.ico      Le favicon à afficher pour ce thème.
/pix           /screenshot.jpg   Une capture d'écran du thème qui sera affiché dans l'écran de sélection thématique.
/style                           Emplacement par défaut pour les fichiers CSS.
               /*.css            les fichiers CSS du thème.
A noter, les fichiers CSS peuvent provenir de plusieurs autres sources.
Les options du thème

Toutes les options du thème sont définies dans le fichier config.php. Les options les plus couramment utilisées sont :
parents, sheets, layouts, et javascripts. Voir l’annexe A pour une liste complète des options de thème.

Exemple basique de configuration de thème

$THEME->name = 'newtheme';
$THEME->parents = array(
     'base'
);
$THEME->sheets = array(
     'admin',
     'blocks',
     'calendar',
     'course',
     'grade',
     'message',
     'question',
     'user'
);
$THEME->layouts = array(
     'base' => array(
          'theme' => 'newtheme',
          'file' => 'general.php',
          'regions' => array(),
     ),
     'standard' => array(
          'theme' => 'newtheme',
          'file' => 'general.php',
          'regions' => array('side-pre', 'side-post'),
          'defaultregion' => 'side-post',
     )
     //.......
);
$THEME->javascripts_footer = array(
     'navigation'
);
Les options de base expliquées
En premier, vous remarquerez que tout est ajouté à ‘$THEME’. Il s'agit de l'objet de configuration du thème, il est
créé avec les paramètres par défaut et est ensuite mis à jour avec les paramètres de config.php.
Le premier paramètre, ‘$THEME->name’ est le nom du thème. Cela devrait tout simplement être le nom que votre
thème est, très probablement le nom de votre répertoire de thème.
‘$THEME->parents’ définit les thèmes dont le thème hérite. Dans ce cas, il hérite du thème ‘base’.
Après c'est le tableau ‘$THEME->sheets’, il contient les noms des feuilles de style CSS à inclure pour ce thème. Notez
que seul le nom de la feuille de style est indiqué et ne contient pas le répertoire ou l'extension de fichier. Moodle
suppose que les feuilles de style du thème seront situées dans le répertoire des styles du thème et ont ‘.css’ comme
une extension.
Ensuite le tableau ‘$THEME->layouts’, deux layout (mise en page) ont été définies pour remplacer les layouts du
thème de base.
L’option finale inclus un fichier JavaScript dans ‘$THEME->javascripts_footer’. Tout comme les feuilles de style, il
vous suffit de fournir le nom des fichiers. Moodle suppose qu’ils sont dans votre répertoire javascript et l’extension
est ‘.js’.
Note : Lorsque vous commencez à écrire des thèmes, jeter un oeil aux fichiers de configuration des autres thèmes
fourni avec Moodle. Vous aurez une bonne idée de comment tout cela fonctionne, et ce qui se passe dans un thème,
simplement en le lisant et en prenant en compte ce qui est inclus ou exclus.

CSS

Localisation des feuilles de styles

Les feuilles de styles se trouvent dans le répertoire : \theme\{nom du thème}\styles\*.css.
Les nouveaux développeurs de thèmes devraient noter que l'ordre dans lequel les fichiers CSS se trouvent inclus crée
une hiérarchie. Cet ordre veille à ce que les règles, dans les feuilles de style d'un thème, priment sur les règles
identiques dans d'autres thèmes qui peuvent avoir été introduite avant. Cela permet à la fois d'étendre un autre
thème (voir le tableau ‘parents’ dans le fichier config.php) et assure également que les règles CSS du thème en cours
ont le dernier mot.

D’autres feuilles de style peuvent être localisées ailleurs dans l’arborescence Moodle. \block\{nom du
block}\styles.css ou \mod\{nom du module}\styles.css sont couramment utilisés pour définir un style spécifique à un
plugin.

Un plugin peut disposer d’une feuille de style spécifique pour un thème. La feuille de style sera localisée dans le
répertoire \{nom du plugin}\styles_{nom du thème}.css. Ceci ne devrait être utilisé que par les développeurs de
plugin. Il leur permet d’écrire du CSS pour un thème spécifique sans modifier ce thème.

En tant que développeur de thème Moodle, vous localiserez vos feuilles de style dans le répertoire \theme\{nom du
thème}\styles\*.css
L’organisation du CSS de Moodle

Nous allons voir l’organisation du CSS dans un thème. En tant que développeur de thème, c’est à vous de créer et
d’organiser votre CSS. A l’intérieur des thèmes fourni en standard par Moodle, il y a une organisation claire du CSS.

Le fichier pagelayout.css, il contient les règles CSS qui donne au layout leur apparence. Il ne contient aucune règle
qui affecte le contenu généré par Moodle.

Le fichier core.css contient les règles générales qui s’appliquent à Moodle dans son ensemble. Il peut contenir des
règles spécifiques à une section. Cependant, c’est fait seulement quand il y a peu de règles pour cette section. Ces
petits groupes de règles sont regroupés et séparés par des commentaires identifiant à quelle section elles se
rapportent.

Finalement, il y a tous les autres fichiers CSS. Il y a un fichier pour chaque section de Moodle qui nécessite un
nombre significatif de règle CSS.

Pour ceux qui sont familiers avec les thèmes Moodle 1.9, cette organisation sera un grand changement. En 1.9, le
CSS a été organisé par nature (par exemple: couleurs, mise en page, etc).

Comment écrire des règles CSS efficaces dans Moodle

Dans Moodle 2, écrire correctement les règles CSS est incroyablement important.

Du aux besoins de performance et aux limitations des navigateurs, tous les fichiers CSS sont combinés en un seul
gros fichier. De ce fait les règles CSS doivent être écrire de manière à éviter les collisions de règles qui pourrait
donner des résultats inattendus. Cependant l'écriture de bon CSS est difficile pour la plupart des designers car nous
avons mis en œuvre plusieurs nouvelles classes et nous demandons aux développeurs de les utiliser au maximum.

La balise BODY

Dans Moodle 2, l’ID de la balise BODY sera toujours une représentation de l’URI. Par exemple dans le cas du forum,
l’URI est ‘/mod/forum/view.php’, l’id de la balise BODY sera ‘#page-mod-forum-view’.

Aussi bien que l'ID de la balise BODY attribue l'URI est aussi éclaté pour former plusieurs classes de CSS qui sont
ajoutées à la balise BODY. Dans l’exemple '/mod/forum/view ', les classes suivantes seront ajoutées à la balise
BODY : '.path-mod ', '.path-mod-forum '. Notez que '.path-mod-forum-view ' n'est pas ajouté comme une classe,
c'est intentionnellement laissé, pour diminuer la confusion et la duplication car les règles peuvent se rapporter
directement de la page en utilisant l'ID et ne pas exiger la classe finale.

La balise BODY, son ID, ses classes CSS vont être la base des nombreuses classes CSS que vous aller écrire pour votre
thème. Toutefois il existe d’autres classes qui peuvent être ajoutées à la balise BODY. Voici quelques unes des plus
intéressantes listées ci-dessous :

        Si Javascript est activé, alors ‘jsenabled’ est ajouté comme une classe à la balise BODY. Cela permet de
        définir un style fonction si Javascript est activé ou pas.
        ‘dir-rtl’ ou ‘dir-ltr’ sera ajouté en fonction de la direction défini dans le pack de langue ; ‘rtl’ : de droite à
        gauche, ‘ltr’ : de gauche à droite.
        Une classe représentant le pack de langue en cours d’utilisation est inclus, par défaut ‘en_utf8’ est utilisé par
        Moodle. Il en résulte que la class ‘lang-en_utf8’ est inclus dans la balise BDY
        Si l’internaute n’est pas connecté, la classe ‘.notloggedin’ est ajouté à la balise BODY.
Qu'est-ce que tout cela ressemble dans la pratique? Eh bien en utilisant l'exemple ci-dessus
/mod/forum/view.php vous obtenir au moins la balise body suivantes:

Ecrire vos règles CSS.

Quand vous écrivez vos règles CSS, soyez sur de où ces règles vont être appliqué. C’est une bonne idée d’utiliser un
maximum les classes mentionnées plus tôt.

Si vous voulez écrire une règle spécifique pour une page en utilisant la balise BODY :

#page-mod-forum-view .forumpost {border:1px solid orange;)

Si vous voulez une règle qui s’applique a l’ensemble du forum :

.path-mod-forum .forumpost {border:1px solid orange;}

L'autre chose très importante à prendre en considération est la structure menant jusqu'à la balise sur laquelle vous
voulez appliquer un style. Les navigateurs appliquent des styles contradictoires avec la priorité sur les sélecteurs plus
spécifiques. Il peut être très avantageux de le garder à l'esprit et écrire les sélecteurs complets qui prennent en
comptent la structure menant à la balise cible.

En vous servant de l'id du BODY des classes et en écrivant des sélecteurs prenant en compte la structure principale,
vous pouvez énormément réduire au minimum la chance d'une collision CSS avec Moodle, maintenant ou dans
l'avenir.

Layouts

Tous les thèmes exigent des layouts pour définir leur mise en page; toutefois, beaucoup de fichiers de layout sont
exigés par ces mises en page. Si le thème hérite d’un autre thème, alors c'est un cas de décision : quels layouts ce
nouveau thème devra ignorer. Si le thème est complètement nouveau au départ alors vous devrez définir une mise
en page de la page HTML pour chacune des possibilités différentes. Pour les deux situations, ces layouts devraient
être définies dans config.php.

Il est aussi important de noter qu'un nouveau thème qui se basera sur un autre thème (héritage) ne doit pas définir
n'importe quelle mise en page ou utiliser n'importe quels fichiers layout, s’il n'y a aucun changement dans la mise en
page du thème existant. Le thème standard dans Moodle est un bon exemple, comme il hérite du thème de base, il
ajoute simplement des règles CSS pour réaliser son look and feel.
Ainsi les layouts sont définies dans config.php dans $theme-> layouts. Ci-dessous, un exemple configuration de
layouts :

$THEME->layouts = array(
     // Standard layout with blocks, this is recommended for most pages with general
information
     'standard' => array(
           'theme' => 'base',
           'file' => 'general.php',
           'regions' => array('side-pre', 'side-post'),
           'defaultregion' => 'side-post'
     )
)

theme : Le nom du thème qui possède le fichier layout. Vous pouvez utilisez le layout d’un autre thème. Optionnel.

file : Le nom du fichier layout. Requis

regions : Les différents blocs régions utilisés dans le thème. Requis.

Defaultregion : La localisation par défaut pour l’ajout de blocs. Requis si ‘regions’ est rempli, sinon optionnel.

options : Un tableau spécifiant les options du layout. Optionnel.

Le Theme est optionnel. Normalement le fichier de layout est dans le thème courant, ou dans le thème parent.
Toutefois, vous pouvez utiliser le layout d’un autre thème en spécifiant son nom ici.

Vous pouvez définir les régions que vous souhaiter. Vous devez juste choisir un nom pour chacune. La plupart des
thèmes utilisent juste une ou les deux régions side_pre et side_post, qui ressemble à ' le côté gauche ' et ' le côté
juste ', sauf si la direction de lecture des langues est inversée. Si vous dites dans config.php que votre layout fournit
des régions appelées 'Fred' et 'Barney', donc vous devez appeler $output-> blocks_for_region ('Fred') et $output->
blocks_for_region ('Barney') quelque part dans le fichier de layout.

Le paramètre ’options’ est un cas spécial. Il permet au designer de thème de spécifier des options spéciales qu’il
pourra utiliser dans le code PHP du layout.

Si vous regarder la configuration du thème de base (theme/base/config.php), vous remarquerez que plusieurs
layouts spécifient les options ‘nonavbar’ et ‘nofooter’ qui peut les deux être mis à vrai ou faux. En regardant de plus
près le code du layout (theme/base/layout/general.php), vous découvrirez des lignes ressemblant à ceci :
............

Ci-dessus, un exemple de l’utilisation des options dans le code PHP du layout. Dans ce cas, il est utilisé pour contrôler
l'affichage du pied de page de page et la barre de navigation.

Fichiers Layouts

Un fichier de layout contient la structure HTML, incluant le header, le footer, le contenu et les blocs régions. Bien
sur, il ne contient pas tout le HTML, mais seulement des morceaux de HTML et de contenu que Moodle utilise pour
la mise en page. Dans chaque layout, il y a de simple appel de fonction PHP pour inclure le contenu.

Ci-dessous un exemple de fichier layout illustrant les différents morceaux qui le compose :

>
Expliquons quelques appels PHP :

Il survient au TOUT DEBUT de la page. Il ajoute la définition du type de document xhtml. C’est bien sur déterminé
par les réglages du site. Le designer du thème n’a aucun contrôle là-dessus.

>

Ici nous avons commencé à écrire l'étiquette de HTML s'ouvrant et avoir demandé à Moodle de nous donner les
attributs de HTML qui devraient y être appliqués

Affiche le titre de la page.

Cet appel très important, nous obtenons le code HTML standard qui doit être dans la balise  de la page. C'est
là où le CSS et le JavaScript pour le haut de la page seront placés aussi bien que n'importe quel script ou balise de
style.
Création de l’id et des classes de la balise BODY.

Nous voilà créant l'en-tête pour la page. Dans ce cas, nous voulons afficher les informations de connexion de
l’utilisateur actuel ou un lien pour se connecter s'ils ne sont pas connectés et nous voulons le menu de titre s'il y en a
un.

Ici, l’appel génère le HTML pour afficher les blocs. Dans ce cas, nous avons demandé tous les blocs qui ont été
ajoutés au secteur ‘side-pre’.

C'est un des appels les plus importants dans le fichier, il détermine où le contenu central de la page est inséré.

Ici, l’appel génère le HTML pour afficher les blocs. Dans ce cas, nous avons demandé tous les blocs qui ont été
ajoutés au secteur ‘side-post’.

Ce morceau de code obtient le contenu pour le pied de page de la page. Cela obtient les informations de connexion
qui sont les mêmes dans l'en-tête, un lien vers la page d’acceuil et le pied de page standard qui comme la balise
HEAD contient tout le Javascript et le CSS habituellement placé en pied de page.

Note : Avec Moodle 2, le Javascript est largement inclus dans le pied de page. Ce qui améliore le temps de
chargement de la page.

Quand vous écrivez des fichiers layout, penser aux différentes mise en page et comment le HTML dont chacun se
sert différera. Vous constaterez très probablement que vous n'avez pas besoin d'un fichier layout différent pour
chaque mise en page, très probablement vous pourrez réutiliser les fichiers layout que vous avez crée à travers
plusieurs mises en page. Vous pouvez bien sûr vous servir d'options de layout pour réduire encore le nombre de
fichier layout que vous devez produire.

Si vous customisez un thème existant vous n’êtes pas obligé de créer des fichiers layouts.

‘$OUTPUT’ est une instance de la classe ‘core_renderer’ définie dans lib/outputrenderers.php. Chaque méthode y
est clairement documentée.
‘$PAGE’ est une instance de la classe ‘moodle_page’ définie dans lib/pagelib.php. La plupart des choses que vous
voudrez utiliser sont les propriétés qui sont toutes documentées au début du fichier.

Faire usage des images

Une des caractéristiques du nouveau système de thèmes, est la capacité d'ignorer n'importe quelle image standard
depuis l'intérieur de votre thème. Nous regarderons comment vous servir de vos propres images dans votre thème.
Et deuxièmement comment ignorer les images utilisées par Moodle.

Parlons des images dans Moodle :

        1.   Les images que vous voulez utiliser dans votre thème sont localisées dans le répertoire ‘pix’
        2.   Vous pouvez utiliser des sous-répertoires dans le répertoire ‘pix’
        3.   Les images utilisées par le cœur de Moodle sont dans le répertoire ‘pix’ de Moodle.
        4.   Les modules, les blocks et les autres plugins doivent stocker leurs images dans un répertoire ‘pix’.

Nous supposons que vous avez ajouté deux images dans le répertoire ‘pix’ de votre thème.

        /theme/{nom du thème}/pix/imageone.jpg
        /theme/{nom du thème}/pix/subdir/imagetwo.png

Noter que la première image est au format JPG et la seconde au format PNG. La seconde image est dans un sous-
répertoire de ‘pix’.

Le petit bout de code suivant illustre comment se servir de vos images dans le HTML, comme si vous avez voulu les
utiliser dans un fichier layout.
De l'intérieur d'un thème vous pouvez TRÈS facilement ignorer n'importe quelle image standard dans Moodle en
ajoutant simplement l'image de remplacement au répertoire ‘pix’ du thème dans la même structure de sous-
répertoire. Si par exemple nous avons voulu ignorer les deux images suivantes :

        1. /pix/moodlelogo.gif
        2. /pix/i/user.gif

Vous ajoutez simplement vos images dans votre thème, aux emplacements suivant :

        1. /theme/{nom du thème}/pix/moodlelogo.gif
        2. /theme/{nom du thème}/pix/i/user.gif

Aussi simple que cela !

Maintenant l'autre chose à mentionner est que Moodle cherche non simplement les remplacements du même type
d'image (jpg, Gif, etc ...) mais aussi des remplacements dans n'importe quel format d'image. C'est pourquoi ci-dessus
en travaillant avec nos images nous n'avons jamais spécifié l'extension de fichier d'images. Cela signifie que la chose
suivante marcherait aussi :

        1. /theme/{nom du thème}/pix/moodlelogo.png
        2. /theme/{nom du thème}/pix/i/user.bmp

Choses non évidentes

Faire apparaitre correctement votre thème dans le sélecteur de thème.

Si vous suivez les exemples à cette page à la lettre, et que vous allez à la page du Sélecteur de Thème vous constatez
que votre thème n'apparaît pas comme le font les autres thèmes. En fait, au lieu du nom de votre thème, vous
verrez quelque chose comme [[pluginname]].

Pour corriger cela, vous devez créer le fichier /lang/fr/theme_{nom du thème}.php. À l'intérieur de ce fichier, ajoutez
"$string ['pluginname'] = '{nom du thème}';".

La copie d'écran pour le thème devrait être de 500x400 px.
Annexe A

Tableau des options de thème (le 28 avril 2010)

Options                             Effet
$THEME->csspostprocess              Permet à l'utilisateur de fournir le nom d'une fonction pour traiter le CSS
$THEME->editor_sheets               Un tableau des feuilles de style à inclure dans le corps de l'éditeur.
$THEME->enable_dock                 Si la valeur vrai, le side dock est activée pour les blocs
                                    Permet de masquer un thème dans le sélecteur de thème (à moins que le mode
$THEME->hidefromselector            concepteur de thème ne soit activé).
                                    Accepte vrai ou faux.
$THEME-
                                    Utilisé pour contrôler les couleurs utilisées dans le lecteur média.
>filter_mediaplugin_colors
                                    Un tableau contenant les noms de fichiers JavaScript se trouvant dans / javascript / à
$THEME->javascripts
                                    inclure dans le thème. (Sera inclus dans le HEAD)
$THEME->javascripts_footer          Comme ci-dessus, mais seront inclus dans le pied de page.
$THEME->larrow                      Remplace l’image de la flèche vers la gauche utilisée dans Moodle
$THEME->layouts                     Un tableau fixant les layout pour le thème
                                    Nom du thème. Très probablement, le nom du répertoire dans lequel se trouvent les
$THEME->name
                                    fichiers.
$THEME->parents                     Un tableau de thèmes a hérité.
$THEME-
                                    Un tableau de fichiers JavaScript à ne pas hériter des thèmes parents.
>parents_exclude_javascripts
$THEME->parents_exclude_sheets      Un tableau des feuilles de style à ne pas hériter des thèmes parents
$THEME->plugins_exclude_sheets      Un tableau de plugin à ignorer et ne pas inclure.
$THEME->rarrow                      Remplace l’image de la flèche vers la droite utilisée dans Moodle
                                    Définit une usine de rendu personnalisé à utiliser avec le thème, utilisé lorsque vous
$THEME->renderfactory
                                    travaillez avec les moteurs de rendu personnalisé.
$THEME-
                                    Contrôle des couleurs pour le lecteur MP3
>resource_mp3player_colors
                                    Un tableau des feuilles de style à inclure pour ce thème. Il doit être situé dans le
$THEME->sheets
                                    répertoire de style du thème.
Tableau des différents layouts (le 17 aout 2010)

Disposition      But
base             layout sans les blocs - c'est la mise en page utilisé par défaut.
standard         layout standard avec des blocs, ce qui est recommandé pour la plupart des pages d'informations générales.
course           page principale des cours.
coursecategory   Utilisez pour naviguer à travers les catégories de cours.
incourse         mise en page par défaut lors de la navigation d'un cours, typique pour les modules.
frontpage        La page d'accueil du site.
admin            pages d'administration et de scripts.
mydashboard      Ma page de tableau de bord.
mypublic         Ma page publique.
login            La page de connexion.
popup            Pages qui apparaissent dans des fenêtres pop-up - pas de navigation, pas de blocs, aucun en-tête.
frametop         Utilisé pour les mises cadre seul héritage. N blocs et pied de page minimal.
embedded         Embarqués pages, comme iframe / objet incorporé dans moodleform - il a besoin d'espace autant que possible
                 Utilisé pendant la mise à niveau et à installation. Il ne doit y avoir aucun bloc, et c'est une bonne idée si elle n'a
maintenance      pas de liens vers d'autres lieux - par exemple, il ne devrait pas être un lien vers la page d’accueil dans le pied de
                 page.
print            Utilisé lorsque la page est affichée spécifiquement pour l'impression.

Annexe B

Pour aller plus loin (document en anglais) :

Surcharger un renderers : Un tutoriel sur la création d'un moteur de rendu personnalisé permettant de
changer le code HTML produit par Moodle.
http://docs.moodle.org/en/Development:Themes_2.0_overriding_a_renderer

Comment utiliser les images dans votre thème : Explique comment utiliser et remplacer des images dans votre
thème. http://docs.moodle.org/en/Development:Themes_2.0_How_to_use_images_within_your_theme

Ajouter une page de configuration : Comment ajouter une page de configuration pour facilement
personnaliser votre thème. http://docs.moodle.org/en/Development:Themes_2.0_adding_a_settings_page

Personnaliser le menu : Comment personnaliser le menu Moodle.
http://docs.moodle.org/en/Development:Themes_2.0_extending_the_custom_menu

Le style et la personnalisation du dock : Comment décorer et personnaliser le dock de Moodle.
http://docs.moodle.org/en/Development:Styling_and_customising_the_dock

Utilisation de jQuery avec Moodle. http://docs.moodle.org/en/Development:Using_jQuery_with_Moodle_2.0
Vous pouvez aussi lire