1. Livres et vidéos
  2. Joomla! - Conception et personnalisation des templates (2e édition)

Joomla! Conception et personnalisation des templates (2e édition)

  • Accès illimité 24h/24, 7J/7
  • Tous les livres en ligne, les vidéos et les cours enregistrés ENI
  • Plus de 10 nouveautés livres et vidéos chaque mois
  • Les nouveautés disponibles le jour de leur sortie
  • Accès 100% en ligne
  • En stock
  • Expédié en 24h00
  • Livraison à partir de 0,01 €
  • Version en ligne offerte
  • 1 h d'accès gratuit à tous nos livres et vidéos pour chaque commande
  • Accessible immédiatement
  • Version HTML
  • Accès illimité 24h/24, 7J/7

Présentation

Joomla! est l'un des CMS les plus utilisés actuellement. Sa base solide lui permet de s'adapter à tout type de projet : site institutionnel, site e-commerce, portail d'entreprise... Le design, l'ergonomie, la navigation et l'apparence de tous les contenus du site sont déterminés par les templates.

Ce livre s'adresse à toute personne connaissant déjà Joomla! et souhaitant débuter dans la création de nouveaux templates ou dans la personnalisation de templates existants. Les templates créés sont valables pour les versions 3.0 et supérieures de Joomla!.

La connaissance de l'HTML et des CSS est recommandée ; nous étudierons les notions simples de PHP requises lors de la mise en pratique des templates.

Nous commencerons par étudier la structure des templates de Joomla!. Nous créerons alors un premier template simple pour mettre en pratique ces premières notions.

Dans un deuxième temps nous vous proposons de créer un template complet proposant à l'utilisateur plusieurs possibilités pour placer des modules dans des emplacements variés.

Le troisième template que nous allons créer nécessitera d'utiliser les options et les styles ; ces fonctions permettent aux utilisateurs de personnaliser le template dans l'administration du site, sans avoir à modifier le code source.

Nous terminerons en analysant dans le détail Protostart, le template proposé par défaut dans Joomla!. Vous pourrez ainsi vous en inspirer pour créer vos propres templates.

