Background différent pour chaque catégories
3 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Background différent pour chaque catégories
Détails techniques
Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer
Capture d'écran du problème :
- Voir l'image:
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://nickelodeonfans.forumactif.be/
Description du problème
Bonjour/soir FA ,Le titre et le screen sont à mon avis assez explicites ..
J'ai fait énormément de recherches mais hélas sans succès ..
J'espère que c'est faisable et que quelqu'un saura m'aider ..
Le but de cette manoeuvre est de garder le thème sur lequel nous travaillons le plus épuré possible en n'ayant donc qu'une image (différente) pour chaque catégories qui ferait office de background et passerait ainsi sous les liens des forums ..
Mettre une image par forum (et il en faudrait bcp ..) nous éloignerait de ce but ..
D'avance merci ..
Alex.
Dernière édition par Alexlerouche le Lun 1 Fév 2016 - 22:02, édité 1 fois
Re: Background différent pour chaque catégories
Bonjour,
Je ne comprends pas vraiment le système... Comment voulez-vous obtenir un fond différent pour chaque catégorie... sans avoir à mettre des backgrounds différents ? C'est contradictoire ce que vous dites, vous pourriez expliquer ?
- Code:
Le but de cette manoeuvre est de garder le thème sur lequel nous travaillons le plus épuré possible en n'ayant donc qu'une image (différente) pour chaque catégories qui ferait office de background et passerait ainsi sous les liens des forums ..
Mettre une image par forum (et il en faudrait bcp ..) nous éloignerait de ce but ..
Je ne comprends pas vraiment le système... Comment voulez-vous obtenir un fond différent pour chaque catégorie... sans avoir à mettre des backgrounds différents ? C'est contradictoire ce que vous dites, vous pourriez expliquer ?
♢ Pour faciliter les recherches, mettez un titre explicite.
♢ Remerciez le message qui vous a aidé pour que celui-ci soit mis en évidence.
♢ Épinglez votre sujet en résolu pour prévenir la modération.
Re: Background différent pour chaque catégories
Bonjour ^^
La bonne nouvelle est que c'est possible !
On va commencer par placer un javascript.
PA > Modules > Gestion des codes javascripts > Créer un nouveau javascript
Titre : au choix
Placement : sur l'index
Code :
- Vous placez autant de lignes $('a.forumtitle[href^="/f1-"]').closest... que vous avez de catégories et chaque ligne a deux portions à configurer en rouge dans le texte ci-dessous
$('a.forumtitle[href^="/f1-"]').closest('ul.topiclist.forums').addClass('Nep_categ1');
En fin de ligne, ici Nep_categ1 est l'identifiant que l'on va ajouter au tableau des sous-forums pour pouvoir agir sur cette zone par le biais du CSS
En début de ligne, ici /f1-, il s'agit de l'identifiant du premier sous-forum (visible aux invités) de la catégorie. Il est important de choisir un forum qui soit visible du plus grand nombre, si vous prenez comme repère une zone privée, la personnalisation fonctionnera pour vous mais pas pour vos membres ou vos invités.
Sur votre forum par exemple on voit ce sous-forum :
nickelodeonfans.forumactif.be/f2-charte-footmaniaque
Votre script contiendrait donc la ligne
Ensuite on va sur la feuille de style CSS et on ajoute par exemple ceci
Le code se décompose en deux parties.
La première vise à personnaliser le fond de chaque section (3 blocs de CSS dans l'exemple). N'oubliez pas de remplacer adresse_image_categorieX.jpg par le lien de vos images.
Et le dernier bloc sert à modifier les caractéristiques de répétition du fond si le comportement par défaut (répétition horizontale) ne convient pas.
Dans l'exemple j'ai utilisé des textures de 50px maximum de côté et ai donc ordonné la répétition horizontale et verticale pour couvrir toute la catégorie.
Le code est évidemment fonctionnel, il a été testé sur un forum phpBB3 avant de vous être proposé.
Lixyr : je ne sais pas si j'ai compris correctement mais moi je pense qu'on demande un fond par catégorie (et non par sous-forum)
La bonne nouvelle est que c'est possible !
On va commencer par placer un javascript.
PA > Modules > Gestion des codes javascripts > Créer un nouveau javascript
Titre : au choix
Placement : sur l'index
Code :
- Code:
$(function(){
$('a.forumtitle[href^="/f1-"]').closest('ul.topiclist.forums').addClass('Nep_categ1');
$('a.forumtitle[href^="/f3-"]').closest('ul.topiclist.forums').addClass('Nep_categ2');
$('a.forumtitle[href^="/f2-"]').closest('ul.topiclist.forums').addClass('Nep_categ3');
});
- Vous placez autant de lignes $('a.forumtitle[href^="/f1-"]').closest... que vous avez de catégories et chaque ligne a deux portions à configurer en rouge dans le texte ci-dessous
$('a.forumtitle[href^="/f1-"]').closest('ul.topiclist.forums').addClass('Nep_categ1');
En fin de ligne, ici Nep_categ1 est l'identifiant que l'on va ajouter au tableau des sous-forums pour pouvoir agir sur cette zone par le biais du CSS
En début de ligne, ici /f1-, il s'agit de l'identifiant du premier sous-forum (visible aux invités) de la catégorie. Il est important de choisir un forum qui soit visible du plus grand nombre, si vous prenez comme repère une zone privée, la personnalisation fonctionnera pour vous mais pas pour vos membres ou vos invités.
Sur votre forum par exemple on voit ce sous-forum :
nickelodeonfans.forumactif.be/f2-charte-footmaniaque
Votre script contiendrait donc la ligne
- Code:
$('a.forumtitle[href^="/f2-"]').closest('ul.topiclist.forums').addClass('Nep_categ1');
Ensuite on va sur la feuille de style CSS et on ajoute par exemple ceci
- Code:
.Nep_categ1 {
background-image: url(http://adresse_image_categorie1.jpg)!important;
}
.Nep_categ2 {
background-image: url(http://adresse_image_categorie2.jpg)!important;
}
.Nep_categ3 {
background-image: url(http://adresse_image_categorie3.jpg)!important;
}
.Nep_categ1, .Nep_categ2, .Nep_categ3 {
background-repeat: repeat !important;
}
Le code se décompose en deux parties.
La première vise à personnaliser le fond de chaque section (3 blocs de CSS dans l'exemple). N'oubliez pas de remplacer adresse_image_categorieX.jpg par le lien de vos images.
Et le dernier bloc sert à modifier les caractéristiques de répétition du fond si le comportement par défaut (répétition horizontale) ne convient pas.
Dans l'exemple j'ai utilisé des textures de 50px maximum de côté et ai donc ordonné la répétition horizontale et verticale pour couvrir toute la catégorie.
Le code est évidemment fonctionnel, il a été testé sur un forum phpBB3 avant de vous être proposé.
Lixyr : je ne sais pas si j'ai compris correctement mais moi je pense qu'on demande un fond par catégorie (et non par sous-forum)
Dernière édition par Neptunia- le Lun 1 Fév 2016 - 22:32, édité 1 fois
Re: Background différent pour chaque catégories
Hello Lixyr et Neptunia ,
Dsl Lixyr , je me suis un peu emmêlé lesbackgrounds pinceaux .. ^^
Neptunia , oui c'est exactement ce que je recherche .. Je teste tout ça et je reviens informer si c'est ok ..
Je pensais par contre qu'il faudrait passer par les templates ..
Merci en tout cas .. ;-)
Dsl Lixyr , je me suis un peu emmêlé les
Neptunia , oui c'est exactement ce que je recherche .. Je teste tout ça et je reviens informer si c'est ok ..
Je pensais par contre qu'il faudrait passer par les templates ..
Merci en tout cas .. ;-)
Re: Background différent pour chaque catégories
Alexlerouche a écrit:Je pensais par contre qu'il faudrait passer par les templates ..
Pour ce qui est de l'affichage d'une liste de sous-forums, sujets, membres ou même de messages constituant un sujet le procédé des templates est le même : un seul bloc de code qui se répète pour chaque élément jusqu'à la fin de la liste. On ne pourrait donc mettre qu'une image qui serait identique pour chaque catégorie.
On pourrait évidemment insérer le javascript dans le template index_box mais ça resterait du javascript.
Re: Background différent pour chaque catégories
Donc voilà , je viens d'installer le js et le css ..
J'ai bien entendu une 1ère catégorie non-visible pour les invités car elle ne concerne que les modos et admins ..
Alors , de ce que j'ai compris (pas tout à mon avis ..) , j'ai fait ceci avec le JS :
J'ai donc passé outre le "f1" pour la 1ère catégorie puisque invisible aux invités .. Je ne sais pas si j'ai bien fait ..
En tout cas pour le moment il n'y a que la 2ème catégorie "RÈGLEMENT, AIDE ET PRÉSENTATION DES MEMBRES" (donc la 1ère visible quand on est en invité) où le background s'est bien installé mais pas sur les autres catégories ..
J'en ai fait que 3 par mesure de test ..
Et pour le css , j'ai bien mis les 3 url :
Ces images font aussi juste office de test ..
Bref j'ai du merder quelque part ..
J'ai bien entendu une 1ère catégorie non-visible pour les invités car elle ne concerne que les modos et admins ..
Alors , de ce que j'ai compris (pas tout à mon avis ..) , j'ai fait ceci avec le JS :
- Code:
$(function(){
$('a.forumtitle[href^="/f2-"]').closest('ul.topiclist.forums').addClass('Nep_categ1');
$('a.forumtitle[href^="/f3-"]').closest('ul.topiclist.forums').addClass('Nep_categ2');
$('a.forumtitle[href^="/f4-"]').closest('ul.topiclist.forums').addClass('Nep_categ3');
});
J'ai donc passé outre le "f1" pour la 1ère catégorie puisque invisible aux invités .. Je ne sais pas si j'ai bien fait ..
En tout cas pour le moment il n'y a que la 2ème catégorie "RÈGLEMENT, AIDE ET PRÉSENTATION DES MEMBRES" (donc la 1ère visible quand on est en invité) où le background s'est bien installé mais pas sur les autres catégories ..
J'en ai fait que 3 par mesure de test ..
Et pour le css , j'ai bien mis les 3 url :
- Code:
.Nep_categ1 {
background-image: url(http://nsa37.casimages.com/img/2016/02/01/160201084008108748.png)!important;
}
.Nep_categ2 {
background-image: url(http://nsa38.casimages.com/img/2016/02/01/160201090433857288.png)!important;
}
.Nep_categ3 {
background-image: url(http://nsa37.casimages.com/img/2016/02/01/160201090608837661.png)!important;
}
.Nep_categ1, .Nep_categ2, .Nep_categ3 {
background-repeat: repeat !important;
}
Ces images font aussi juste office de test ..
Bref j'ai du merder quelque part ..
Re: Background différent pour chaque catégories
Vous recourez aux forums 2 3 et 4 c'est à dire
http://nickelodeonfans.forumactif.be/f2-charte-footmaniaque
http://nickelodeonfans.forumactif.be/f3-presentation-des-membres
http://nickelodeonfans.forumactif.be/f4-aide-au-fonctionnement-du-forum
Ces 3 forums étant dans la même catégorie, cette catégorie recevra les 3 classes différentes et les 3 fonds différents (toutefois seul le dernier devrait être affiché)
Pour que ça marche sur les autres catégories il faut prendre un forum de chaque catégorie et non 3 fois la même.
Pour le foot belge par exemple on a :
nickelodeonfans.forumactif.be/f5-jupiler-pro-league donc forum numéro 5 et le javascript devrait reprendre :
http://nickelodeonfans.forumactif.be/f2-charte-footmaniaque
http://nickelodeonfans.forumactif.be/f3-presentation-des-membres
http://nickelodeonfans.forumactif.be/f4-aide-au-fonctionnement-du-forum
Ces 3 forums étant dans la même catégorie, cette catégorie recevra les 3 classes différentes et les 3 fonds différents (toutefois seul le dernier devrait être affiché)
Pour que ça marche sur les autres catégories il faut prendre un forum de chaque catégorie et non 3 fois la même.
Pour le foot belge par exemple on a :
nickelodeonfans.forumactif.be/f5-jupiler-pro-league donc forum numéro 5 et le javascript devrait reprendre :
- Code:
$('a.forumtitle[href^="/f5-"]').closest('ul.topiclist.forums').addClass('Nep_categ2');
Re: Background différent pour chaque catégories
Ok ok , j'ai capté ma bêtise ..
Je vais regarder pour bidouiller un peu le css et dès que c'est bon , je mets résolu ..
Encore merci , Neptune ..
Je vais regarder pour bidouiller un peu le css et dès que c'est bon , je mets résolu ..
Encore merci , Neptune ..
Re: Background différent pour chaque catégories
C'est impec , Neptune , j'ai pile ce que je souhaitais ..
Encore un grand merci pour ta précieuse aide !
@ bientôt p-ê et bonne soirée ..
Résolu*
Encore un grand merci pour ta précieuse aide !
@ bientôt p-ê et bonne soirée ..
Résolu*
Sujets similaires
» Créer une bannière spécifique pour chaque catégories
» problème insérer une image sous chaque catégories
» Dimensions idéales pour un Background
» Background image pour Toolbar
» Comment faire pour avoir un fond différent pour chaque sous forum :Edit:[photos]
» problème insérer une image sous chaque catégories
» Dimensions idéales pour un Background
» Background image pour Toolbar
» Comment faire pour avoir un fond différent pour chaque sous forum :Edit:[photos]
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum