Monsieur le QEEL :)
2 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
Monsieur le QEEL :)
Détails techniques
Version du forum : phpBB2
Poste occupé : Fondateur
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
Problème apparu depuis : depuis aujourd'hui, cela m'embête XD
Lien du forum : http://harasdelaprairie.forumactif.org/
Description du problème
BonjourJ'ai récemment (ce matin pour être plus précise xD) pris la décision de changer mon qeel, qui commence à faire vieux, et fait un peu tâche dans le nouveau style que je veux apporter à mon forum
J'ai donc lu, lu et relu des sujets, et j'en ai tiré une conclusion:
- faire une image soi-même du QEEL que l'on voudrait avoir
-une fois cette image faite, l'intégrer dans le template index_body, et adapter le code.
Alors, j'ai fait mon image:
- Spoiler:
Mais maintenant, j'ai un gros problème pour le code, j'ai cherché longtemps mais je m'embrouille, et n'arrive pas à faire grand chose x)
Quelqu'un peut-il m'aider?
Merci d'avance! :3
Lili'
Dernière édition par Lili20 le Sam 20 Juin 2015 - 10:52, édité 1 fois
Re: Monsieur le QEEL :)
Bonjour,
Il y a plusieurs façons possibles de le faire, l'une d'elle est de mettre l'image dans un bloc de fond dont on fixe les dimensions, puis d'aller placer des blocs contenant le texte (des balises div) au dessus de ceux dessinés grâce à une position absolue par rapport au bloc contenant le fond. On distribue ensuite les variables du qeel dans les blocs voulus ^^
Ici l'image fait 850*271px, on va donc fixer les dimensions du bloc principal comme celles-ci. On met l'image en fond, et on ajoute position:relative; au bloc principal pour pouvoir ensuite fixer les blocs à l'intérieur en position absolue par rapport au bloc principal :
http://jsfiddle.net/66djergx/1/
(le code html est à gauche, le code css en haut à droite, le résultat en bas à droite ^^)
Puis on crée 3 blocs, auxquels j'attribue ici la class qeel-bloc. Les trois blocs sont positionnés en position:absolute; Je leur mets une bordure rouge pour pouvoir les situer le temps de construire le qeel, je mets une marge intérieure (padding) de 5px pour ne pas que le texte colle aux bords, et enfin la propriété overflow:auto; permet de faire en sorte que si le texte dépasse des dimensions qu'on va donner aux blocs, une barre de défilement apparait. ^^
http://jsfiddle.net/66djergx/2/
A cause de la position absolue, tous les blocs sont superposés en haut à gauche du bloc #qeel. On va leur donner leurs position et dimensions à chacun grâce aux propriétés css top, left, width et height. Comme ça va être différent pour chaque bloc, je mets ces dimensions directement dans la balise du bloc concerné, ce qui donne :
http://jsfiddle.net/66djergx/
Attention, la largeur totale du bloc, c'est width PLUS padding, et pareil pour la hauteur ^^ :
Pour les variables à mettre ensuite dans les blocs, vous pouvez vous aider du template par défaut, et du tutoriel suivant :
Modifier le qui est en ligne par template
Il y a plusieurs façons possibles de le faire, l'une d'elle est de mettre l'image dans un bloc de fond dont on fixe les dimensions, puis d'aller placer des blocs contenant le texte (des balises div) au dessus de ceux dessinés grâce à une position absolue par rapport au bloc contenant le fond. On distribue ensuite les variables du qeel dans les blocs voulus ^^
Ici l'image fait 850*271px, on va donc fixer les dimensions du bloc principal comme celles-ci. On met l'image en fond, et on ajoute position:relative; au bloc principal pour pouvoir ensuite fixer les blocs à l'intérieur en position absolue par rapport au bloc principal :
http://jsfiddle.net/66djergx/1/
(le code html est à gauche, le code css en haut à droite, le résultat en bas à droite ^^)
Puis on crée 3 blocs, auxquels j'attribue ici la class qeel-bloc. Les trois blocs sont positionnés en position:absolute; Je leur mets une bordure rouge pour pouvoir les situer le temps de construire le qeel, je mets une marge intérieure (padding) de 5px pour ne pas que le texte colle aux bords, et enfin la propriété overflow:auto; permet de faire en sorte que si le texte dépasse des dimensions qu'on va donner aux blocs, une barre de défilement apparait. ^^
http://jsfiddle.net/66djergx/2/
A cause de la position absolue, tous les blocs sont superposés en haut à gauche du bloc #qeel. On va leur donner leurs position et dimensions à chacun grâce aux propriétés css top, left, width et height. Comme ça va être différent pour chaque bloc, je mets ces dimensions directement dans la balise du bloc concerné, ce qui donne :
http://jsfiddle.net/66djergx/
Attention, la largeur totale du bloc, c'est width PLUS padding, et pareil pour la hauteur ^^ :
Pour les variables à mettre ensuite dans les blocs, vous pouvez vous aider du template par défaut, et du tutoriel suivant :
Modifier le qui est en ligne par template
Dernière édition par MlleAlys le Jeu 18 Juin 2015 - 20:05, édité 2 fois
MlleAlys- Membre actif
- Messages : 5767
Inscrit(e) le : 12/09/2012
Re: Monsieur le QEEL :)
Merci beaucoup, je vais essayer cela!
Re: Monsieur le QEEL :)
Alors, ça marche super bien merci, mais je me suis perdue en chemin pour ce qui est de compléter les variables à mettre dans les blocs :/
Je n'arrive pas à comprendre clairement quelle partie du template je dois mettre à la place de "contenu bloc 24h" et les deux autres contenus xD
Et aussi du coup l'ancien qeel reste en dessous de celui-ci, comment dois-je faire pour le retirer une fois que mes variables seront en place?
Merci d'avance, et merci infiniment pour l'aide que tu m'as apportée jusqu'à présent qui est claire, super bien faite et a du te prendre beaucoup de temps O.O, ça m'a énormément aidé je n'aurais jamais réussi à arriver jusqu'à ce point sans ton aide *-*
Bonne soirée,
Lili
Je n'arrive pas à comprendre clairement quelle partie du template je dois mettre à la place de "contenu bloc 24h" et les deux autres contenus xD
Et aussi du coup l'ancien qeel reste en dessous de celui-ci, comment dois-je faire pour le retirer une fois que mes variables seront en place?
Merci d'avance, et merci infiniment pour l'aide que tu m'as apportée jusqu'à présent qui est claire, super bien faite et a du te prendre beaucoup de temps O.O, ça m'a énormément aidé je n'aurais jamais réussi à arriver jusqu'à ce point sans ton aide *-*
Bonne soirée,
Lili
Re: Monsieur le QEEL :)
Dans le template index_body, le qeel se trouve entres la ligne
<!-- BEGIN disable_viewonline -->
et
<!-- END disable_viewonline -->
Ces deux lignes correspondent à une variable de type boucle, comme les autres lignes du même genre : Ce qui est entre ces deux lignes est afficher lorsque l'option du panneau est activée.
Votre nouveau qeel devra donc au final remplacer ce qu'il y a entre ces deux lignes.
De même, à l'intérieur du qeel, il y a d'autres boucles :
Si vous souhaitez garder le contrôle de ces options, il vous faudra donc garder ces boucles dans votre qeel ^^
L'autre type de variables dans les templates sont du genre {VARIABLE}. Ces variables sont remplacées à l'affichage de la page par leur information correspondante.
On peut identifier à quoi elles correspondent en les entourant d'un texte par exemple et en regardant ce qui apparait entre le texte ensuite à l'affichage.
Par exemple, dans le template il y a ce passage :
Si je veux savoir à quoi correspond la variable {TOTAL_USERS}, je l'entoure par exemple ainsi :
J'enregistre le template, je le publie, et voilà ce qui apparait sur mon forum :
La variable {TOTAL_USERS} a donc été remplacée à l'affichage par la phrase "Nous avons 2 membres enregistrés".
Il vous faut donc copier/coller la variable {TOTAL_USERS} dans le bloc où vous souhaitez voir s'afficher cette phrase ^^
Le tutoriel vous indique ainsi à quoi correspondent les différentes variables du qeel.
Les variables auxquelles il faut faire un peu plus attention : {L_CONNECTED_MEMBERS} , {L_WHOSBIRTHDAY_TODAY} et {L_WHOSBIRTHDAY_WEEK} .
Ces variables ne sont pas simplement du texte, mais des lignes de tableau ou des demi-lignes de tableau(cf le tutoriel apprendre à faire un tableau en html, c'est pour éviter qu'il y ait une ligne vide dans le qeel s'il n'y a rien à afficher, il n'y a alors juste pas de ligne du tout ^^)...
Et des lignes de tableau doivent se trouver dans un tableau, or votre nouveau qeel n'est pas un tableau !
En le mettant dans un bloc, il faut donc les mettre entre balises table quand même, ce qui donne comme indiqué dans le tutoriel :
Bref,
il faut ainsi continuer à prendre les différentes variables du qeel de départ, voir à quoi elles correspondent, et les mettre dans le bloc où vous les souhaitez de votre nouveau qeel ^^
<!-- BEGIN disable_viewonline -->
et
<!-- END disable_viewonline -->
Ces deux lignes correspondent à une variable de type boucle, comme les autres lignes du même genre : Ce qui est entre ces deux lignes est afficher lorsque l'option du panneau est activée.
Votre nouveau qeel devra donc au final remplacer ce qu'il y a entre ces deux lignes.
De même, à l'intérieur du qeel, il y a d'autres boucles :
- Code:
<!-- BEGIN switch_viewonline_link -->
AFFICHAGE DU TITRE QUAND LE LIEN VERS LES STATISTIQUES EST ACTIVE
<!-- END switch_viewonline_link -->
- Code:
<!-- BEGIN switch_viewonline_nolink -->
AFFICHAGE DU TITRE QUAND LE LIEN EST DESACTIVE
<!-- END switch_viewonline_nolink -->
- Code:
<!-- BEGIN switch_chatbox_activate -->
AFFICHAGE DE LA PARTIE CONCERNANT LA CB SI CELLE-CI EST ACTIVE
<!-- END switch_chatbox_activate -->
Si vous souhaitez garder le contrôle de ces options, il vous faudra donc garder ces boucles dans votre qeel ^^
L'autre type de variables dans les templates sont du genre {VARIABLE}. Ces variables sont remplacées à l'affichage de la page par leur information correspondante.
On peut identifier à quoi elles correspondent en les entourant d'un texte par exemple et en regardant ce qui apparait entre le texte ensuite à l'affichage.
Par exemple, dans le template il y a ce passage :
- Code:
<span class="gensmall">{TOTAL_POSTS}<br />
{TOTAL_USERS}<br />
{NEWEST_USER}</span>
Si je veux savoir à quoi correspond la variable {TOTAL_USERS}, je l'entoure par exemple ainsi :
- Code:
<span class="gensmall">{TOTAL_POSTS}<br />
$$${TOTAL_USERS}@@@<br />
{NEWEST_USER}</span>
J'enregistre le template, je le publie, et voilà ce qui apparait sur mon forum :
La variable {TOTAL_USERS} a donc été remplacée à l'affichage par la phrase "Nous avons 2 membres enregistrés".
Il vous faut donc copier/coller la variable {TOTAL_USERS} dans le bloc où vous souhaitez voir s'afficher cette phrase ^^
Le tutoriel vous indique ainsi à quoi correspondent les différentes variables du qeel.
Les variables auxquelles il faut faire un peu plus attention : {L_CONNECTED_MEMBERS} , {L_WHOSBIRTHDAY_TODAY} et {L_WHOSBIRTHDAY_WEEK} .
Ces variables ne sont pas simplement du texte, mais des lignes de tableau ou des demi-lignes de tableau(cf le tutoriel apprendre à faire un tableau en html, c'est pour éviter qu'il y ait une ligne vide dans le qeel s'il n'y a rien à afficher, il n'y a alors juste pas de ligne du tout ^^)...
Et des lignes de tableau doivent se trouver dans un tableau, or votre nouveau qeel n'est pas un tableau !
En le mettant dans un bloc, il faut donc les mettre entre balises table quand même, ce qui donne comme indiqué dans le tutoriel :
- Code:
<table>{L_CONNECTED_MEMBERS}</table>
- Code:
<table>{L_WHOSBIRTHDAY_TODAY}</span></td></tr></table>
- Code:
<table><tr><td><span>{L_WHOSBIRTHDAY_WEEK}</table>
Bref,
il faut ainsi continuer à prendre les différentes variables du qeel de départ, voir à quoi elles correspondent, et les mettre dans le bloc où vous les souhaitez de votre nouveau qeel ^^
Dernière édition par MlleAlys le Ven 26 Juin 2015 - 13:51, édité 1 fois
MlleAlys- Membre actif
- Messages : 5767
Inscrit(e) le : 12/09/2012
Re: Monsieur le QEEL :)
Oh merci beaucoup!! Je pense que je vais y arriver merci infiniment *0*
Maintenant je vous laisse tranquille xD
Bon week-end et merci encore!
Maintenant je vous laisse tranquille xD
Bon week-end et merci encore!
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