avatar
Sexe : Féminin
Date d'inscription : 23/04/2012
Messages : 649
Accro au forum
Voir le profil de l'utilisateur
# Header : Largeur adapté le Dim 11 Jan 2015 - 12:30

Header de fond à largeur adaptée + fond image

Créé par: Mini BN | Validé par: Gaki. | Difficulté: Moyen | Navigateur(s): testé sous Chrome & IE | Version: PhpBB2.


Rendu


Spoiler:
http://mini-bn.forumactif.org/
Voici un forum avec cette astuce installée.

Présentation du tutoriel


Il y a déjà deux tutoriels à propos des header, cependant en les épluchant, j'ai pu voir qu'aucun des deux n'intégrait les éléments suivants : la largeur de la bannière automatique et la possibilité de mettre un fond "image" en plus.
La largeur automatique de la bannière permet à tous vos utilisateurs de voir la bannière entière et correctement : pas de bords coupés, pas de blanc à droite... Car une bannière de fond, c'est bien beau, mais elle n'a qu'une seule taille : un utilisateur avec une résolution d'écran de 1200px de large ne verra pas la même chose qu'un utilisateur avec 1400px de résolution... Du moins, si vous ne faites rien ! ^^
Ensuite, cette astuce n'utilisant pas la case "Fond de forum" dans la gestion de vos images, vous allez pouvoir également mettre un fond de forum derrière votre header. Le header va donc descendre avec la page et laisser place à votre image de fond.
Mais vous avez bien du remarquer tout cela sur le forum donné en exemple. :D

Explications





Et en espérant que ce tutoriel vous aura satisfaits ! :D


Un petit merci rendra les explications visibles !
Si vous avez une question sur ce tuto, cette section est disponible.
avatar
Sexe : Féminin
Date d'inscription : 12/05/2013
Messages : 1367
Very Important People
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Lun 19 Jan 2015 - 22:27
Bonsoir à toi !
Je viens de tester ton tutoriel, il marche parfaitement ! Il est très pratique :3
Merci du partage, je valide !
avatar
Sexe : Féminin
Date d'inscription : 25/03/2014
Messages : 641
Accro au forum
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Mar 20 Jan 2015 - 21:15
Merci !
avatar
Sexe : Féminin
Date d'inscription : 16/10/2014
Messages : 15
# Re: Header : Largeur adapté le Jeu 22 Jan 2015 - 22:39
Merci du partage! :D
Tu me sauverais sans doute la mise! *o*
avatar
Sexe : Féminin
Date d'inscription : 09/06/2013
Messages : 1433
Member One
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Ven 23 Jan 2015 - 11:05
Merci à toi :-)

Cela dit, cela signifie obligatoirement que l'on doive modifier notre header dans les templates ??? ♥️

Est-ce qu'un simple width: 100% dans le css à un endroit bien défini n'aurait pas suffit ? :)
avatar
Sexe : Féminin
Date d'inscription : 23/04/2012
Messages : 649
Accro au forum
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Sam 31 Jan 2015 - 19:20
Je pense que si tu te contentais d'un simple 100% dans le CSS, ta bannière ferait effectivement toute la largeur de l'écran, mais emporterait avec elle l'intégralité du forum (dans le sens où si la bannière est "à l'intérieur", et bien elle indurait également la largeur du forum).
Ensuite, tu pourrais effectivement te contenter d'un simple width pour le fond de forum, mais à ce moment-là tu ne pourrais pas avoir bannière + fond image.

Toutefois, si tu as une solution plus simple sans toucher aux Templates, je serais intéressée de la voir. :D
avatar
Sexe : Féminin
Date d'inscription : 09/06/2013
Messages : 1433
Member One
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Sam 31 Jan 2015 - 20:12
Coucou Mini BN :) ♥️
Merci pour ces informations supplémentaires, et bien je ne sais pas te dire pour ma part je ne suis pas codeuse du tout ! :-) ♥️ Mais je me suis toujours posée la question et j'avais vu la réflexion du 100% dans le css :-) Du coup je me demandais un peu :-) ♥️

