• Accueil
  • Composant Fils d'actualité
  • débuter

Deprecated: The each() function is deprecated. This message will be suppressed on further calls in /home/ronchonp/j101/media/foundry/3.1/libraries/cssmin.php on line 2236

Démarche

Etoiles inactivesEtoiles inactivesEtoiles inactivesEtoiles inactivesEtoiles inactives

La section "Débuter" vous guide dans la visite puis la modification d'un site de test constitué à partir de l'installation standard de Joomla! que votre hébergeur mettra en place pour vous.

Elle ne donne aucune procédure détaillée. Mais tente de vous orienter dans la bonne direction. Quelques recherches judicieuses dans un moteur de recherches et/ou dans la documentation officielle du projet Joomla! Vous permettront de répondre à vos souhaits de détails. Vous trouverez aussi des informations plus précises dans la section suivante du site "Joomla!" ainsi que des liens vers la documentation officielle.

Pour aller plus loin, vous devrez étendre la configuration standard avec des fonctionnalités adaptées à votre projet : gestion de communauté, forum, galeries de photos ou catalogue. Ceci est l'objet de la section "extensions" de ce site.

Nous reviendrons plus en détail sur chaque étape, mais je vous propose la démarche suivante :

  • ouvrez un compte chez  LWS par exemple, ou siteground si vous êtes à l'aise en anglais. Choisissez un nom de domaine improbable pour vos tests, et l'hébergement le moins cher.
  • pour rester discret, laissez la page d'attente de l'hébergeur à la racine de votre domaine, créez un sous dossier et installez votre site de test dans ce sous domaine. vous y accéderez par uns adresse du genre
    www.mondomaine.fr/mondossier
  • Utilisez le panneau de contrôle de votre hébergeur, pour créer une installation standard Joomla. Il y'a un bouton pour ça : l'opération est automatique et gratuite.
  • Votre nouveau site contient des données d'exemple qui vont pouvoir vous servir de terrain d'expérimentation.

A partir de là, vous pourrez alterner les phases de recherche et de lecture et les phases d'expérimentation.

Le contenu installé avec Joomla! à titre d'exemple vous propose une brève introduction aux concepts et fonctions de référence afin de vous aider à comprendre comment fonctionne Joomla, et des liens utiles vers des ressources complémentaires. Ce contenu est reproduit sur ce site.

Je vous conseille, si vous êtes néophyte, de commencer par vous créer un profil d'administrateur sur votre nouveau site d'exemples, puis de passer un peu de temps à l'explorer. Vous pourrez ensuite vous familiariser avec les fonctions d'administration -backend- sur ce même contenu.

Lorsque vous n'aurez plus besoin de ces exemples, vous pourrez désactiver ces articles ou, dans l'administration du site, désactiver leur catégorie ou supprimer tous les articles puis toutes les catégories. Mais je vous conseille de commencer par créer vos propres articles-exemples avant de passer aux choses sérieuses en supprimant le contenu de démonstration.

Si votre budget vous le permet, conservez votre site de test, il vous sera utile tout au long de la vie de votre projet : comme source de références lorsque vous aurez oublié quelque chose et comme site d'expérimentation à chaque nouvelle étape, dés que vous aurez une version en production à protéger.

Imprimer

Commentaire (0) Clics: 4972

Bases

Vote utilisateur: 5 / 5

Etoiles activesEtoiles activesEtoiles activesEtoiles activesEtoiles actives

 

La création d'un site web avec Joomla est simple. Les quelques principes de base présentés ci-dessous, largement inspirés du contenu livré avec Joomla! en guise d'exemples, vous guideront dans la compréhension de ce logiciel.

  1. Gestion de contenu  :

    un SGC-systéme de gestion de contenus (SGC ou CMS de l'anglais Content Management System) est un logiciel qui vous permet de créer et gérer des pages Web, en séparant la création des contenus de la gestion technique nécessaire à une diffusion sur le web.

    Le contenu rédactionnel est stocké et restitué dynamiquement par une base de données, l'aspect (police, taille, couleur, emplacement, etc.) est géré par un template (habillage du site). Le logiciel Joomla permet d'unir ces deux structures, les pages étant générées dynamiquement au moment de la requête de consultation. L'exploitation se veut conviviale afin rendre accessibles au plus grand nombre d'utilisateurs l'administration et la création de sites web.

    L'organisation du contenu suit la logique d'un blog :

    • Les articles sont classés dans des catégories. A l'intérieur d' un article,  un lien "lire la suite" permet de définir "l'introduction" de l'article.
    • Des "liens de menu" permettent d'afficher soit un article précis, soit "le blog d'une catégorie" c'est à dire la liste des articles appartenant à la même catégorie. 
    • Lorsque l'affichage se fait en liste, seules les introductions des articles sont affichées.Les attributs des liens de menu permettent de définir la présentation de ces listes : en tête, une ou deux colonnes...
    • Deux images sont en principe associées à chaque article :
      • L'image d'introduction, en principe de dimensions réduites (thumbnail) est associée au texte d'introduction dans les listes.
      • L'image de l'article complet, en principe de la largeur de votre zone de contenu, habituellement de l'ordre de 700 pixels, est utilisée lorsqu'on consulte l'article en entier.
    • Un éditeur de contenu permet de créer et modifier le contenu des articles et de charger des images de votre PC vers votre site.

    La gestion des droits ACL - Authorisation control layer, permet de contrôler qui voit quoi et qui peut faire quoi. Pour ce faire Joomla! permet de définir des groupes d'utilisateurs et d'affecter à chaque groupe des droits.

    Ne touchez pas aux groupes et aux droits pré-définis avant d'être vraiment très familiarisé avec Joomla! Faites une sauvegarde avant, et réfléchissez bien

  2. Composants et extensions

    Organiquement, Joomla! est composé de :

    Templates
    , qui contrôlent la présentation du site
    Composants
    , qui constituent les programmes d'application. A chaque composant est associé une liste de types de lien de menu. Ceci permet de créer des liens de menu donnant accés aux fonctions du composant.
    Modules
    , associés à un composant, permettant de fabriquer du contenu et de le positionner dans une position définie par le template ou dans un article
    Plugin,
    programmes aussi associés à un composant et invoqués quand survient un événement prédéfini

    Joomla! est fourni avec un certain nombre de composants pré-installés, décrits dans la section "La livraison standard" de ce site.<b< Le mécanisme des extensions permet d'étendre ou d'améliorer ces fonctions standards. La section "créer son propre site" présente un  certain nombre d'extensions.

  3. Deux interfaces

    Un site Joomla est structuré en deux parties distinctes : la partie visible du site appelée «Frontal» de Front end en anglais et, la partie d'administration pure appelée «Administration» de Administrator ou "backend".

    • Administration : Vous pouvez accéder à l'administration en ajoutant /administrator dans l'URL après le nom de domaine, à condition bien sur d'avoir un profil qui vous y'autorise : Utilisez le nom d'utilisateur et le mot de passe créés lors de l'installation de Joomla pour le "superuser" puis créez vous un second profil d'administrateur.

      Bonne pratique : modifiez l'identifiant par défaut du "superuser" (admin) et remplacez le par une séquence facile à retenir, mais difficile à deviner. Vous compliquerez un peu la tâche d'éventuels hackers.

    • Frontal : Avec votre nouveau profil d'administrateur, vous pouvez créer des articles et les éditer depuis l'interface frontale du site.

      Connectez-vous par le module «Connexion» ou le lien de menu «Connexion» en utilisant le nom d'utilisateur et le mot de passe créés précédemment. Prenez la bonne habitude de n'utiliser votre profil de "superuser" que lorsque l'action envisagée l’exige, le plus rarement possible.

  4. En savoir plus

    Une pleine utilisation de Joomla requiert certaines connaissances approfondies que vous pourrez acquérir dans la documentation officielle de Joomla ou sur le site d'aide francophone et dans le forum officiel ou le forum francophone.

    Achetez la version PDF ou imprimée d'un des nombreux textes d'introduction à Joomla! Par exemple "Joomla! pour les nuls", et lisez le. Vous aurez l'occasion de vous y référer souvent pendant les premières semaines.

Imprimer

Commentaire (0) Clics: 5280

Visiter

Etoiles inactivesEtoiles inactivesEtoiles inactivesEtoiles inactivesEtoiles inactives

A ce stade, vous disposez d'un site joomla! avec son contenu d'exemples, et vous disposez de deux identités qui vous permettent de vous connecter soit comme administrateur soit comme superuser.

Vous pouvez bien sur aussi expérimenter en utilisant un serveur local, sur votre PC. Cette configuration est gratuite. Mais pour un néophyte, cet environnement est compliqué à mettre en place et différent de l'administration on-line. Je ne vous le recommande donc pas.

Vous pouvez donc visiter le frontend sans vous connecter ou connecté comme administrateur et voir suivant le cas des modifications des menus et des icônes entourant les articles. Vous pouvez aussi vous connecter au backend, soit comme administrateur, soit comme superuser.

Je vous suggère de vous munir d'un cahier, que vous utiliserez comme un livre de bord, pour garder la mémoire de vos principales actions et noter au fil de l'eau pour y revenir plus tard les questions que vous vous poserez.

  1. Commencez par visiter le site standard

    Vous reconnaîtrez une bonne partie des textes de ce site décrivant le "Joomla! standard". Lorsque vous êtes connecté, un nouveau menu nommé «Menu Membres» apparaît, dans la colonne de droite de votre page. Cliquez sur le lien «Proposer un article» pour afficher l'éditeur de texte et d'insertion de médias.

    Pour enregistrer l'article, vous devez insérer du contenu, spécifier à quelle catégorie (pre-existante) il appartient et, son statut de publication. Pour le modifier, cliquez sur l'icône d'édition Editer un article., ou avec d'autres templates comme celui de ce site, sur le bouton"modifier". Le template permet en général de placer ces icônes au début ou à la fin de l'article, à  votre convenance.

    En tant qu'administrateur, vous pouvez travailler sur des articles non publiés ou de publication programmée et, dans le cadre d'un travail collaboratif, ne les rendre visibles qu'à un groupe d'utilisateurs donnés avant de les rendre publics.

    Si votre article n’apparaît pas, alors que vous pensez l'avoir publié, vérifiez la date et l'heure de publication, dans le bas de la page d'édition de l'article. Vérifiez aussi le fuseau horaire de votre profil et celui du site, dans la section "configuration du backend.

    Ne passez à l'étape suivante que lorsque vous vous sentirez confortable avec ce qui précéde créez deux ou trois nouveaux articles, modifiez les, changer les options de publication, changez les de catégorie, et vérifiez que tout se passe comme prévu.

  2. Ensuite penchez vous sur l'administration du site standard

    Laissez en l'état la configuration, les droits, les groupes et généralement ce qui a trait à la gestion du contrôle d’accès. Veillez à ne pas enregistrer de modifications dans ces sections.

    Donc commencez à vous familiariser avec le backend, comme nous l'avons fait pour le frontend : cliquez sur les liens, sans rien modifier, en vous concentrant sur les menus, les catégories, les articles et les utilisateurs. Lisez bien les infobulles qui apparaissent quand votre souris passe au dessus d'un lien. Et lisez les pages d'aide en cliquant sur la bouée en haut à droite de chaque page

    Si votre systéme semble bloqué, pas de panique :vérifiez que vous avez bien cliqué sur le bouton "fermer" ou "annuler" en haut à droite de votre écran.

    Lorsque vous vous sentirez à l'aise, modifiez un article existant à partir du menu contenu/article du backend et enregistrez votre modification. Passez sur le site pour voir le résultat.

    Continuez avec un élément de menu puis une catégorie. Créez puis modifiez un utilisateur.

    Veillez à bien fermer chaque fois le menu que vous utilisez -bouton "enregistrer et fermer"- sinon l'élément concerné sera bloqué. Vous verrez alors une icône de cadenas. Pour débloquer, cliquer sur "déverrouiller" dans la barre de boutons en haut de votre écran.

    Vous pouvez ensuite créer vos propres catégories, éléments de menus et articles pour continuer votre familiarisation. Expérimentez les attributs des liens de menu et verifiez l'effet dans le frontend.

    Expérimentez aussi la création d'articles en Backend. Notez que vous disposez d'options nouvelles, en particulier l'affectation d'images à l'introduction ou à l'article complet.

    Si vous ne trouvez pas la réponse à vos questions dans ce site ou dans votre livre, allez sur les forums Joomla!, francophones et anglophones. Parcourez la documentation online pour vous familiariser avec sa structure et son contenu.

    Pensez à créer des modules dans les différentes positions prévues dans votre template, et en utilisant les principaux types qui apparaissent dans la liste des possibilités.

    Ensuite, la gestion des templates. Dans gestion des extensions/templates vous ouvrez la liste des templates disponibles sur votre site. Remarquez que l'un d'eux est marqué d'une étoile, qui le désigne comme le template ouvert par défaut. Selectionnez en un autre et faites en le défaut : l'étoile se déplace. Revenez dans le frontend, votre site doit avoir significativement changé d'aspect, et peut être abîmé, tous les templates ne prévoyant pas les mêmes positions d'affichage pour les modules. Revenez dans le backend, restaurez le template par défaut initial, et cliquez sur le nom de ce template qui doit apparaître en bleu dans la liste; Familiarisez vous avec les possibilités de paramétrage qui s'offrent à vous.

Imprimer

Commentaire (0) Clics: 4332

Images

Vote utilisateur: 5 / 5

Etoiles activesEtoiles activesEtoiles activesEtoiles activesEtoiles actives

Pour les illustrations, vous devrez gérer des médias : vos propres images ou des images (icônes) libres de droits. vous pouvez bien sur vous en procurer des tonnes en quelques clics sur Google. Mais si vous êtes plus respectueux des régles, abonnez vous à une banque d'image comme :

123RF

Contrairement aux articles, catégories, menus etc..  qui sont stockés dans la base de données du site, les images sont stockées dans des fichiers. Le gestionnaire de médias dans l'onglet "contenu" du backend, vous permet d’accéder à cet espace et d'y charger des contenus à partir de votre PC.

Lorsqu'un média est chargé, vous ne pouvez plus le déplacer, il faut le détruire puis le recharger. Il faut donc penser à organiser vos fichiers, et si vous devez modifier un jour cette organisation, ce sera une opération lourde.

Deux précautions à prendre avant de télécharger des images :

    • vos noms de dossiers et de fichiers doivent être préparés avant le téléchargement :

caractères alphanumériques exclusivement sans caractères spéciaux, majuscules ou accents. Le gestionnaire de médias vous bloquera en cas d'oubli, mais pas le gestionnaire d'images de l'éditeur de textes si vous l'utilisez pour charger des photos. Et les conséquences sont désagréables.

  • Les images elles mêmes doivent être préparées : 1024 pixels de large au maximum, plutôt 740 si vous avez des "sidebars" dans votre template. Si vous illustrez les textes d'introduction vous devrez choisir une taille adaptée à la mise en page choisie. Cette préparation peut être faite avec Paint ou Photoshop. Pour ma part j'utilise "light image resizer" simple et gratuit et qui permet des traitements par lot rapides.

Pour les images que vous souhaitez placer directement dans vos articles, vous pouvez adopter l’organisation qui vous parait adaptée. Si vous utilisez beaucoup d'images, envisagez un sous dossier par catégorie.

Si vous avez remplacé TyniMce, l'éditeur par défaut par JCE soit dans votre profil soit globalement pour votre site, notez que votre éditeur de texte comporte une icône qui vous donne accès à un gestionnaire de médias (different de celui du backend) mais qui vous permet de créer des dossiers, d'uploader des images, de les insérer dans vos articles. Regardez particulièrement les attributs "alignement" (à droite, à gauche) qui permettent de positionner l'image et aux marges qui évitent de coller trop prés texte et image. Vous pouvez aussi recadrer, redimensionner, renommer ou supprimer les images avec les icônes de la palette qui s'affiche à droite de la fenêtre de l'éditeur lorsqu'un fichier d'image est sélectionné.

Je vous suggère de créer deux dossiers particuliers où ranger les images d'intro et images d'articles complets. et d'utiliser le gestionnaire de médias étendu fourni par JCE, mentionné ci-dessus. Vous pouvez paramétrer ce gestionnaire pour qu'au moment de l'upload il crée simultanément une image "pleine" de la bonne dimension et un thumbnail associé.

Ce mode opératoire vous garantit l’homogénéité de la présentation des articles dans votre site, et un rangement systématique de vos images. Vous pouvez aussi restreindre la destination des uploads à partir du frontend à un dossier, ce qui met les autres à l'abri.

Le gestionnaire étendu propose de plus un onglet "popup", si le plugin correspondant est bien activé, qui vous permet de constituer des groupes d'images présentés en "murs" et lorsque vous cliquez sur l'une d'elles, d'ouvrir une fenêtre de visualisation des images (lightbox).

Des utilitaires, comme Widgetkit, vous offrent toutes sortes de possibilités de mise en page et de visualisation. Certaines extensions, comme EasyBlog, disposent de leur propre gestionnaire de médias, en général plus puissant et plus convivial que celui de Joomla! ou même de JCE.

Tout ce qui précède suppose que vous vous cantonnez à l'utilisation du backend et du frontend. Mais vous pouvez accéder à l'arborescence des fichiers de votre site en FTP. Pour cela il vous faut :

  • Demander à votre hébergeur les paramètres d'accés à votre serveur FTP. Préférez un accès sécurisé.
  • procurez vous un client FTP à installer sur votre PC : Filezilla est largement utilisé, gratuit et d'une utilisation très intuitive.

Vous pouvez alors gérer vos fichiers d'image par cet accés FTP.

Imprimer

Commentaire (0) Clics: 5253

Extension

Vote utilisateur: 5 / 5

Etoiles activesEtoiles activesEtoiles activesEtoiles activesEtoiles actives

Pour installer une extension Joomla! la méthode est toujours la même, simple et fiable.

Il vaut mieux faire une sauvegarde avant, (nous y reviendrons). Si vous avez installé AkeebaBackup, ce point de reprise est automatique, ce qui évite de l'oublier.

  • Downloadez sur vôtre PC la nouvelle extension à partir du site du fournisseur. En général il suffit de cliquer sur le bouton adéquat.
  • Sélectionnez le/les packages de langue, en faisant attention à la compatibilité.
  • Ces opérations se concrétisent par un ou plusieurs fichiers "zip". Ne les décompressez pas. Mais organisez votre espace de travail : créez un dossier "joomla" avec un sous dossier par extension (par exemple). Vous pourrez ultérieurement y ranger les mises à jour, les compléments.
  • Pour installer votre extension, rendez vous dans le backend de votre site onglet "gestion des extensions", archive à transférer, "parcourir". Sélectionnez sur votre PC le fichier zip, installez le. Recommencez si nécessaire pour le packet de langue ou des packets complémentaires d'options de l'extension.
  • Il existe d'autres méthodes :
    • A partir d'un dossier décompresse, préalablement recopié sur votre site, pour les très gros composants
    • Directement à partir du JED, dans joomla! 3
    • ou directement à partir du site du fournisseur, en général avec une clef de sécurité
    • mais la méthode ci-dessus est la plus fiable en général
  • Visitez dans gestion des extensions, gestion des modules, cherchez les modules qui ressemblent à "intégration avec" : cela vous indique d'autres applications dont l'intégration avec votre application principale est prévue.
  • Si vous en avez la possibilité, faites vos expériences sur un serveur local (sur votre PC- voir Zend serveur) ou sur un site de test. Comptez une ou deux journée pour faire le tour d'une nouvelle extension un peu complexe. En effet, les composants sont en général très souples et offrent une grande variété d'options adaptées aux gouts et aux besoins des uns et des autres.Après avoir parcouru la documentation, visité une démo, il faut en général procéder par essais successifs pour trouver le paramétrage qui vous convient.

Imprimer

Commentaire (0) Clics: 4597

Sous le capot

Vote utilisateur: 5 / 5

Etoiles activesEtoiles activesEtoiles activesEtoiles activesEtoiles actives

Vous devez ignorer le contenu de cet article durant vos premiers mois avec Joomla!, et peut-être définitivement. Mais si un jour, vous éprouvez le besoin de vous intéresser à l'aspect "organique" (comment ça marche, par opposition à "fonctionnel", ce que ça fait) pour contrôler plus étroitement ce qui s'affiche dans vos pages, cette introduction pourrait vous être utile, sans prétendre remplacer le contenu des sites de documentation.

composants, views et layout.

Un composant fabrique ou gère du contenu.

Ce contenu peut être présenté de plusieurs manières différentes, par exemple le texte complet d'un article, le texte d'introduction ou la liste des articles d'une catégorie. A chacune de ces fonctions correspond en général un type de lien de menu et parfois un module.

Le type de lien de menu permet de fabriquer des liens vers des pages qui seront affichées dans la section principale de votre page; le module remplit la même fonction mais peut être positionné ailleurs que dans la section principale ou à l'intérieur d'un autre article.

Mais si vous lisez ceci vous savez déjà tout ça.

Les différentes fonctions d'un composant s'appellent des "views".

Pour afficher une vue, il faut lui appliquer un "layout", c'est à dire un programme PHP qui fabrique le code Html qui sera transmis au navigateur. Ce programme reçoit les paramétres calculés par le composant pour fabriquer ce code.

A une même vue peuvent correspondre plusieurs layouts, pour présenter suivant les besoins la même information sous des fprmats différents. Par exemple un layout pour afficher les informations fournies par la vue sous forme de liste et un autre pour les présenter sous forme de tableau.

Physiquement, tout cela se trouve dans l'arborescence de fichiers de votre site :

  • la racine contient un dossier "componants"
  • ce dossier contient un dossier pour chaque composant installé sur votre site
  • dans chaque dossier componant, vous trouverez un dossier "views"
  • dans ce dossier views, vous trouverez un dossier pour chacune des fonctions de votre composant
  • dans chacun de ces dossiers, vous trouverez un dossier "tmpl"
  • et dans ce dossier, enfin, les programmes .php correspondant aux différents layout pour cette vue : ceux dont les noms ne comportent pas de _ (underscore). Ceux qui comportent un _ sont associés par le préfixe (avant _) à un même layout et sont appelés par le programme sans underscore.

L'éxécution de ce dernier  programme produit la version par défaut de la page html de votre layout

Application

Le dossier /components/com_weblinks/views contient trois sous dossiers, chacun correspondant à un type de liens de menu proposé par le composant :

categories
liste des liens de toutes les catégories
category
liste des liens d'une catégorie
form
proposer un lien web

Chacun de ces dossiers contient un sous-dossier tmpl, qui pour les deux premiers contiennent un fichier default.php et pour le troisième un fichier edit.php

Template override  

Mais vous avez probablement installé un ou plusieurs template sur votre site, et ce sont eux qui ont le dernier mot en terme de présentation.

Vous allez trouver dans l'arborescence issue de la racine de votre site un dossier "templates" :

  • la racine contient un dossier "templates"
  • ce dossier contient un dossier pour chaque template installé sur votre site, qu'il soit actif ou non.
  • dans le dossier d'un template ouvrez le dossier html, il contient un sous dossier pour chaque composant
  • dans le dossier de chaque de chaque composant, vous retrouvez des sous-dossiers avec les mêmes noms que ceux du dossier views correspondant : ce sont eux qui contiennent les programmes .php, correspondant aux différents layouts du composant, qui sont exécutés lorsque ce template là est actif et que la vue est invoquée.

Modifications de styles.  

Si vous m'avez suivi jusque là, vous avez compris que ce sont ces programmes qu'il faut modifier si vous souhaitez changer le comportement de votre template.

Mais il est aussi possible, pour un composant pêu utilisé et un réalisateur de template préssé, que le layout que vous souhaitez modifier ne soit pas dans le dossier. Il faut alors copier le sous dossier du dossier views dans l'emplacement correspondant du dossier html, pour installer les layouts par défaut dans votre template. Vous pouvez ensuite modifier dans le dossier du template ce que vous souhaitez changer.

Par ce procédé, vous pouvez même créer un nouveau template ex-nihilo.

Mais les changements que vous souhaitez faire n'exigent pas forcément de modifier le code php. Votre dossier de template contient d'autres sous dossiers, qui trient les fichiers par nature :

css
fichiers .css feuilles de style de votre template
js
fichiers javascript, qui animent vos fichiers html
images
les images utilisées par votre temlate
fonts
les polices de caractéres

Pour ajouter des classes css s'appliquant à tout votre contenu, il suffit en principe d'ajouter un fichier mycss.css dans le dossier css du template

Si il n'est pas pris en compte, il va vous falloir aller inspecter index.php qui est la racine de votre template, config.php et config.xml qui lui disent quoi faire. En principe, ces fichiers invoquent la totalité du dossier css, sans préciser les fichiers, mais...

Donc si vous voulez créer une nouvelle classe pour les listes ,qui remplacera la puce standard par une image, vous allez devoir :

  • placer l'image dans le dossier "images" du template,
  • créer une feuille de style qui définit la classe et utilise une référence à l'image,
  • et placer ce fichier dans le dossier css.

Lorsqu'elle fonctionne, cette méthode a l'avantage de survivre à un upgrade du template.

Si vous êtes fatigué de fouiller dans les entrailles de votre site sans obtenir le résultat recherché, vous pouvez (ce qui n'est pas considéré comme une bonne pratique) introduire votre modif dans un fichier css éxistant de votre template , judicieusement choisi.

Mais si vous devez mettre à jour votre template, la modification sera écrasée par la mise à jour. Organisez vous en conséquence.

Le langage LESS pour parametrer la génération des fichiers CSS  

Les fichiers CSS peuvent être très redondants, et on peut souhaiter les paramétrer. On décrit alors les CSS en LESS. L'utilisateur fournit ses paramétres, et les fichiers LESS sont compilés pour fabriquer les véritables fichiers CSS

Supposons que votre template, que vous comptez réutiliser sur plusieurs sites tout en conservant un look spécifique à chaque site, prévoit deux couleurs complémentaires "primary" et "secondary" qui vont apparaître tout au long de vos CSS pour définir la couleur des boutons, les fonds des modules etc... de manière coordonnée.

Si vous utilisez LESS et si vous êtes prévoyants, vous allez définir deux variables @primary et @secondary que vous utiliserez dans la définition des couleurs à la place des valeurs absolues, dans chaque définition de style où elles sont invoquées.

Pour votre second site, il suffit de modifier une seule fois la valeur de ces deux variables, puis de recompiler votre fichier LESS pour obtenir un nouveau fichier CSS. La modification aura été propagée dans toutes les définitions de styles.

Pour corser un peu plus la sauce, supposons que pour accentuer la personnalisation, vous décidiez que sur un site les bordures de blocs auront des coins carrés alors que sur l'autre elles auront des coins arrondis. Encore pas mal de réécritures en perspectives.

En LESS vous allez prévoir un "mixin" (une forme d'abbreviation) pour définir une seule fois les propriétés des bordures de vos blocs.

Ce mixin sera invoqué par son nom chaque fois que vous voulez définir un format de bloc : box-content, box-note, box-info, box-hint, box-warning, box-intro etc...Pour appliquer la modification globalement, il vous suffira de modifier la définition et de recompiler votre fichier LESS pour fabriquer les fichiers CSS de votre second site.

La même méthode permet de fabriquer des "styles" différents d'un même template, pour différencier les sections d'un site, tout en conservant un aspect globalement homogène.

Je pense que vous avez saisi l'idée. Less permet aussi des conditions - guard- des fonctions, le paramétrage des mixins avec ou sans valeur par défaut etc.. Pour tous les détails voir :

lesscss.org

Les fabricants de templates utilisent de plus en plus cette technologie pour des raisons évidentes. Combiné avec une utilisation extensive de JavaScript, cela permet de proposer les fonctions à la mode : barre de menu bloquée, parallaxe, nombreux styles prédéfinis, le tout paramétrable de maniére trés détaillée au gout de l'utilisateur.

Mais si vous utilisez l'un de ces template, gardez bien en mémoire que les CSS ne constituent plus qu' un langage intermédiaire. A chaque modification du fichier source LESS les fichiers CSS seront écrasés. N'espérez donc pas y loger de modification permanente. Sauf si votre template est bien fait et que le dossier .css contiennent un fichier du genre "custom.css"; dans ce cas vous pouvez le remplacer par vos css qui neseront pas écrasés.

Et nous connaissons tous les limites de l'approche WYSIWYG pour les éditeurs. Tous ces paramétrages sont faits à partir de formulaires. Si le résultat n'est pas tout à fait ce que vous souhaitiez, ou si la modification a été mal transposée dans le code, il va vous falloir plonger, avec une couche de plus à traverser.

A ce stade je pense que vous avez saisi l'idée générale. Pour les vrais détails, il vous faudra consulter la documentation officielle sur docs.joomla.org

top

Imprimer

Commentaire (0) Clics: 31802

Articles les plus consultés