Comment faire pour que mon logo fasse la largeur de ma page

[Caticat]

Bonjour,


C'est mon premier message ici. J'espère que j’ai posté dans la bonne catégorie.
J'aimerais savoir s'il est possible que mon logo (la bande grise pour le moment) face la largeur de ma page sans bouger le reste. C'est à dire que j'avais essayer de mettre mon logo sur la page entière en largeur mais du coup mes catégories suivaient prenaient toute la page aussi. J'espère que je me suis bien faite comprendre c'est pas évident d'expliquer.

Merci,

http://tempora-heroica.forumactif.org/forum

[Anzu]

Bonjour et Bienvenue sur le Forum des Forums ForumActif Vu que vous êtes nouveau, voici quelques sujets importants : Sécurité : Mail de fondation - Ce qu'il ne faut pas faire Listing - Questions/Réponses fréquentes Listing - Trucs et astuces La fonction Rechercher La FAQ de Forumactif.com N'hésitez pas à ouvrir un nouveau sujet si vous ne trouvez pas votre réponse

Bonsoir,

Je pense avoir saisi, on verra bien
Pour commencer, avez vous une css modifiée ? Si oui, pourrais-je avoir le code ?
Si vous voulez que le header soit aligné au reste du forum, il suffit de mettre la même largeur pour le header et pour celle du forum.
Votre header fait 1000px en largeur. Si votre feuille css est vide, rajoutez ce code:

Code:

.bodylinewidth {
    width: 1000px;
}

Cordialement.

[Caticat]

Oulala, je suis novice dans la création de forum . Je me débrouille et bricole mais les termes ccs et header...ne me disent pas grand chose.

Je n'ai rien changer ou modifier donc non je ne dois pas avoir de ccs modifiée.

[Anzu]

Header: bannière/logo si vous préférez.

La feuille css c'est ce qui permet de modifier "l'habillage" du forum pour faire simple.

Donc dans votre PA (panneau d'administration) > Affichage > Images et couleurs > Couleurs > Onglet "feuille css". Vous aurez normalement un champ vide. Vous collez le code donné plus haut:

Code:

        .bodylinewidth {
            width: 1000px;
        }

Et vous enregistrez.

Cordialement.

[Caticat]

Merci pour les précisions. Cependant, ce n'est pas ce que je veux. Je ne veux pas que le logo soit aligné au reste du forum. Je l'avais déjà fais auparavant. En fait, j'aurai voulu que le reste du forum ne bouge pas tel qu'il est maintenant. Mais que uniquement le logo face la largeur du forum. Est ce possible ?

Merci

[Anzu]

Vous voulez le header en fond du forum en fait ?
Comme sur l'exemple de ce tuto?

Cordialement.

[Caticat]

Ha oui, c'est bien ça. Je ne voyais pas la chose comme ça mais oui c'est ça. Je regarderai tout cela demain et vous tiendrais au courant si j'ai réussis.

Merci beaucoup pour votre rapidité.

[Caticat]

J'ai réussis à faire la manip mais du coup il faut que la couleur du fond de page soit en couleur et non une image donc en fait j'abandonne l'idée. Merci en tout cas

[Anzu]

Bonjour,

Si si c'est tout à fait possible de mettre le header en fond + une image de fond.

Cordialement.

[Caticat]

Ha bon c'est vrai ! Mon header n'est pas définitif mais d'ici que je le fasse pourriez vous me dire la marche à suivre ?

[Anzu]

Pour l'un de mes forums, j'avais mis jusqu'à 4 images ^^
Utilisez ce code:

Code:

body {
background: url('lien de l'image') no-repeat top center, url('lien de l'image') repeat-y top left;


NB: pour la position de l'image, c'est juste à titre d'exemple.

Et un background color si c'est nécessaire:

Code:


background-color: #code couleur;
}

Cordialement.

[Caticat]

Ho merci beaucoup ! Pourriez vous s'il vous plait détaillé un peu les explications car je débute avec les codes pour ccs. en vert c'est là ou je dois mettre mon code image ?

[Anzu]

Ne vous fiez pas trop à la couleur mais plutôt au texte.
Dans les parenthèses, j'ai mis 'lien de l'image', donc vous remplacez par l'url de l'image (votre header par exemple) tout en gardant les guillemets: Ex: 'http://blabla'

Pour le reste, c'est pour positionner votre image:

Code:

background: url('lien de l'image') no-repeat top center,

Donc par exemple ici, le no repeat indique que l'image ne se répète pas, le "top" c'est pour dire "haut" et "center" > centré.
=> L'image ne se répète pas et sera placée en haut du forum tout en étant centrée.
NB: Il y a toutes sortes de tuto/cours de css sur le net qui pourront vous aider si vous souhaitez apprendre =>

Si vous avez suivi le tuto c'est déjà bien, plus qu'à mettre le code css

Si vous n'y arrivez pas, il me faudrait le lien du forum concerné, les codes utilisés et les liens des images que vous voulez mettre en fond.

Cordialement.

[Caticat]

Je commence à bien comprendre le principe. Il suffit de savoir les "valeurs" et de les ajouter. Cependant, je n’ai pas réussis à appliquer votre code. Je fais mes premiers pas de le monde des codes alors désolé si je ne comprends pas de suite.

Voici le lien de mon forum : http://tempora-heroica.forumactif.org/forum

Le lien de mon image du fond de page : https://i.servimg.com/u/f14/18/07/19/48/2210.jpg

Le lien de mon logo actuel (pas définitif) (qui ne fait par la largeur de page) : https://i.servimg.com/u/f14/18/07/19/48/copie_10.jpg

Le lien de mon logo qui fait la largeur de la page : https://i.servimg.com/u/f14/18/07/19/48/copie_22.jpg

Le problème si je mets le logo qui fait la largeur de page, mon tableau de forum s'élargit immédiatement et je ne le veux pas. J'espère avoir tout dit.

Je souhaite donc avec mon logo en fond de page en haut accompagner de mon image de fond de page. Et que mon tableau ne s'élargisse pas en même temps que le logo.

[Anzu]

Voilà le résultat sur mon forum test:
Dites moi si cela vous convient

Cordialement.

[Caticat]

OUI Oui ! C'est tout à fait ça !
Une fois que j'aurai faite ma bannière je n'aurai qu'a remplacer l'url et le tour est joué.

[Anzu]

Dans Affichage > Images et couleurs > Gestion des images > Mode avancé > vous retirez l'url de l'image pour le logo. (le champ doit donc être vide).

Ensuite, dans Affichage > Templates > Général > Overall header > Repérez cette ligne:

Code:

 <table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">

Et placez un certain nombre de retours à la ligne juste après (qui permettront de "descendre" le forum. Comme ceci:

Code:

 <table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center"><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><tr>

Enregistrez et publiez le template

Ensuite dans la css:

Code:

body {
background: url('http://i14.servimg.com/u/f14/18/07/19/48/copie_22.jpg') no-repeat top center, url('http://i14.servimg.com/u/f14/18/07/19/48/2210.jpg') repeat;
}

Cela devrait être bon ^^

Cordialement.

[Caticat]

J'ai réussis du premier coup ! Super je suis trop contente ! Merci beaucoup pour votre patiente et votre efficacité. Et je vais regarder de plus près le site dont vous m'avez donner le lien pour "css débutant" car c'est très intéressant tout ça. J'aime bien comprendre ce que je fais. Merci encore. Mon sujet et résolu.