| Header du forum sur le côté , possible ? (Résolu) | |
|
.Lou
{ Membre actif }
Messages : 771
| Hé !! Je viens de créer un forum test dans l'éventuelle ouverture d'un forum et je me lance donc dans modifications des templates & CSS. En réfléchissant un peu j'ai eu une idée mais je ne sais pas si c'est réalisable. J'ai donc une question peut-être un peu particulière à vous poser. Comme mon titre l'indique , j'aimerais savoir si il est possible de déplacer l'header du forum de façon à le mettre sur la droite ou la gauche du forum. J'ai utilisé la fonction recherche , fouiné dans les différents sections du forum mais je n'ai rien trouvé à ce sujet. Milles excuses si j'ai mal cherché. Merci d'avance pour votre aide EDIT : Je précis que je n'ai encore rien modifier sur ce forum test. |
Dernière édition par .Lou le Lun 09 Juil 2012, 16:07, édité 3 fois | |
|
| |
Doare
{ Spécialiste }
Messages : 544
| Cela peut revenir à : - supprimer la bannière en haut, - mettre un fond de page avec la "bannière" sur un des côtés, - et aligner le forum de l'autre côté. Par exemple. | | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Merci pour ta réponse Je pensais à ça également mais dans ce cas la bannière ne sera pas cliquable de façon à revenir à l'index du forum. & Moi j'aurais aimé que la bannière garde cette fonction de retour à l'index également. Je sais pas si je suis claire | | |
|
| |
'Christa
Lostmindy
Messages : 2856
| Bonjour,
Je n'ai pas bien saisi ton problème.
En quoi consiste l'image de ton header ? Est-ce une de ces "bannières-fonds" si populaires ces temps ci ? Est-ce une image bien distincte ? Est-ce que tu comptes en faire une sorte de barre latérale comme on peut en voir une ici sur CSSActif ?
Si c'est cette dernière solution, il va falloir chambouler sérieusement les templates pour y arriver (well, soit avec des tableaux soit avec des div, étant moi même partisane de la seconde solution)
La solution de Doare n'est pas mauvaise non plus même s'il faudrait prendre en compte les petites résolutions (et le risque que la "bannière" se fasse écraser (cacher par le corps du forum). Le côté "cliquable" serait simplement rajouté via un lien en positionnement absolu x) | | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Merci pour ta réponse Voilà l'adresse de mon forum test : - Spoiler:
http://brouillon.forumactif.fr/
Depuis que j'ai posté ce sujet , j'ai décalé l'index de mon forum sur la gauche , comme je le souhaitais. Ensuite , je viens juste de mettre une image de fond sur le côté droit donc. J'aimerais qu'on puisse cliquer sur cette image comme on le ferait sur une bannière classique ( en haut de page donc ) pour revenir à l'index du forum lorsqu'on navigue sur celui-ci. J'espère que c'est plus clair comme ça Par contre j'ai un soucis avec ma barre de navigation pour le moment. Je préfère préciser | | |
|
| |
'Christa
Lostmindy
Messages : 2856
| Le problème de la méthode actuelle c'est que selon la résolution ça affiche plus ou moins n'importe quoi (pour tester, réduis la fenêtre x) ) Bon, une solution "possible" et qui ne nécessite pas de faire un nombre excessif de modifications, ce serait de diviser le tableau qui contient le forum entier en deux cellules. Regarde cette partie dans ton template overall_header - Code:
-
<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center"> <tr> <td class="bodyline"> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <!-- BEGIN switch_logo_left --> <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td> <!-- END switch_logo_left --> <td align="center" width="100%" valign="middle"> <!-- BEGIN switch_logo_center --> <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a> <br /> <!-- END switch_logo_center --> <div class="maintitle">{MAIN_SITENAME}</div> <br /> <span class="gen">{SITE_DESCRIPTION}<br /> </span> </td> <!-- BEGIN switch_logo_right --> <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td> <!-- END switch_logo_right --> </tr> </table> Juste après le premier tr, tu vas rajouter une cellule, et tu vas y déplacer le tableau qui contient le logo et la description du forum : - Code:
-
<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center"> <tr> <!-- MODIFICATION DE CODE --> <td class="banlaterale"> <!-- ON DEPLACE LE CODE DE LA BANNIERE ICI --> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <!-- BEGIN switch_logo_left --> <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td> <!-- END switch_logo_left --> <td align="center" width="100%" valign="middle"> <!-- BEGIN switch_logo_center --> <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a> <br /> <!-- END switch_logo_center --> <div class="maintitle">{MAIN_SITENAME}</div> <br /> <span class="gen">{SITE_DESCRIPTION}<br /> </span> </td> <!-- BEGIN switch_logo_right --> <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td> <!-- END switch_logo_right --> </tr> </table> <!-- FIN DU CODE DE LA BANNIERE --> </td> <!-- FIN DE MODIF --> <td class="bodyline"> <!-- ICI SE TROUVAIT LE CODE DE LA BANNIERE (et du titre du forum) --> A toi ensuite de faire les ajustements qui s'imposent ! Je te laisse bricoler | | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Oh , c'est exactement ce que je voulais Merci beaucoup pour ton aide Je peux mettre ce sujet en résolu alors ! EDIT : Est-ce qu'il est possible de fixer la bannière ? Je viens de me rendre compte que lorsque je suis sur le forum et que la longueur de la page change , la bannière est au centre de la longueur de la page. Je voudrais qu'elle soit fixer à gauche en fait. | | |
|
| |
'Christa
Lostmindy
Messages : 2856
| Tu veux que l'image reste en haut, tu veux dire ? Ça fait partie des trucs que je veux te voir résoudre seule, potasse un peu le CSS et tu sauras quoi faire, il te suffit juste d'aligner le contenu de la cellule en haut - Indice pour les paresseux:
Il y a une classe banlaterale dans le code que je t'ai donné, et il existe une propriété CSS du nom de vertical-align qui s'applique précisément aux tableaux.
| | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| J'avais déjà utilisé la classe banlaterale dans le CSS mais je n'arrive pas au résultat voulu. J'ai essayé avec vertical-align ( top , middle avec des px ) comme tu l'as dis mais je n'arrive pas à figer la bannière. J'ai essayé position: fixed mais là l'index du forum se retrouve sous la bannière. J'aimerais en fait que la bannière soit à gauche en permanence. Qu'elle ne bouge pas en même temps que l'index comme c'est le cas maintenant. | | |
|
| |
'Christa
Lostmindy
Messages : 2856
| Outch. Ce serait bien de dire clairement les choses dès le départ, ça simplifierait beaucoup notre boulot ^^'
La position fixed est toujours par rapport à la fenêtre du navigateur. Le seul moyen existant pour avoir le comportement que tu souhaites est d'utiliser une image de fond, et de la fixer (il y a cependant un risque d'affichage biscornu selon la résolution d'écran de tes membres), ou de trouver un script JS qui fasse le boulot. A ce niveau, vu que je ne m'y connais pas trop en JS je ne peux pas t'aider. | | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Désolée , dans ma tête c'était clair alors je pensais que ça l'était également dans mes messages Si je comprends bien , c'pas impossible mais trop compliqué pour moi J'attends un peu de voir si d'autres ont une solution quand même & si rien , je mettrais en résolu. & Je vais aussi aller faire un tour sur le forum de Forumactif. EDIT : & vu que je suis une ingrate , j'ai pas dis merci. Merci pour ton aide | | |
|
| |
iowan
{ Membre actif }
Messages : 304
| comme la dit 'Christa il ya une possibilité de passer par un script js vu que vous avez mis une structure de table donc la position:fixed va pas marcher (ca va mettre une collision des td) bon passons, j'ai créer pour toi un petit script qui permet de faire cela j’espère qu'il marche avec ton forum le voila: - Code:
-
<script type="text/javascript"> $(function(){ $('#i_logo, span.gen').css({ position: 'relative', 'z-index' : -1 });
$(window).scroll(function(){ var wpos = $(this).scrollTop(); $('#i_logo, span.gen').css('top', wpos); }); }); </script>
a le mettre dans le template overal_header avant la balise - Code:
-
</head> n'oublie pas de publier ton template après les changements | | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Merci d'avoir tenté mais ça ne fonctionne pas. Il y a plusieurs soucis : - Le bannière n'est plus du tout cliquable.
- Sur l'index elle a exactement la place que j'aimerais qu'elle ai , il n'y a pas de problème.
- Quand j'entre sur le premier forum , ça à l'air bon aussi.
- Mais quand j'ouvre le sujet ( Message 5 ) , il n'y a plus de bannière & le forum descend sans jamais vraiment s'arrêter. Je sais pas trop comment dire ça ^^ le mieux c'est d'aller voir : http://brouillon.forumactif.fr/t8-message-5
EDIT Sur forumactif on m'a proposé deux choses : - Adapter un fond à la résolution des visiteurs avec du JS
- &
- Citation :
- Pour ma part impossible car tu as travaillé avec une table. Avec un DIV ca n'aurait pas posé de problèmes, surtout que sa hauteur est connue pour ajuster le reste du forum.
Donc a part une refonte du code pour avoir le header en DIV hors de la table, je ne vois pas trop comment faire, désolé.
Le plus simple serait peut-être de tenter le fond qui s'adapte à toutes les résolutions & placer un bouton index fixe ( du même type que ceux qui mène au haut du forum & au bas ). | | |
|
| |
iowan
{ Membre actif }
Messages : 304
| remplace le code que j'ai donné avec cela - Code:
-
<script type="text/javascript">
var ipos; $(function(){ ipos = ( $('#i_logo').position().top - $('.navi2').css('z-index', 1).height() ) * -1; $('#i_logo, span.gen').css({ position: 'relative', 'z-index' : 0, top: ipos });
$(window).scroll(function(){ var wpos = $(this).scrollTop() + ipos; $('#i_logo, span.gen').css('top', wpos); }); }); </script>
| | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Le header ne bouge plus du tout maintenant mais j'ai d'autres soucis. - J'ai toujours l'effet de la page qui descend sans fin.
- & Quand je veux poster un message , y'a plusieurs trucs qui déconne complètement. je sais pas trop expliquer là. Y'a le cadre où on écrit nos messages qui est fixé aussi en fait.
Est-ce que tu peux voir via ce lien ? Sinon j'ai ouvert le premier forum aux invités EDIT : Je viens de ma rendre compte que le premier soucis n'est visible qu'en étant co au forum. | | |
|
| |
iowan
{ Membre actif }
Messages : 304
| pour le 2eme voila - Code:
-
<script type="text/javascript">
var ipos; $(function(){ ipos = ( $('#i_logo').position().top - $('.navi2').css('z-index', 1).height() ) * -1; $('#i_logo, .banlaterale span.gen').css({ position: 'relative', 'z-index' : 0, top: ipos });
$(window).scroll(function(){ var wpos = $(this).scrollTop() + ipos; $('#i_logo, .banlaterale span.gen').css('top', wpos); }); }); </script>
pour le 1er j'ai rien vu d'anormal :S | | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Oh ba , le problème du forum qui descend sans fin à disparu aussi ^^ J'avais édité pour dire que ça ne le faisait que quand j'étais connectée au forum Y'a juste un petit truc encore ( oué j'suis une chieuse ). Certains sont décalés par rapport aux autres quand on poste un message. ( Les boutons pour insérer une image & cie ) : http://brouillon.forumactif.fr/post?t=8&mode=reply | | |
|
| |
iowan
{ Membre actif }
Messages : 304
| ajoute ce code css - Code:
-
.button2{ float: none !important; height: inherit !important; margin-top: 5px; }
| | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Ca marche nickel Vous allez me détester Par contre, j'ai un dernier soucis mais je ne sais pas si ça vient de tout ce qu'on a fait là. Je n'arrive pas à poster une feuille de lien. J'ai pourtant bien activé le HTLM dans mon panneau de configuration. J'ai vu ensuite que la case Désactiver le HTML dans ce message était cochée en écrivant mon message et je l'ai donc décoché. Mais à chaque fois que je clique sur envoyer , je ne vois pas ma fiche de lien mais tous les codes. Je vais donc éditer mais la case Désactiver le HTML dans ce message est de nouveau cochée. Pas moyen de la décocher. http://brouillon.forumactif.fr/t8p5-message-5#14 | | |
|
| |
iowan
{ Membre actif }
Messages : 304
| le html marche parfaitement sur ton forum http://brouillon.forumactif.fr/t9-azed#17 c'a n'a rien en rapport avec le code que je t'ai donné ce code ne touche pas au fonctionnalité de forum notamment le html | | |
|
| |
.Lou
{ Membre actif }
Messages : 771
| Ca marche chez toi ? Ca vient de chez moi alors ! Je vois tout comme si la balise code avait été mise. Quand j'écris un message la case Désactiver le HTML dans ce message est activé donc je la décoche. Je vois bien ma fiche de lien quand je prévisualise mais une fois le message envoyé , je vois tous les codes. Toi tu vois la fiche de lien qu'il y a dans la sujet Message 5 ? EDIT Je viens de me déconnecter & une fois déconnectée , je vois bien la fiche de lien. C'est bizarre ça ! Ca fait comme pour l'index qui descend sans fin. Ca ne le faisait que quand j'étais déconnectée. RE-EDIT : Je viens de créer un compte test & sur ce compte ça marche. Le problème vient de mon compte de fondatrice Je vais peut-être arrêter de poster sur ce sujet pour ne pas le polluer Merci beaucoup pour ton aide en tous cas RE-RE-Edit : Je mets ce sujet en résolu ! Merci encore | | |
|
| |
Psycho
Psychopathe
Messages : 3407
| Hello (: Ça en fait des éditions ! En tout cas, si le sujet est résolu : j'archive ! Merci de l'avoir signalé | | |
|
| |
Contenu sponsorisé
| |
| |
| Header du forum sur le côté , possible ? (Résolu) | |
|