Template theme.tpl - Requirements

C'est le fichier principal qui structure le thème.
Il est à la base de tout.
Nous allons le voir en détail afin de bien visualiser les éléments qui le composent.

1. HTML

Le fichier theme.tpl est un un fichier HTML.
Cela signifie qu'il est préférable d'avoir quelques connaissances en HTML pour pouvoir intervenir plus facilement et mieux comprendre ce que l'on modifie.

2. Template

Le fichier theme.tpl est un fichier HTML particulier pour XOOPS, c'est un template.

3. CSS

C'est donc un template, un fichier pour le design du thème. il utilise beaucoup les feuilles de styles en cascades (CSS, pour Cascading Style Sheets).
Il est donc judicieux d'avoir quelques notions sur le langage CSS.

4. Bootstrap V4 (4.6)

De plus, ce thème utilise une librairie CSS très connue nommée Bootstrap, ici, la version 4.6.
Il n'est pas nécessaire de connaître parfaitement Bootstrap, la documentation est assez bien faite, il suffit de la suivre.

Nous travaillons actuellement sur le thème xSwatch5 mais il n'est pas encore disponible.

5. Smarty

Ce template utilise des smarty, c'est à dire des variables et des fonctions qui seront affichées et executées au moment de l'appel de la page.

Exemples de variables :
<{$xoops_sitename}>, <{$xoops_pagetitle}>, <{$xoops_uname}>

Exemples de fonctions :
<{include file="$theme_name/tpl/nav-menu.tpl"}>, <{if $xoops_isuser|default:false}>

La compréhension des smarty facilitera la personnalisation de vos pages.

Comprendre les smarty dans XOOPS
Ce tutoriel n'est pas encore disponible.

6. Modifications de templates

Par défaut, pour un site en production stable, les templates ne sont plus compilés et le système utilise des fichiers "cache" pour gagner en temps d'affichage.
En mode développement et modification du design, on doit changer ce mode.
Il suffit d'aller dans le [Panneau de configuration] puis [Préférences] puis [Préférences générales] et aller sur la ligne :

Contrôler les modifications de templates ?
Si cette option est activée, les Templates modifiés seront automatiquement recompilé quand ils seront affichés. Vous devez désactiver cette option sur un site en production.

Il faut mettre l'option à Oui.

6a. Cache des templates

Il est parfois nécessaire de supprimer le cache pour que les changements soient visibles.
Il faut le supprimer à 2 endroits :

• Cache de XOOPS :
  [Panneau de configuration] puis [Maintenance] puis [Nettoyage du dossier cache] puis sélection des 3 dossiers de cache (smarty_cache, smarty_compile et xoops_cache) et enfin bouton Soumettre.
  
  
• Cache du navigateur :
  Cela diffère selon le navigateur utilisé.

7. Javascript

Nous aborderons très partiellement un bout de code en Javascript dans ce tutoriel, mais rassurez-vous, il n'est pas du tout nécessaire de connaitre le Javascript pour suivre ce tutoriel.

---