Jump to content

Comment réduire l'espace entre header et edito ?


Recommended Posts

Bonjour,

Je possède un espace trop important entre mon header et l'affichage de mon block edito,
cela provoque un grand espace blanc peu agréable,
la pièce jointe vous donnera une petite idée du problème.

La question :

- Comment peut on réduite cet espace ? (quel fichier retoucher, ou, comment)

Merci d'avance

35668_UlQrpMCkC1aUdCFLs8eQ_t

Link to comment
Share on other sites

Bonsoir,

suggestion d'un débutant, à prendre comme telle....

j'ai cru voir dans la vignette un menu horizontal, et on a l'impression que c'est le pavé recherche qui créée ce décalage, comme s'il avait été poussé par un menu horizontal trop plein.

S'il s'agit du pavé lié au menu horizontal, je ne sais pas comment le déplacer (je suppose fichier CSS du menu horizontal, en diminuant la largeur accordé aux rubriques "li..", ou CSS global, rubrique menu horizontal).

mais il serait peut-être plus facile de désactiver en back-office (c'est possible chez celui de Julien Breux) ce pavé de recherche, et de ré-activer le pavé d'origine prestashop, dissocié du menu.

Ce dernier peut, toujours par le back office être greffé en header, ou, si vous souhaitez conserver sa position actuelle, en 1° position colonne gauche: ainsi il ne fera plus épaisseur en bas du header.(BO-modules-position)

Link to comment
Share on other sites

Bonjour Daniel et merci de votre coup de main,

J'ai entre temps creusé la piste du bloc recherche et son remplacement par un bloc plus "traditionnel" donne toujours le meme résultat.

le bloc édito possède une marge "top" trop importante (je ne sais pas si je suis très explicite...) que je ne sais réduire.

Link to comment
Share on other sites

Bonsoir,

désolé de vous recontacter si tard, mais ça y est je tiens la solution.

L'emplacement des zones (haut droit, haut gauche, colonne gauche, bloc centre,colonne droite...) est situé dans le fichier suivant:

votre site /themes/prestashop/css/global

ouvrir le fichier, se rendre dans la partie "/* global layout */.

d'origine, vous y trouverez notamment ceci:

#left_column, #center_column, #right_column { float: left }
#left_column {
clear: left;
width: 0 px;
margin-right: px;
overflow: hidden
}
#center_column {
width: 768px;
margin: 0 0 30px 0;
overflow: hidden
}
#right_column {
width: 191px;
margin-left: 21px;
overflow: hidden
}


il va s'agir de modifier l'emplacement des colonnes droites, gauches, et centre, en rajoutant à chacune le paramètre de "marge en haut" (à moins que dans votre fichier "margin-top" n'ait déjà été rajouté, et qu'il suffise de le régler).
Il est important de noter que plus la marge est faible, plus les blocs remontent, et surtout que pour forcer la montée des zones on peut mettre une marge négative.
Dans votre cas on pourrait imaginer, pour remonter tout de la même hauteur:

#left_column, #center_column, #right_column { float: left }
#left_column {
clear: left;
width: 0 px;
margin-right: px;
margin-top: -30px;
overflow: hidden
}
#center_column {
width: 768px;
margin: 0 0 30px 0;
margin-top: -30px;
overflow: hidden
}
#right_column {
width: 191px;
margin-left: 21px;
margin-top: -30px;
overflow: hidden
}

Voilà, votre texte et vos blocs sont remontés (j'ai testé sur mon serveur c'est OK). Attention quand même à ce que cette remontée ne gêne pas la présentation d'autres pages ! J'espère que ça sera OK pour vous

Link to comment
Share on other sites

Bonjour Daniel,

Merci de votre intervention,
Je jetterais un oeil à tout ça mais la piste me parait bonne,

j'avais déjà modifié le top-margin des colones droite et gauche avec succès,
ne réussissant pas à appliquer la méthode à le colonne centrale, votre aide me sera bien utile,

Joyeux Noel et merci encore.

Link to comment
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
×
×
  • Create New...