Afbeeldingslinks bij hover
Toon een lijst met links naast een grote afbeelding die verandert als klanten met de muis over elke link gaan.
Een lijst met links naast een grote afbeelding die bij hover verandert in de afbeelding van elke link. Gebruik het om categorieën visueel te tonen (“Nieuw binnen”, “Bestsellers”, “Sale”) zonder de ruimte van een volledig afbeeldingsraster. In de app heet het blok Hover image links (afbeeldingslinks bij hover).
Het blok toevoegen
-
De indeling kiezen
Klik in het megamenupaneel van het voorbeeld op Blok toevoegen. Klik op Linklijst, ga met de muis over Hover image links en klik op Selecteren. Het blok begint met de kop “Collections” en 3 voorbeeldlinks.
(1) Klik op Linklijst, (2) kies Hover image links. -
De kop en standaardafbeelding instellen
Vul in Item bewerken, onder Algemeen, de Kop in, kies een Default image (standaardafbeelding) en vul Button label on image (knoplabel op afbeelding) in.
Het blok Hover image links in het voorbeeld, met de instellingen in Item bewerken. -
Elke link instellen
Vul de Titel in, kies de Link en kies de Image on hover (afbeelding bij hover). Klik op Toevoegen om een link toe te voegen, of op Verwijderen om er een te verwijderen.
-
Opslaan en publiceren
Pas de afbeelding aan onder Style (stijl) en klik daarna op Opslaan en Publiceren.
Instellingen
Algemeen
- Kop
- Tekst boven de links.
- Standaardafbeelding
- Default image: verschijnt bij links zonder eigen Image on hover.
- Knoplabel op afbeelding
- Button label on image: tekst op de afbeelding, onder de titel van de link. Laat leeg om alleen de titel te tonen.
- Breedte
- Hoeveel van de megamenurij het blok inneemt: Automatisch of 8,33% tot 100%.
Stijl
- Positie van de afbeelding
- Image position: Rechts of Links van de links.
- Beeldverhouding
- 1:1, 4:3, 3:4, 16:9 of 9:16.
Elke link
- Titel
- De tekst van de link.
- Link
- Waar de link naartoe gaat.
- Afbeelding bij hover
- Image on hover: de afbeelding die verschijnt terwijl een klant met de muis over deze link gaat.
Maximaal 10 links per blok. Elke link staat ook onder het blok in de lijst Elementen, met een knop Add link (link toevoegen): sleep links om de volgorde te wijzigen, of klik op een link (in de lijst of het voorbeeld) om alleen die link te bewerken, inclusief de eigen Zichtbaarheid. Zichtbaarheid voor het hele blok werkt zoals bij elk blok; zie Instellingen die elk blok heeft.
Tips
- Gebruik afbeeldingen met dezelfde vorm en stel Beeldverhouding daarop in, zodat het afbeeldingsvlak niet verspringt tussen links.
- Houd titels van links kort. De titel verschijnt ook op de afbeelding.
Was dit nuttig?
Bedankt voor je feedback! Vertel ons wat er ontbrak
Probleem melden