Mettre un pied de page (footer) fixe

Statut : non résolu

Ce sujet contient 38 réponses, 6 participants et a été mis à jour pour la dernière fois par elisephoto, le il y a 5 années et 8 mois.

15 sujets de 1 à 15 (sur un total de 39)

1 2 3 →

Auteur
Messages
29 février 2012 à 8 h 26 min #506364
elisephoto
Participant
Initié WordPress
23 contributions
Bonjour,
Ma configuration WP actuelle
– Version de WordPress : wp 3.3.1
– Version de PHP/MySQL :
– Thème utilisé : melville (minimaliste)
– Extensions en place :
– Nom de l’hebergeur : 1&1
– Adresse du site : http://www.elisephotographe.com
Problème(s) rencontré(s) :
Bonjour,
J’essaie de faire en sorte que mon menu reste fixe en bas de la page et que mes articles puisses défiler sans que le menu bouge.
Pouvez-vous me dire si c’est possible? Et ce que je dois faire pour cela?
J’ai fait pas mal de recherches sur le net mais je ne sais pas comment l’implanter dans mon thème, voici ce que j’ai trouvé : http://yidille.free.fr/plux/valign/?9-pied-en-bas-de-fenetre.
ou celui la: http://css-tricks.com/snippets/jquery/jquery-sticky-footer/
Merci pour votre aide
2 mars 2012 à 16 h 47 min #819925
elisephoto
Participant
Initié WordPress
23 contributions
Personne pour m’aider?
2 mars 2012 à 19 h 25 min #819926
ombres-et-lumieres
Membre
Chevalier WordPress
147 contributions
rien de plus simple: dans les fichiers du thème wordpress se trouve un fichier footer.php qui contient toutes les “instructions” du footer.
Il suffit donc de l’ intégrer dans chaque page du site via l’ instruction php”: get_footer()
2 mars 2012 à 20 h 48 min #819927
Web4Space
Membre
Chevalier WordPress
278 contributions
Bonjour,
Vous souhaitez que le footer soit fixe au site, ou à l’écran ?
2 mars 2012 à 21 h 13 min #819928
elisephoto
Participant
Initié WordPress
23 contributions
Bonsoir,
Je voudrais que, quand les gens viennent sur mon site les article défile avec l’ascenseur mais le footer reste toujours visible en bas, les articles passent en “dessous” du footer.
3 mars 2012 à 14 h 35 min #819924
Web4Space
Membre
Chevalier WordPress
278 contributions
Alors, le site en question est bien http://elisephotographe.com/ ?
Si, effectuer les opérations suivante:
-Ouvrez le fichier style.css via WordPress (onglet Apparence, Éditeur), ou avec un logiciel FTP (comme FileZilla, répertoire: wp-content/themes/melville/style.css),
-Cherchez le style #menu
#menu {
width:1160px;
margin: 0 auto;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
-moz-box-shadow: 1px 4 20px #dddddd;
-webkit-box-shadow: 1px 4 20px #dddddd;
box-shadow: 1px 4 20px #dddddd;
}
-Remplacez la avec le code suivant:
#menu {
width:100%;
margin: 0 auto;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
-moz-box-shadow: 1px 4px 20px #dddddd;
-webkit-box-shadow: 1px 4px 20px #dddddd;
box-shadow: 1px 4px 20px #dddddd;
position:fixed;
bottom:0;
}
-Enregistrer, et voila
3 mars 2012 à 16 h 25 min #819929
elisephoto
Participant
Initié WordPress
23 contributions
Bonjour,
Merci infiniment car cela fonctionne à merveille. Juste besoin d’un dernier coup de main car je souhaiterais retrouver mes marges du menu originale mes 1160px mais “centrer”.
Elise
4 mars 2012 à 19 h 57 min #819930
Web4Space
Membre
Chevalier WordPress
278 contributions
Vous souhaitez que la barre grise ne fasse pas tout l’écran, juste 1160px, et centrer ?
4 mars 2012 à 19 h 58 min #819931
elisephoto
Participant
Initié WordPress
23 contributions
oui la le menu prend toute la page en longueur alors que je souhaiterai qu’il soit juste niveau de la page blanche et qu’il n’aille pas sur le “rose”
🙂
4 mars 2012 à 22 h 13 min #819933
christofes
Participant
Chevalier WordPress
103 contributions
Pour ton petit souci, il faut remette width :1160px; au lieu de width: 100%;
Pour centrer ton footer, tu ajoute text-align: center;
```
#menu {
width:1160px;
margin: 0 auto;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
-moz-box-shadow: 1px 4px 20px #dddddd;
-webkit-box-shadow: 1px 4px 20px #dddddd;
box-shadow: 1px 4px 20px #dddddd;
position:fixed;
bottom:0;
text-align: center;
}
```
4 mars 2012 à 23 h 13 min #819932
elisephoto
Participant
Initié WordPress
23 contributions
Bonsoir,
Cela ne fonctionne pas. Visuellement j’ai la barre qui va sur la gauche et qui n’est donc pas centrée. J’ai essaye pas mal de possibilité je ne vois pas ce que je peux modifier
5 mars 2012 à 6 h 26 min #819934
Web4Space
Membre
Chevalier WordPress
278 contributions
Je vous dit le code a mettre ce soir
5 mars 2012 à 10 h 28 min #819935
christofes
Participant
Chevalier WordPress
103 contributions
bonjour
je viens de regarder ton CSS, tu as une id=”menu” et juste en dessous une class=”menu-footer”, 1ere solution déplacer le text-align dans menu-footer ou 2eme solution aligner menu et menu-footer
1ere solution
```
#menu {
	width: 1160px;	
	margin:0  auto;
	border-right: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	-moz-box-shadow: 1px 4 20px #dddddd;
	-webkit-box-shadow: 1px 4 20px #dddddd;
	box-shadow: 1px 4 20px #dddddd;
                position: fixed;
                bottom: 0;    
}


#menu div.menu, #menu div.menu-footer {
	background-color: #777;	
	border-bottom-style: double; 
	border-bottom-color: #777; 
	border-bottom-width: 0px;
	border-top-style: double; 
	border-top-color: #777; 
	border-top-width: 0px;
	text-align: center;
}
```
2eme solution
```
#menu, #menu div.menu-footer {							
	margin-left: auto;					
	margin-right: auto;
}

#menu {
	width: 1160px;	
	border-right: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	-moz-box-shadow: 1px 4 20px #dddddd;
	-webkit-box-shadow: 1px 4 20px #dddddd;
	box-shadow: 1px 4 20px #dddddd;
                position: fixed;
                bottom: 0;
}

#menu div.menu, #menu div.menu-footer {
	background-color: #777;	
	border-bottom-style: double; 
	border-bottom-color: #777; 
	border-bottom-width: 0px;
	border-top-style: double; 
	border-top-color: #777; 
	border-top-width: 0px;
}
```
5 mars 2012 à 20 h 01 min #819937
christofes
Participant
Chevalier WordPress
103 contributions
Bonsoir
Je viens de m’apercevoir qu’il manquait le px après le 4, je viens de faire les corrections.
1ere solution
```
#menu {
width: 1160px;    
margin: 0px  auto;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
-moz-box-shadow: 1px 4px 20px #dddddd;
-webkit-box-shadow: 1px 4px 20px #dddddd;
box-shadow: 1px 4px 20px #dddddd;
position: fixed;
bottom: 0px;    
}

#menu div.menu, #menu div.menu-footer {
background-color: #777;    
border-bottom-style: double; 
border-bottom-color: #777; 
border-bottom-width: 0px;
border-top-style: double; 
border-top-color: #777; 
border-top-width: 0px;
text-align: center;
}
```
2eme solution
```
#menu, #menu div.menu-footer {
margin-left: auto;
margin-right: auto;
}

#menu {
width: 1160px;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
-moz-box-shadow: 1px 4px 20px #dddddd;
-webkit-box-shadow: 1px 4px 20px #dddddd;
box-shadow: 1px 4px 20px #dddddd;
position: fixed;
bottom: 0px;
}

#menu div.menu, #menu div.menu-footer {
background-color: #777;
border-bottom-style: double; 
border-bottom-color: #777; 
border-bottom-width: 0px;
border-top-style: double; 
border-top-color: #777; 
border-top-width: 0px;
}
```
Je suis désolé pour le petite désagrément
5 mars 2012 à 20 h 26 min #819938
Web4Space
Membre
Chevalier WordPress
278 contributions
Bonjour,
Essayez la solution de @christofes pour voir, et si sa marche pas, je vous donnerais un autre code
Auteur
Messages

15 sujets de 1 à 15 (sur un total de 39)

1 2 3 →

Vous devez être connecté pour répondre à ce sujet.