Astuce : Centrer votre menu dans Prestashop 1.6

Voici un petit tuto qui va vous permettre de centrer votre menu dans prestashop

Cette astuce Prestashop est valable pour la version 1.6


Comment centrer le menu sur ma boutique Prestashop ? 

Il y a q’un seul fichier à modifier : superfish-modified.css  qui appartient au module blocktopmenu

1) Dans .sf-menu, ajouter text-align:center

2) Dans .sf-menu > li, remplacer float:left par display: inline-block;

Et voila le resultat :

Capture d’écran 2015-04-13 à 19.31.27

Articles similaires

15% de réduction pour tous les produits de la boutique | Astuce Prestashop 1.6
views 1517
Vous désirez mettre en place une campagne de promotion :  15% de réduction pour tous les produits de la boutique Il est très facile de configurer ce cas de figure dans Prestashop Comment mettre en place cette promotion dans le back-office de Prestashop  ?  A) Connectez-vous au back-office de Prestashop B) Allez dans l'onglet Promotions > Règles Paniers C) Configurer les infor...
Comment créer une fiche Produit sur Prestashop 1.7
views 7956
Dans ce tutoriel, nous allons voir comment créer une fiche produit dans Prestashop 1.7. Comme vous pourrez le constater, cette page diffère totalement de Prestashop 1.6. Elle a été totalement repensée afin de la rendre plus allégée et plus facile d’utilisation. Etant encore en cours de développement, les traductions ne sont pas encore finies et il reste encore des soucis de mise en page. ...
Gratuit : Template Mails | Astuce Prestashop 1.6
views 3152
Je vous propose une nouvelle mise en page plus minimaliste pour les mails. Le fichier comprend la version anglaise et française. Vous pouvez télécharger les templates gratuitement. Cette astuce Prestashop est valable pour la version 1.6 et 1.5 1) Exemple de mails   A noter : - Il est possible de modifier le contenu des mails. Pour cela il faut aller dans Localisation > Traductio...
COMMENT AJOUTER UN TRANSPORTEUR DANS PRESTASHOP 1.6 ?
views 2618
Dans ce tutoriel, nous allons voir comment ajouter et paramétrer un transporteur, afin que vos clients puissent choisir son mode de livraison sur votre site de vente en ligne. Il existe deux manières à ce jour d'ajouter un transporteur dans Prestashop: utiliser un module du transporteur choisi insérer le transporteur soi-même. A) Quel transporteur utilise un module adapté à Prest...
Connaître les modules de la page d’accueil | Astuce Prestashop 1.6
views 16276
Vous avez installé votre boutique Prestashop 1.6 et désirez modifier votre page d'accueil ? Ce petit tuto va vous aider à le faire en indiquant le nom du module que vous devez utiliser pour modifier votre slider, votre menu.... Ils sont facilement accessibles depuis votre back-office PrestaShop en cliquant sur l’onglet « Modules et services ». Si vous désirez aussi modifier le fichier tpl ou cs...

12 réponses à “Astuce : Centrer votre menu dans Prestashop 1.6”

  1. Tirips dit :

    Dommage que personne n’ai laissé de commentaire sur ce tuto qui marche impec… en prenant le bon superfish-modified.css 😉
    (theme/votre thème/css/modules/blocktopmenu/css/superfish-modified.css).

    Merci à toi !

  2. Tipotam dit :

    Merci pour le ti tuto,

    sa marche nickel pour moi.

  3. Valentin dit :

    Bonjour,

    Tuto qui marche niquel sur un ordinateur, mais pour la version mobile, le menu part en vrille.

    Si vous avez une solution ?

    Cordialement

  4. c_majory dit :

    Bonjour,

    Il faut utiliser les media queries

  5. Clemence dit :

    Merci pour le tuto,
    C’est parfait pour le menu, mais cela a impacté mes sous-catégories, qui se retrouvent centrées et le menu devient illisible.
    D’où vient mon erreur ? comment corriger cela?

    merci d’avance 🙂

  6. julien dit :

    super merci beaucoup.

  7. c_majory dit :

    Bonjour,

    Comme ca il est difficile de répondre, il faut que je vois votre code.

  8. roussette dit :

    ligne 164 localhost/prestashop/themes/default-bootstrap/css/modules/blocktopmenu/css/superfish-modified.css
    remetter la même chose: display: inline-block et text-align: center

  9. hajar dit :

    je modifie sur le code mais y a rien changer au mon site j’ai rien compris quelqu’un peut m’aider?

  10. c_majory dit :

    Bonjour,

    si rien ne change, c’est un problème de cache, il faut le nettoyer

  11. herman dit :

    Bonjour,
    super! et merci beaucoup pour le tuto, et -il possible d’afficher en arborescence la listes de mes produits directement dans chaque categories/sous-catégorie du menu ?
    Car pour le moment prestashop peux afficher des produits directement, mais en meme rang que les categories du menu.
    avez vous une solution ?
    merci d’avance

  12. c_majory dit :

    Malheureusement il n’est pas possible de faire ca avec le module par défaut de Prestashop. Vous avez ce module (16$), beaucoup plus poussé. Je ne l’ai pas encore testé mais il semble avoir de bon avis.

    https://codecanyon.net/item/finalmenu-prestashop-menu/8230997?s_rank=1

    Cordialement

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *