Amikor a menüpont csak legördít

Biztosan találkoztál már olyan egyoldalas weblapokkal, amelyeknek a tetején ugyan vannak menüpontok, de ha rákattintasz valamelyikre, akkor a böngésző nem nyit új lapot, hanem lejjebb gördít az oldalon belül. Sablontól függő, hogy pontosan hogyan, de mindenképpen látványos és modern megoldás. Ha véletlenül még nem tudtad volna, hogy hogy kell ilyet csinálni, akkor ez most elmúlik 🙂

Egy cseppnyi kódolás lesz benne, de ne ijedj meg, minimális. Mindössze két dolgot kell megjegyezned. Az egyik az, ahonnan “ugrasztod” a látogatót, a másik az, ahová.

Kezdjük a másodikkal.

Ezt horgonynak is szokás hívni, és így néz ki a kódja:

Ha valamilyen page buildert használsz, akkor egy kód modulba teheted be a fentit (Divivel mutatom):

Legördítő menüpont horgonnyal

(Ha arra gondolsz, hogy jóval feljebb van a horgony, mint a tematika maga, akkor jól látod: érdemes mindig egy kicsit feljebb tenni, hogy az előző részekből is látszódjon valami, amikor odagördít az olvasó.)

És a fenti kódot kell bemásolnod ide:

Legördítő menüpont horgonnyal

 

A menüpontnál pedig az lesz a trükk, hogy Saját hivatkozást kell használnod, így:

Legördítő menüpont horgonnyal

 

Egyébként ha Divi a sablonod, akkor van egy olyan modulod, a “Teljes szélességű fejléc”, amelyen elhelyezhetsz két gombot, amelyek afféle menüpontként működnek, és persze ide is beteheted ezeket az oldalon belüli ugrásokat:

Legördítő menüpont horgonnyal

 

Megjegyzés:
Ha esetleg mostanában vennél Divi vagy más Elegant Themes sablont, akkor javaslom, hogy várj még néhány napot.
(Ha szemfüles vagy, az oldalsávban már észrevehetted a Kiemelt ajánlatot… de pár napig még türelmesnek kell lenned.)
Fogok szólni időben! 🙂

 

 

Oszd meg Te is:

Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn

Ezek is érdekesek lehetnek számodra: 

Ne maradj le semmiről, iratkozz fel hírlevelünkre!

Javasolt eszközök:

Banner250x250.png
Elementor Pro
Generatepress Logo White Asset
GeneratePress
Divi 4.0
Divihello
Prémium támogatás és ajándék Divi licence
Adatvedelem.png
ADATVÉDELEM minta
Aszf.png
Webshop ÁSZF minta

Szólj hozzá!

Ez a weboldal az Akismet szolgáltatását használja a spam kiszűrésére. Tudjunk meg többet arról, hogyan dolgozzák fel a hozzászólásunk adatait..