Merci en tout cas pour tes précisions :-)
avatar
Sexe : Féminin
Date d'inscription : 25/04/2013
Messages : 73
Newbie
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Dim 1 Fév 2015 - 18:19
Merci
avatar
Invité
Invité
# Re: Header : Largeur adapté le Dim 1 Fév 2015 - 18:27
MERCI
avatar
Sexe : Féminin
Date d'inscription : 10/10/2012
Messages : 72
Newbie
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Jeu 5 Mar 2015 - 16:21
Je vais essayer ça, merci beaucoup- ♥
avatar
Sexe : Féminin
Date d'inscription : 22/12/2014
Messages : 250
Fidèle au poste !
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Ven 13 Mar 2015 - 20:30
Merci je cherchais justement ça :)
avatar
Sexe : Féminin
Date d'inscription : 24/08/2013
Messages : 818
Ancien.ne du Staff
Voir le profil de l'utilisateurhttp://mythologie-amis.forumactif.org
# Re: Header : Largeur adapté le Jeu 26 Mar 2015 - 14:07
merchi
avatar
Sexe : Féminin
Date d'inscription : 05/10/2012
Messages : 39
Newbie
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Mar 28 Avr 2015 - 18:04
merci!
avatar
Sexe : Féminin
Date d'inscription : 08/05/2014
Messages : 66
# Re: Header : Largeur adapté le Ven 1 Mai 2015 - 14:44
Merci, c'est super pratique!
avatar
Sexe : Masculin
Date d'inscription : 14/10/2013
Messages : 191
Membre timide
Voir le profil de l'utilisateurhttp://ushinasei.forumactif.org/
# Re: Header : Largeur adapté le Sam 2 Mai 2015 - 18:06
merci ! c:
avatar
Sexe : Féminin
Date d'inscription : 10/07/2014
Messages : 304
Fidèle au poste !
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Ven 8 Mai 2015 - 20:18
Merci
avatar
Invité
Invité
# Re: Header : Largeur adapté le Ven 10 Juil 2015 - 0:36
Merciii
avatar
Sexe : Féminin
Date d'inscription : 12/07/2014
Messages : 21
# Re: Header : Largeur adapté le Ven 10 Juil 2015 - 12:25
Merci du partage
avatar
Sexe : Féminin
Date d'inscription : 11/09/2013
Messages : 267
Fidèle au poste !
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Dim 12 Juil 2015 - 9:17
Merci ^3^
avatar
Sexe : Féminin
Date d'inscription : 03/07/2015
Messages : 10
Newbie
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Mer 29 Juil 2015 - 9:48
Merci :3
avatar
Invité
Invité
# Re: Header : Largeur adapté le Jeu 30 Juil 2015 - 22:20
Merci pour les explications ;)
avatar
Sexe : Féminin
Date d'inscription : 20/10/2014
Messages : 92
Newbie
Voir le profil de l'utilisateur
# Re: Header : Largeur adapté le Mer 5 Aoû 2015 - 12:36
Merci pour ce magnifique partage
avatar
Sexe : Féminin
Date d'inscription : 08/02/2015
Messages : 230
Membre timide
Voir le profil de l'utilisateurhttp://lgdc-origine.forumactif.org/
# Re: Header : Largeur adapté le Jeu 6 Aoû 2015 - 18:59
Merci
avatar
Sexe : Féminin
Date d'inscription : 28/12/2012
Messages : 133
Membre timide
Voir le profil de l'utilisateurhttp://www.four--seasons.com/
# Re: Header : Largeur adapté le Mar 11 Aoû 2015 - 14:27
Merci :D
avatar
Sexe : Féminin
Date d'inscription : 16/08/2015
Messages : 13
# Re: Header : Largeur adapté le Mar 18 Aoû 2015 - 14:22
Merci beaucoup ! :3
Contenu sponsorisé
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum