Jump to content

Comment modifier la forme du footer?


Recommended Posts

Bonjour

je te conseille de regarder tout simplement avec firbug comment sont fait les arrondis de ce forum, ou du thème par défaut de presta.
Et d'appliquer la même méthode.

Les arrondis sont fait avec des images mises en background des blocks.
Il y a plusieurs situations selon si le bloc en question a une taille fixe en px ou variable(ce qui peut devenir assez compliqué à gérer)

pa.

Share this post


Link to post
Share on other sites

Bonsoir Peha,

Merci pour ta réponse, voilà ce que j'aimerai pouvoir modifier (pièce jointe)
La taille du footer est fixe, mais la page change de taille selon le nombre de produits.
Je vais déjà regarder avec Firebug ce forum.
Si il y avait possibilité d'avoir le code et l'endroit à modifier (là j'utilise le module de SOtew, mais si il est impeccable pour le haut, le footer n'est pas intégralement couvert par l'image (j'ai une bordure basse et sur les côtés impossible pour moi à réduire à 0.
Sur l'image jointe: GRIS=background BLANC=bordures de ma page, ROUGE= image du footer insérée via le module footer de SOTew
Ce que je souhaiterai: que le rouge remplace le blanc du footer.
Cordialement,
Mandrake.

9672_OAkpzcHWQZ1RgEurxTbG_t

Share this post


Link to post
Share on other sites

Bonjour Peha,
Je te remercie pour ton assistance, j'ai testé ton code mais l'image n'apparaît pas, et le fond blanc de ma page disparaît au profit du background gris du site.
Merci pour le lien, je connaissais déjà le site, c'est toujours intéressant de s'y rendre pour améliorer ses connaissances.
Là je suis en stand-by pour ce fameux footer qui décidemment me pose un gros problème esthétique.
Bon week-end.
Cordialement,
Mandrake.

Share this post


Link to post
Share on other sites

c’est toujours intéressant de s’y rendre pour améliorer ses connaissances.

Oui, et ces connaissances devraient surtout t'aider à résoudre ton problème.

Si l'image ne s'affiche pas, c'est sûrement à cause d'une mauvaise url de l'image (l'as tu mises dans un dossier img ? dans ce cas c'est 'img/ton_image.jpg') - regarde dans le thème par défaut comment (ou il y a beaucoup d'arrondis).
Tu peux mettre un fond de couleur en plus de l'image :

#footer{
background-image : url('...');
background-color : #XXX
}

Share this post


Link to post
Share on other sites

Bonsoir Peha,
Au risque de passer pour un beubeu, j'ai essayé mais cela ne fonctionne pas plus...
Je te précise que le module de SotEW est nécessaire pour mon haut de page, donc ma question est de savoir si c'est le module qui bloque ma manip ou est-ce moi qui ne corrige pas correctement le global.css....
En tout cas sympa à toi de m'avoir aiguillé!
Cordialement,
Mandrake.

Share this post


Link to post
Share on other sites

Bonsoir minirj01,

Tu te doutes que c'est par là que j'ai commencé...

1)l'image rouge se décale vers la droite plus on l'élargit.
2) La marge blanche du bas reste telle quel...

Quel dommage d'être un magicien de renommée internationale et de ne même pas pouvoir placer une image correctement dans un css...

Share this post


Link to post
Share on other sites

Oui je m'en doutais : ) Pour placer l'image utilise le module cité (qui ne bloque aucune manip de mon coté), ensuite fais des corrections via firebug.
Avec une url ce serait + simple de t'aider.

Share this post


Link to post
Share on other sites

Bonjour,

J'ai tenté tout ce que je pouvais avec Firebug, mais c'est un flop...
Voici ce que cela donne quand l'image à placer en lieu et place du footer ( image en rouge insérée avec SotEW) est aux mêmes dimensions que le header (qui lui est placé parfaitement avec le module de SotEW)
Comme d'habitude, celui qui trouve la bonne manip aura droit au filet garni par la poste...
Je précise que le rectangle indiqué "haut de page" porte ce nom à cause du fait que c'est le calibre qui a servi au header de ma page.
Ci-joint 2 captures.
Cordialement,
Mandrake.

9694_rS9qM9Z1eGjzQblV3VwK_t

9696_9nbMNsp9QCMlr9XugHmk_t

Share this post


Link to post
Share on other sites

Salut, bien reçu.

La perturbation vient de la modification faite en ligne 185.
Supprime cette ligne.

Ensuite ligne 203:
- Ajoute un: " padding-left: 12px "
- Indique un: " padding-right: 6px " (ou bien indique: " 992px; " en ligne 183)

Ensuite ligne 212:
- Ajoute un: " padding-left: 12px "
- Indique un: " padding-right: 6px " (ou bien indique: " 992px " en ligne 183)

Ensuite entre lignes 857 et 858 ajoute une ligne:
" background: #red url(../img/titre_de_l'image.jpg) no-repeat scroll center top; "

Voilà qui réglera le décalage.
@+

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More