Table des matières

  • Chapitre 1 : La gestion des templates
    • A. L’objectif
    • B. Exploiter les templates
    • C. Le template par défaut
    • D. Gérer les templates
      • 1. Installer un template
      • 2. Lister les templates et les styles
      • 3. Filtrer les templates et les styles
      • 4. Désactiver un template
      • 5. Désinstaller un template
      • 6. Gérer les styles
    • E. L’aperçu des templates
      • 1. Activer l’aperçu
      • 2. Aperçu des autres templates
    • F. Les paramètres des templates
      • 1. Les fichiers constitutifs
      • 2. Les options de style des templates
      • 3. L’affectation des menus
  • Chapitre 2 : La structure des templates
    • A. L’objectif
    • B. Le dossier du template
      • 1. Les templates pour Joomla!
      • 2. Les fichiers d’un template
    • C. Le fichier de description
      • 1. L’objectif
      • 2. L’en-tête
      • 3. Le concepteur
      • 4. Les fichiers d’installation
      • 5. La liste des positions
      • 6. Les langues disponibles
      • 7. Les options du template
    • D. Les inclusions JDOC
      • 1. L’objectif
      • 2. L’en-tête
      • 3. Les composants
      • 4. Les messages
      • 5. Le débogage
      • 6. Le chargement des modules
      • 7. L’affichage des modules
    • E. La position des modules
    • F. Les classes CSS de Joomla!
      • 1. Les classes par défaut
      • 2. Connaître les classes par défaut
  • Chapitre 3 : Un template simple
    • A. L’objectif
    • B. La structure du template
      • 1. Le dossier
      • 2. Le fichier index.html
      • 3. Les styles CSS
      • 4. Les images
      • 5. Le fichier de description
      • 6. Le fichier maître
      • 7. Les vignettes
      • 8. Le dossier du template
    • C. Le fichier de description
      • 1. L’objectif
      • 2. L’en-tête
      • 3. La déclaration d’extension
      • 4. Les informations du template et du concepteur
      • 5. Les fichiers du template
      • 6. Les positions
      • 7. Les autres paramètres
      • 8. Le code complet
    • D. Les conteneurs
    • E. Le début du fichier index.php
      • 1. L’objectif
      • 2. Restreindre l’accès direct
      • 3. Les déclarations HTML
      • 4. L’élément <head>
      • 5. Les métadonnées
      • 6. Les feuilles de style par défaut
      • 7. Notre feuille de style
      • 8. La fin de l’en-tête
      • 9. Le code complet
    • F. Le corps du fichier index.php
      • 1. Le corps de la page
      • 2. Les conteneurs
    • G. La mise en forme CSS
    • H. Le conteneur principal
    • I. L’en-tête de la page
      • 1. Les boîtes d’affichage
      • 2. L’image de fond de l’en-tête
      • 3. Le logo
      • 4. Le module de recherche
    • J. La barre des menus
      • 1. La mise en forme
      • 2. Insérer la barre des menus
    • K. La zone centrale
      • 1. Les boîtes d’affichage
      • 2. Les conditions d’affichage
      • 3. La mise en page
      • 4. Les règles CSS
    • L. Le pied de page
    • M. Le code complet
      • 1. Pour le fichier index.php
      • 2. Pour le fichier template.css
    • N. L’affichage du site
      • 1. Le template
      • 2. Les modules
      • 3. L’affichage
  • Chapitre 4 : Un template complet
    • A. L’objectif
    • B. La structure du template
      • 1. Le dossier
      • 2. Le fichier index.html
      • 3. Les styles CSS
      • 4. Les images
      • 5. Le fichier de description
      • 6. Le fichier maître
      • 7. Les vignettes
      • 8. Le dossier du template
    • C. Le fichier de description
      • 1. L’objectif
      • 2. L’en-tête
      • 3. La déclaration d’extension
      • 4. Les informations du template et du concepteur
      • 5. Les fichiers du template
      • 6. Les positions
      • 7. Le code complet
    • D. La structure du template complet
    • E. Le début du fichier index.php
      • 1. L’objectif
      • 2. Le code
    • F. Le corps du fichier index.php
    • G. Les conteneurs
      • 1. La mise en page
      • 2. Les styles CSS des tableaux
    • H. Le bandeau supérieur
      • 1. L’affichage
      • 2. Les styles CSS
      • 3. Le contenu
      • 4. Le code généré
    • I. La barre des menus
      • 1. L’affichage
      • 2. Les styles CSS
      • 3. Le code généré
    • J. Les zones des nouvelles
      • 1. L’affichage des nouvelles dans les positions
      • 2. Les styles CSS et l’affichage
      • 3. L’affichage conditionnel
      • 4. Les styles CSS pour les nouvelles
      • 5. L’affichage des nouvelles
      • 6. Les styles CSS des modules inclus
    • K. La zone centrale
      • 1. L’affichage dans les positions
      • 2. Les conditions d’affichage
      • 3. Adapter les largeurs des colonnes
      • 4. Les styles CSS pour les colonnes
      • 5. L’affichage
      • 6. Les styles CSS des modules inclus
    • L. Le fil d’Ariane
      • 1. L’affichage
      • 2. Les styles CSS
      • 3. Les styles du module
    • M. La zone des informations
      • 1. L’affichage dans les positions
      • 2. Les conditions d’affichage
      • 3. Les styles CSS pour les informations
      • 4. L’affichage
      • 5. Les styles des modules
    • N. Le pied de page
      • 1. L’affichage dans les positions
      • 2. Les conditions d’affichage
      • 3. Les styles CSS
      • 4. L’affichage
      • 5. Le code généré
    • O. Le code du template
      • 1. Le code complet du fichier index.php
      • 2. Le code complet du fichier template.css
    • P. Le site avec le template complet
      • 1. Installer le template complet
      • 2. Les modules du site Joomla!
      • 3. L’en-tête du site
      • 4. La zone centrale
      • 5. La zone des informations
      • 6. Le pied de page
      • 7. L’affichage du site
  • Chapitre 5 : Les options et styles des templates
    • A. L’objectif
    • B. Le fichier de description
    • C. Les options de template
      • 1. La description XML
      • 2. Les options disponibles
    • D. Un sélecteur de couleur
      • 1. La création de l’option
      • 2. L’affichage de l’option
      • 3. Modifier les styles CSS
      • 4. Utiliser l’option
    • E. Ajouter une image
      • 1. La création de l’option
      • 2. L’affichage de l’option
      • 3. Modifier le code
      • 4. Utiliser l’option
    • F. Un champ de saisie
      • 1. La création de l’option
      • 2. L’affichage de l’option
      • 3. Modifier le code
      • 4. Utiliser l’option
    • G. Insérer un choix unique
      • 1. La création de l’option
      • 2. L’affichage de l’option
      • 3. Modifier le code
      • 4. Utiliser l’option
    • H. Le code complet
      • 1. Le fichier templateDetails.xml
      • 2. Le fichier index.php
    • I. Les styles des templates
      • 1. L’objectif
      • 2. Renommer un style
      • 3. Créer un nouveau style
      • 4. Utiliser le nouveau style
    • J. Les substitutions
      • 1. Les objectifs
      • 2. Créer une substitution
      • 3. Modifier le fichier du module
  • Chapitre 6 : Le template Protostar
    • A. L’objectif
    • B. La structure du dossier
    • C. Le fichier templateDetails.xml
      • 1. L’en-tête
      • 2. La déclaration d’extension
      • 3. Les informations du template
      • 4. La liste des fichiers
      • 5. Les positions
      • 6. Les fichiers de traduction
      • 7. Les options du template
      • 8. L’option de couleur globale
      • 9. L’option de couleur d’arrière-plan
      • 10. L’option de sélecteur de fichier
      • 11. L’option pour le titre du site
      • 12. L’option de description du site
      • 13. L’option des polices Google
      • 14. L’option du choix de la police
      • 15. L’option de l’affichage fluide
    • D. Le fichier index.php
      • 1. Le commentaire initial
      • 2. Les paramètres du template
      • 3. L’édition des articles
      • 4. Le chargement des librairies
      • 5. La police Google
      • 6. La couleur globale
      • 7. Les fichiers optionnels
      • 8. L’ajustement de la largeur
      • 9. L’affichage du logo ou du titre
      • 10. La fin du PHP
      • 11. L’en-tête HTML
      • 12. La taille des écrans
      • 13. L’inclusion de l’en-tête
      • 14. Le corps de la page
      • 15. La structure des boîtes <div>
      • 16. Les structures principales
      • 17. L’élément de l’en-tête
      • 18. L’élément pour la navigation
      • 19. La zone centrale
      • 20. La boîte du pied de page
    • E. Les mises en page spécifiques
      • 1. La mise en page fluide
      • 2. La mise en forme de l’en-tête
      • 3. La mise en forme du pied de page
      • Index

