Personnaliser le règlement de chaque forum

Voir le sujet précédent Voir le sujet suivant Aller en bas

Milouze14
avatar
Fondateur

MessageMilouze14

  • 16px
  • 24px
  • Zoom
Cette astuce vous permettra d'avoir la même apparence sur tous les règlements internes
de vos forums.
Voir l'effet en images:



Tout se passe dans la feuille de style, donc nul besoin d'aller farfouiller dans la template
concernée.
Nous allons utiliser les pseudo éléments "before et "after" .

Allez c'est parti....

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Les images sont hébergées sur mon nom de domaine ,
pour un affichage constant.
Bref, je vous demande donc d'enregistrer ces dernières
sur votre disque dur et ensuite de les héberger vous même.
Ou encore mieux utiliser les vôtres .
Adaptez les pourcentages par rapport à la largeur de votre body.
Sur ce forum la structure est basée sur 80%.
Code:

/*Le coté important*/
#forum_rules.forumline:before
{
content:'Important.';/*le texte à modifier si besoin*/
background: url(http://milouze14.fr/Info2_16.png)no-repeat left; /* l'image et sa position à gauche*/
color:#A4405B;/*la couleur du texte*/
font-size:14px;  /*la taille de la police*/
font-weight:bold;  /*le texte est affiché en gras*/
padding-left:2%;/* le texte sera décalé de 2% par rapport à l'image*/
margin-left:35%; /*le contenu sera placé à 35% de la gauche*/
}
/*Le coté Merci de le suivre à la lettre*/
#forum_rules.forumline:after
{
content:'Merci de le suivre à la lettre.';/*le texte à modifier si besoin*/
background: url(http://milouze14.fr/Face_Happy.png)no-repeat right; /* l'image et sa position à droite*/
color:#A4405B;/*la couleur du texte*/
font-size:14px;  /*la taille de la police*/
  font-weight:bold; /*le texte est affiché en gras*/
padding-right:2%;/* le texte sera décalé de 2% par rapport à l'image*/
margin-left:35%; /*le contenu sera placé à 35% de la gauche*/
}
/*Le coté Règlement à suivre*/
#forum_rules .postbody:before
{
  content:'Règlement à suivre:';/*le texte à modifier si besoin*/
  color:#A4405B;/*la couleur du texte*/
  font-size:11px;  /*la taille de la police*/
  font-weight:bold; /*le texte est affiché en gras*/
background: url(http://milouze14.fr/green-icone26.png)no-repeat right;/* l'image et sa position à droite*/
  padding-right:20px;/* le texte sera décalé de 20px par rapport à l'image*/
}
/*Le coté Fin de la procédure*/
#forum_rules .postbody:after
{
  content:'Fin de la procédure.';/*le texte à modifier si besoin*/
  color:#A4405B;/*la couleur du texte*/
  font-size:11px; /*la taille de la police*/
  font-weight:bold; /*le texte est affiché en gras*/
background: url(http://milouze14.fr/green-icone27.png)no-repeat left;/* l'image et sa position à gauche*/
 padding-left:20px;/* le texte sera décalé de 20px par rapport à l'image*/
}

Pensez à cliquer sur le bouton Valider

Voilà, c'est tout pour le moment.




-Le respect de nos semblables est la règle de notre conduite.-

Fondateur des forums



Voir le sujet précédent Voir le sujet suivant Revenir en haut

Créer un compte ou se connecter pour répondre

Vous devez être membre pour répondre.

S'enregistrer

Rejoignez notre communauté ! C'est facile !


S'enregistrer

Connexion

Vous êtes déjà membre ? Aucun soucis, cliquez ici pour vous connecter.


Connexion

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum