Hoe zet ik een knop of icoon in het menu (en toon ik een item alleen op mobiel)?

Stap 1: Open het menu-item

Ga naar Menu’s en kies het menu. Klik in de Menustructuur op het pijltje rechts in het item. Het item klapt open. Onder de velden van WordPress zie je de extra opties van je website.

Stap 2: Kies Knop of Icoon bij Weergave optie

Bij Weergave optie heb je drie keuzes:

• Standaard weergave: een gewone link.
• Knop: het item wordt een knop.
• Icoon: een icoon voor de tekst.

Kleur van de knop

Kies je Knop, dan verschijnen de knopinstellingen. Kies een kleur uit je huisstijl. Laat je de kleur leeg, dan krijgt de knop de hoofdkleur van je website. Je kunt bij de knop ook een icoon kiezen.

Een icoon kiezen

Bij Icoon kies je een icoon uit de lijst. Het icoon staat altijd vóór de tekst. Je kunt het niet achter de tekst zetten.

Klik op Menu opslaan en bekijk het resultaat op je website.

Alleen tonen voor ingelogde of uitgelogde bezoekers

Met Weergeven voor kies je wie het item ziet:

• Alle bezoekers (standaard)
• Alleen ingelogde bezoekers: bijvoorbeeld een link naar een ledenpagina.
• Alleen uitgelogde bezoekers: bijvoorbeeld een link ‘Inloggen’ of ‘Lid worden’.

Alleen tonen op mobiel of desktop

Met Apparaat zichtbaarheid kies je Alle apparaten (standaard), Alleen mobiel of Alleen desktop. Handig voor een belknop die je alleen op een telefoon wilt tonen.

Dit werkt op het type apparaat

Voor bezoekers kijkt de website naar het apparaat waarmee ze binnenkomen, niet naar de breedte van het scherm. Ben je zelf ingelogd, dan werkt het wel op schermbreedte. Maak je je browservenster smal, dan zie je dus iets anders dan een bezoeker op een telefoon. Gebruikt je website paginacache, dan kan een bezoeker soms de versie van een ander apparaat zien. Test daarom altijd uitgelogd op een echte telefoon en een echte computer.

Tips: één knop, rechts

• Gebruik maximaal één knop in het menu. Twee knoppen naast elkaar trekken allebei de aandacht, en dan valt geen van beide op.
• Zet de knop rechts, als laatste item. Heeft je header twee menu’s, dan staat de knop vaak alleen in het tweede menu. Zie de menubalk indelen.
• Kies een korte, actieve tekst: ‘Plan een gesprek’, ‘Offerte aanvragen’.
• Ook gewone knoppen op je pagina’s maak je met een eigen blok: een knop toevoegen.

Lukt het niet?

• Je ziet de opties niet. Klap het menu-item open met het pijltje rechts.
• De knop heeft een andere kleur dan verwacht. Zonder gekozen kleur krijgt de knop de hoofdkleur. Kies een kleur en sla op.
• Een item voor alleen mobiel zie je toch op je computer. Je bent ingelogd: dan kijkt de website naar de breedte van je venster. Log uit of gebruik een privévenster om te testen.
• Een item verdwijnt niet op desktop. Ligt het aan caching, leeg dan de cache. Of neem contact met ons op.
• De knop staat in het menu, maar niet op mobiel. Het mobiele menu is een apart menu. Zet het item daar ook in: het mobiele menu instellen.

Veelgestelde vragen