Hoe gebruik je de Galerij- en Afbeeldingslider-componenten in Website Builder

Wil je meerdere afbeeldingen op je website tonen? Met de galerij- en Afbeeldingslider-componenten van Website Builder kun je meerdere afbeeldingen in een raster invoegen of in een diavoorstelling tonen. In deze handleiding laten we zien hoe je de componenten aan je pagina toevoegt en ze naar wens aanpast.

• Een component invoegen op je site
• Afbeeldingen wijzigen en nieuwe toevoegen
• Instellingen van de Galerij- en Afbeeldingenslider-component

Een component invoegen op je site

1. Open Website Builder vanuit het one.com Configuratiescherm.
2. Ga naar Galerij in het menu aan de linkerkant en selecteer een galerijvariant.
3. Sleep de gewenste component naar je werkruimte en plaats deze waar je de galerij of slider op je pagina wilt.
4. Selecteer de afbeeldingen die je wilt invoegen of upload ze vanaf je computer of via een externe URL. Klik onderaan het pop-up venster op Toevoegen aan pagina .
5. Pas de grootte en plaatsing van de component naar wens aan.
6. Klik bovenaan de component op Galerij instellingen of Slideshow instellingen om de Instellingen van je galerij aan te passen.
7. Klik op Opslaan en Publiceren om de afbeeldingen zichtbaar te maken op je site.

Afbeeldingen wijzigen en nieuwe toevoegen

Wanneer je op de ingevoegde component klikt, verschijnen er twee tabbladen: Galerij/Slideshow instellingen en Wijzig afbeeldingen.

Klik op Wijzig afbeeldingen om de afbeeldingen van je galerij te wijzigen. Je kunt een afbeelding verwijderen door op het prullenbakpictogram in de hoek te klikken, of bewerken door op het potloodpictogram te klikken. Je kunt ook nieuwe afbeeldingen toevoegen door rechtsboven op Afbeeldingen toevoegen te klikken.

Opmerking: De titel van de afbeelding fungeert ook als alt-tekst in deze componenten. Als je alt-tekst wilt toevoegen, kun je dit doen onder Titel (alt) aan de rechterkant in Sorteer en bewerk afbeeldingen.

Instellingen van de Galerij- en Afbeeldingslider-componenten

Er verschijnen twee menu's wanneer je op de Instellingen van de component klikt. Hier kun je de volgende opties aanpassen:

Galerijcomponent:

1 - Boven-/onder menu

• Kolommen - Pas het aantal kolommen aan.
• Afstand - Pas de witruimte tussen de afbeeldingen aan.
• Bijsnijden - Vink dit vakje aan als de afbeeldingen moeten worden bijgesneden, zodat ze allemaal dezelfde grootte hebben in de galerij.
• Compacte weergave - Vink dit vakje aan als je de afbeeldingen zo dicht mogelijk binnen de blauwe marges wilt tonen.
• Volledige breedte - Vink dit vakje aan als je wilt dat de galerij de volledige breedte van je pagina beslaat.

2 - Zwevend menu

• Bij klik - Selecteer wat er moet gebeuren als een gebruiker op de afbeelding klikt. Kies uit: doe niets, bekijk grote afbeelding of open link.
• Onderschriften - Kies of je onderschriften aan de afbeeldingen in de galerij wilt toevoegen. Klik op "Onderschriften bewerken" om tekst en alt-tekst in te voeren. Kies of een onderschrift links, rechts of gecentreerd moet worden weergegeven. Je kunt ook de stijl kiezen: klassiek, template of aangepast.
• Afbeeldingsstijl - Pas hier de beeldverhouding van je afbeelding aan, bijvoorbeeld naar liggend of staand. Je kunt ook randen en afgeronde hoeken toevoegen.
• Volledige breedte - Hier kun je de galerij buiten de blauwe marges (volledige breedte) laten lopen of binnen de marges houden (standaard).

Afbeeldingslider-component:

1 - Boven-/onder menu

• Kolommen - Pas het aantal kolommen (1-5) in de slider aan. In het voorbeeld is gekozen voor drie.
• Overgang - Kies tussen een inschuif- of vervaageffect voor de overgang tussen afbeeldingen.
• Bijsnijden - Je kunt ervoor kiezen om alle afbeelding bij te snijden zodat ze dezelfde grootte hebben in de slider. Bijsnijden is altijd actief als er meerdere afbeeldingen (kolommen) per dia zijn.
• Snelheid - Kies de overgangssnelheid van de afbeeldingen. Minimaal 1 seconde en maximum is 15 seconden.
• Volledige breedte - Kies of je de afbeeldingen in volledige breedte wilt tonen. Deze optie is alleen beschikbaar als er slechts één kolom per dia is.

2. Zwevend menu

• Navigatie - Kies of afbeeldingen automatisch moeten verschuiven en pas de navigatiepijlen en indicator aan of verberg deze.
• Bij klik - Selecteer wat er moet gebeuren als een gebruiker op een afbeelding klikt. Kies uit: doe niets, toon een grotere afbeelding of open link.
• Onderschriften - Kies of er onderschriften bij de afbeeldingen moeten worden weergegeven. Als je dit aanvinkt, krijg je meer opties om onderschriften toe te voegen en de uitlijning en plaatsing te kiezen.
• Volledige breedte - Als er slechts één kolom is, kun je de breedte van de slider buiten de blauwe marges (volledige breedte) of binnen de marges (standaard) instellen.

Gerelateerde artikelen:

• Hoe bewerk ik een afbeelding in Website Builder?
• Hoe voeg ik een afbeelding toe aan mijn Website Builder-site?