WP ET The Source : Hoe laat ik de menubalk meegaan met het scrollen ??

Status
Niet open voor verdere reacties.

unknowuser

Gebruiker
Lid geworden
30 okt 2012
Berichten
63
Hallo mensen van Helpmij.nl

Ik ben bezig met een nieuwe website dat gaat over nieuws,reviews,unboxings van hardware.
Ik heb alles goed voorbereid, dus hosting,domein,thema's gekocht voor Wordpress. Alles verliep voor de rest ook vlot en zonder moeite.
Nu loop ik alleen tegen een kwestie aan toen ik met het thema ging rommelen.
Ik heb namelijk bij ET (Elegant Themes) hun thema-pakket (basis) gekocht en daarvan gebruik ik nu het thema: TheSource.
Bij dat thema is het zo dat de menubalk niet meegaat als je naar beneden scrollt, en de pagina's kunnen behoorlijk opgroeien in de lengte ;).
Het meest irritante ervan is dat je dan niet beneden aan de pagina naar een ander onderwerp kan toegaan en dan weer helemaal naar boven moet, dus ook om gebruik te maken van de zoekfunctie.
Daarom wil ik oplossen door de menubalk naar beneden te laten gaan.
Ik had al een tutorial gevonden, maar die werkt alleen met CSS in een combinatie van Javascript en HTML. De pagina's in Wordpress zijn uiteraard CSS en PHP, dus dat viel af.

Dit is dus mijn vraag: hoe kan je in dat thema de menubalk mee laten gaan, zodat mensen meteen naar hun favoriete pagina's kunnen gaan zonder naar boven te scrollen of een 'back to top-knop'.

groeten,
Kevin D.
 
Hi, ik heb de code gebruikt, maar nu zit me balk linksonderin de website. Hoe kan ik de centeren in het midden en dat hij pas meegaat als ik daarzo ben. Dus dat als ik de pagina open hij gewoon op de normale positie staat, maar zodra ik naar beneden scroll hij dan meegaat naar beneden, maar dan wel aan de bovenkant van je scherm. Zoals dit: http://www.sutanaryan.com/Tutorials/fixed-menu-when-scrolling-page-with-CSS-and-jQuery/
 
Hallo Kevin,

Je hebt gelijk dat WordPress werkt met CSS en PHP. Het is echter niet zo wat je zegt dat HTML en Javascript dan geen optie zijn. Dat is namelijk wel degelijk zo, aangezien de absolute basis van de WordPress themes HTML is en Javascript kun je zien als een soort van invoegtoepassingen.

Wat jij moet doen is deze tutorial gewoon volgen, want hij is vrij eenvoudig.
  • Open via FTP je theme's style.css en voeg gewoon even helemaal op het einde de CSS code toe.
    • Verander de .nav elementen door de class die je theme aan de menu elementen geeft.
    • Nu zoek je in je header.php je menu op, waarschijnlijk deze: <?php wp_nav_menu(); ?>. Wat je dan moet doen is kijken welke de div er om je menu heen staat. Verander dan in style.css het .nav-container element door de class (of id) die je net hebt opgezocht.
  • Maak daarna een map in je theme aan genaamd js (als die niet al bestaat). Daarin maak je een nieuw bestand aan genaamd scroll-menu.js. Open deze en voeg de Javascript code erin toe.
  • Verander wel .nav-container door de class of het id dat je in de css ook had veranderd.
  • Open daarna je theme's header.php en voeg de volgende regel toe tussen de <head></head> tags: <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/scroll-menu.js"></script>

Hierin is de CSS vooral belangrijk. Wanneer de huidige stijlen in je style.css 'conflicteren' met de stijl die de tutorial geeft dan kan alles inderdaad verspringen. Heb je een link?

Groeten Rolf
 
Laatst bewerkt:
Ik kom er zelf echt niet aan uit, zit al uren te spenderen om de balk mee te laten gaan, maar het wil niet werken :(. Ik had de vraag of ik dan voor je een account aanmaak waarin je dan alles wijzigt. Zo weet ik ook dat het gewoon goed gebeurt, en zo kan ik hopelijk de deadline van 1 april nog halen (en nee, dat is geen grap). Hopelijk laat je dan achter of je het goed vindt of niet, dan regelen we het via pm.
 
Excuses voor de late reactie. Ik wil je wel verder helpen hiermee. Zolang ik de site maar kan zien kan ik wel kijken of ik ergens kan komen met css.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan