Jump to content

SCROLLSPY avec prestashop [RESOLU]


Recommended Posts

Bonjour,

 

je suis débutante sur Prestashop, actuellement mon site j'ai

1-ma barre de menu principal

2-mon carousel

3-ensuite 3 modules qui contiennent chacun une section:

     -une section  "tennis" avec des vignettes qui correspond a une category du menu principal id="id de la category en question"

     -une section  "padel" avec des vignettes qui correspond a une category du menu principal id="id de la category en question"

     -une section  "golf" avec des vignettes qui correspond a une category du menu principal id="id de la category en question

 

et je voudrais integrer le scroll spy pour que lorsque l'on clic sur la category du menu, la page descende directement sur la section en question.

sur mon menu principal j'ai mis href= #id de la category (donné par prestashop )

et sur les differentes sections j'ai mis les id des categories correspondantes

 

par exemple pour la section golf

<section class="golf section" id="category-6" data-spy="scroll" data-target="#top-menu" data-offset="0">

 

et dans le menu

<ul class="top-menu scrollable-menu"role="menu" {if $depth == 0}id="top-menu"{/if} data-depth="{$depth}">

 

 

mais rien ne marche

le scroll descend de 2cm et c'est tout

quelqu'un aurait une solution??

 

 

Edited by sambystef (see edit history)
Link to comment
Share on other sites

Par contre si ca fonctionne  ca n'aura  pas vraiment d'intérêt car ca ne marchera que si vous êtes sur la page d'accueil de votre site. 

Si par exemple vous êtes sur la page contact de votre site et que vous cliquez sur la catégorie golf il ne se passera rien.

 

Link to comment
Share on other sites

je viens d'essayer et cela ne fonctionne toujours pas..

cependant votre réflexion est judicieuse qu'en au fait que mon menu sera obsolète sur d'autres pages.....

Merci pour cela.

Je cherche toujours une solution pour le scroll spy.

Mon questionnement était , est ce que comme nous sommes sur 2 hooks différents et 2 modules différents, peut être le scrollspy ne fonctionne t-il pas ?

Link to comment
Share on other sites

je me suis inspiré de ce lien pour le mettre en place

https://www.w3schools.com/bootstrap4/bootstrap_scrollspy.asp

alors dans le layout-both-columns.tpl j'ai rajouter sur le <body>:

data-spy="scroll" data-target=".header-nav" data-offset="50"

le .header-nav vient du header.tpl

ensuite sur le ps_mainmenu.tpl; j'ai changer le href des <li> pour href="#{$node.page_identifier}" pour récupéré <id> de chaque <li>

et ensuite dans mon module créé j'ai inséré <id> récupéré dans la <section > qui contient mon code

 

 

je n'ai pas comme toi dans mon menu back office - "module manager"

et je n'ai pas créer de block textcustom - j'ai crée un module a part entière....

section tennis - modulesam_scrolltennis.png

code section tennis.png

1110546669_accueilnavetcarousel.png

Link to comment
Share on other sites

  • sambystef changed the title to SCROLLSPY avec prestashop [RESOLU]

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...