Tweet
Bonjour à toutes et à tous,
au lieu de répondre sur Facebook, je me suis dit que ça pourrais servir à d'autres.
La question
"Bonjour tout le monde j'espère que vous allez bien.
sur mon site j'ai créé un module article "Tous les articles récents", je n'arrive pas à mettre le fond en blanc comme les autres."
Mon petit tuto
Avant toutes choses, on inspecte le code :
On voit que le module a déjà pour classe "sp-module".
Pour donner un style particulier à un module dans Joomla, on peut utiliser le "Suffixe de classe CSS".
Il suffit de remplir le champ adéquat, comme l'exemple ci dessous:
Attention le champ est destiné à accueillir une classe et non, le code CSS lui-même.
Ici on ajoute une classe " fondBlanc", puis dans le fichier le custom.css on défini le style qu'on désire.
Là, par exemple :
Attention
L’espace avant le nom de la classe permet de ne pas coller le suffixe sur l'objet HTML inférieur dans le code :
En effet, on peux voir que la classe fondBlanc s’ajoute au module dans le code :
mais aussi sur la liste des articles
Si on ne met pas d'espace cela donnera
Ce qui dans certains cas, ne donnera pas le style escompté.
Voilà, cette fonctionnalité de Joomla permet de customiser ces modules avec beaucoup de souplesse.
au lieu de répondre sur Facebook, je me suis dit que ça pourrais servir à d'autres.
La question
"Bonjour tout le monde j'espère que vous allez bien.
sur mon site j'ai créé un module article "Tous les articles récents", je n'arrive pas à mettre le fond en blanc comme les autres."
Mon petit tuto
Avant toutes choses, on inspecte le code :
On voit que le module a déjà pour classe "sp-module".
Pour donner un style particulier à un module dans Joomla, on peut utiliser le "Suffixe de classe CSS".
Il suffit de remplir le champ adéquat, comme l'exemple ci dessous:
Attention le champ est destiné à accueillir une classe et non, le code CSS lui-même.
Ici on ajoute une classe " fondBlanc", puis dans le fichier le custom.css on défini le style qu'on désire.
Là, par exemple :
Code:
.sp-module.fondBlanc {
background-color: white;
padding: 30px;
margin-top: 15px;
}
L’espace avant le nom de la classe permet de ne pas coller le suffixe sur l'objet HTML inférieur dans le code :
En effet, on peux voir que la classe fondBlanc s’ajoute au module dans le code :
Code HTML:
<div class="sp-module fondBlanc">
Code HTML:
<ul class="category-module fondBlanc mod-list">
Code HTML:
<ul class="category-modulefondBlanc mod-list">
Voilà, cette fonctionnalité de Joomla permet de customiser ces modules avec beaucoup de souplesse.
Commentaire