Auteur

Christophe AUBRYEn savoir plus

Responsable pédagogique dans un centre de formation et formateur sur les technologies Web et les Arts graphiques pendant plus de quinze ans, Christophe AUBRY est aujourd'hui dirigeant de la société netPlume spécialisée dans la rédaction pédagogique et la création de sites internet. Auteur de nombreux livres et vidéos aux Editions ENI (HTML/CSS, RWD, WordPress, Drupal, Joomla…), il reste au fait des nouveautés concernant la conception des sites web en effectuant une veille technologique régulière.

Caractéristiques

  • Niveau Initié à Confirmé
  • Nombre de pages 220 pages
  • Parution décembre 2017
    • Livre (broché) - 17 x 21 cm
    • ISBN : 978-2-409-01128-3
    • EAN : 9782409011283
    • Ref. ENI : OW2TEMJOO
  • Niveau Initié à Confirmé
  • Parution décembre 2017
    • HTML
    • ISBN : 978-2-409-01134-4
    • EAN : 9782409011344
    • Ref. ENI : LNOW2TEMJOO

Téléchargements

En complétant ce formulaire, vous acceptez d'être contacté afin de recevoir des informations sur nos produits et services ainsi que nos communications marketing. Vous aurez la possibilité de vous désabonner de nos communications à tout moment. Pour plus d'informations sur notre politique de protection des données, cliquez ici.
  • Des fichiers complémentaires (220 Ko)