Support Volgende » CSS / opmaak vragen Volgende » Twenty Seventeen pagina links

  • Ik gebruik voor een website het Twenty Seventeen thema. Als je echter op eenmenu-link klik (bv. contact) sprint de pagina naar de uitgelichte foto i.p.v. naar de tekst. Bij scrollen vanuit de homepage maakt me dat niet zo veel uit, maar de foto’s zijn zó hoog dat de tekst niet zichtbaar is zonder scrollen als je op een link klikt.

    Mijn vraag is dan ook als volgt:

    Hoe kan ik ervoor zorgen dat – als je op een link uit het menu klikt – naar de tekst gesprongen wordt i.p.v. naar de uitgelichte foto?

    Ik heb het al geprobeerd met <a name="anchor"></a> maar dat springt naar het midden van de tekst na het anker in plaats van dat het anker bovenaan de zichtbare pagina staat en de tekst die moet volgen er gewoon onder komt te staan.

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • heb jij bij de pagina instellingen soms uitgelichte afbeelding een afbeelding staan?

    Ja klopt. Dat ging al helemaal niet goed bij standaard links. Daarna heb ik <a name> in de menu’s gebruikt, maar die springen niet naar de anker-plaats maar ergens middenin de tekst, waardoor de helft van de tekst boven buiten beeld verdwijnt. 🙁

    • Deze reactie is gewijzigd 3 maanden, 4 weken geleden door  NightwatchNL.

    Beste Nightwatch,

    De tekst begint in het Twenty Seventeen theme bij de “main” met “main” als ID.

    Voorbeeld:
    https://tryit.tv/twentyseventeen/ (je moet scrollen)
    https://tryit.tv/twentyseventeen/#main (hij scrollt automatisch naar de tekst)

    Als je “#main” toevoegt aan de links in je menu zal de pagina dus automatisch getoond worden waar de content begint.

    Je kunt dit doen door in WordPress (Weergave > Menu’s) menu-items aan te maken als “Aangepaste links”. Voeg dan #main toe aan het einde van je link (zo).

    Hopelijk helpt dit!

    Groeten,
    Wouter

    Dat klinkt goed. Dit ga ik testen.

    [Update] Dit lukt alleen met het allereerste menu-item. Als je meerdere pagina’s hebt, bijvoorbeeld een contact pagina helemaal onderaan een single page opmaak, is deze niet te bereiken.

    Zelfs als ik de titel vermink lukt het niet en valt de pagina-titel buiten beeld:
    <a name="contact"></a><br> <br> <br> <br>Contact

    Zie voorbeeld: http://www.gklogistics.nl

    • Deze reactie is gewijzigd 3 maanden, 2 weken geleden door  NightwatchNL.
    • Deze reactie is gewijzigd 3 maanden, 2 weken geleden door  NightwatchNL.

    Hi Nightwatch,

    Je moet de volgende code gebruiken:
    <a id="contact">
    (id ipv name)
    Dan zou ’t moeten werken..

    Ik zie dat de verschillende “sections” wel een ID hebben. Bijv. https://www.gklogistics.nl/#panel3 scrollt wel naar “contact”.

    ID, da’s een idee. Ga het straks even testen. Alvast mijn dank.

    [Update]
    Helaas, zowel #name als #ID geeft hetzelfde resultaat: De kop en de eerste regels tekst verdwijnen aan de bovenkant buiten beeld.

    Verder is het ook jammer dat nu de links zichtbaar zijn in de pagina-links. Als je nu naar contact springt, staat er https://gklogistics.nl/#contact in de zoekbalk.

    Zie: https://www.gklogistics.nl

    #panel3 doet bij mij helemaal niets (Safari, Firefox en Chrome browsers getest)
    alleen #panel2 werkt en sprint naar een foto (uiteraard we eerst alle #name en #ID weggehaald)

    Het maakt verder ook niet uit of je de <a ID="contact"></a> in de menunaam zet of voor de eerste regel van de tekst. 🙁

    Ik zou het gewoon op de zelfde manier zichtbaar hebben als ‘Intro’. Daar staat de kop en de tekst keurig bovenaan.

    • Deze reactie is gewijzigd 3 maanden, 1 week geleden door  NightwatchNL.
    • Deze reactie is gewijzigd 3 maanden, 1 week geleden door  NightwatchNL.
    • Deze reactie is gewijzigd 3 maanden, 1 week geleden door  NightwatchNL.
6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)