article(s) dans votre panier VOIR

Identifier les feuilles de styles sur Joomla 3.7

  • Vidéo 79 sur 105
  • 15h49 de formation
  • 105 leçons

Un contenu flash devrait s'afficher ici. Votre navigateur ne comporte pas de plugin flash, ou il ne s'est pas correctement initialisé.

Vous pouvez télécharger le plugin flash depuis le site d'Adobe à l'adresse suivante : http://get.adobe.com/flashplayer/.

Pour accéder à la suite de cette formation, vous devez vous abonner.
previous
summary
resume
next
play
Identifier les feuilles de styles : personnaliser Protostar avec vos propres styles
00:00 / 06:31
HD
fullscreen
Je m’abonne
à partir de 16,6 € / mois
  • Visionnage en ligne
  • Accès illimité à toutes nos formations
OU
J'achète uniquement
la formation
159,00€
  • Téléchargement + VOD à vie
  • Accès uniquement à cette formation

Sommaire de la formation

Détails de la formation

Dans ce tuto en ligne, le formateur expert vous explique comment identifier les feuilles de styles pour la personnalisation de Protostar avec des propres styles dans Joomla 3.7. L'objectif de cette vidéo est d'agir sur la présentation d'un template. Pour cela, vous allez dans le panneau d'administration du site puis vous cliquez sur l'onglet Extensions. A partir de ce menu, vous affichez la liste des templates disponibles dans le logiciel. Dans ce cadre, vous sélectionnez l'option Détails et fichiers du template que vous souhaitez éditer. Dans ce cas, il s'agit de Protostar. Afin de trouver les feuilles de styles sur l'arborescence des fichiers du templates, vous développez les dossiers CSS ou LESS. Lorsque vous effectuez des modifications au niveau du fichier template.less, elles sont par la suite compilées dans le document équivalent au format .css. A cet effet, il est nécessaire d'activer le bouton Compiler LESS. De cette manière, vous êtes en mesure de voir les changements effectués. Il est à noter que cette disposition est indispensable puisque les codes du fichier .css sont ceux qui impactent dans la présentation du thème. Pour cause, ce format est le seul pris en compte par le navigateur. Pour continuer, vous passez à la personnalisation du template en cours. A cette fin, vous procédez par un ajout de fichier avec le bouton Nouveau fichier. Dans la fenêtre ouverte, vous cliquez donc sur le dossier css. Une fois cela fait, vous renseignez le nom du fichier à ajouter et vous précisez le type de fichier pour le format .css. Vous finalisez ensuite l'ajout du fichier avec le bouton Créer. A l'issue de cette action, vous constatez directement le nouveau fichier intégré dans l'arborescence. Pour le compléter, vous ciblez la partie du site que vous voulez perfectionner. Vous affichez ensuite le menu correspondant puis vous choisissez l'option Inspecter. De ce fait, vous constatez le code qui régit l'affichage de l'élément concerné. Vous prenez comme référence de ce code pour en établir un autre dans la nouvelle feuille de style en fonction des changements voulus. Pour terminer, vous enregistrez cette édition puis vous actualisez la page du site concernée pour voir les résultats de la personnalisation. En conclusion, l'ajout d'une feuille de style permet d'imposer des modifications sur un site.