De component amp-carousel

Opmerking: Deze component kan alleen worden gebruikt in AMPHTML-advertenties.

Met de component amp-carousel wordt een carrousel gemaakt voor de weergave van meerdere afbeeldingen. U kunt het uiterlijk en gedrag van de carrousel aanpassen door de eigenschappen ervan aan te passen.

*Een voorbeeld van een weergave met de component amp-carousel.*

De component amp-carousel gebruiken in uw project:

Open het deelvenster Componenten en vervolgens de map Galerijen.
Sleep de component amp-carousel naar het werkvlak.
Zoek in het venster Eigenschappen naar het gedeelte met de eigenschappen van amp-carousel en geef een naam voor de component op in het veld Naam.
Voeg in het veld Afbeeldingen afbeeldingen toe aan de galerij via een van de volgende methoden:
- Klik op de knop Galerij-afbeeldingen selecteren . Klik op de knop Afbeeldingen kiezen om naar afbeeldingsbestanden te browsen of sleep bestanden rechtstreeks naar het dialoogvenster.
- Geef de URL's op voor uw afbeeldingen, gescheiden door komma's.
Pas desgewenst andere componenteigenschappen aan (zoals hieronder beschreven).

Codeweergave

In de codeweergave vermeldt de component amp-carousel alle afbeeldingen van de eigenschap Afbeeldingen in een speciaal Google Web Designer-kenmerk, images, in plaats van deze te markeren als onderliggende items. In andere gevallen moet de broncode voor de component voldoen aan de officiële specificatie. (Het gepubliceerde bestand voldoet volledig aan de specificatie.)

Afbeeldingen in de carrousel opnieuw ordenen of verwijderen:

Ga naar het deelvenster Eigenschappen en klik in het gedeelte met eigenschappen voor amp-carousel op de knop Galerij-afbeeldingen selecteren . Er wordt een dialoogvenster geopend met een lijst met afbeeldingen in de carrousel.
Sleep een afbeelding naar de gewenste nieuwe positie om de afbeelding opnieuw te ordenen. U kunt ook de muisaanwijzer op een afbeelding plaatsen en op het pictogram Afbeelding verwijderen klikken om de afbeelding uit de carrousel te verwijderen.
Klik op OK.

Eigenschappen

Wijzig het uiterlijk en gedrag van de component amp-carousel in het venster Eigenschappen.

Eigenschap	Beschrijving
Naam	De naam van de component amp-carousel.
Afbeeldingen	URL's van de afbeeldingen die in de carrousel moeten worden weergegeven.
Type	Het weergavetype: carrousel: alle dia's worden in één doorlopende reeks weergegeven en kunnen horizontaal worden gescrolld. dia's: er wordt één dia per keer weergegeven.
Automatisch afspelen	Alleen van toepassing als het type is ingesteld op dia's. Vink dit selectievakje aan om automatisch door te gaan naar de volgende afbeelding in de carrousel zonder gebruikersinteractie. Er moeten minimaal drie dia's aanwezig zijn om automatisch te kunnen afspelen.
Vertraging	Alleen van toepassing als het type is ingesteld op dia's* en automatisch afspelen is ingeschakeld.* Het tijdsinterval in milliseconden voordat u doorgaat naar de volgende dia. De standaardvertraging is 5000 milliseconden (5 seconden).
Bedieningselementen weergeven	Vink dit selectievakje aan om de linker- en rechterpijlen weer te geven, zodat de gebruiker op een mobiel apparaat door de carrouselitems kan navigeren. Op computers worden er altijd pijlen weergegeven voor carrousels met meerdere items.
Lus	Alleen van toepassing als het type is ingesteld op dia's. Vink dit selectievakje aan om verder te gaan dan de eerste dia of de laatste dia. De carrousel wordt doorgelust naar het andere einde. Er moeten minimaal drie dia's aanwezig zijn voor een lus.

Gebeurtenissen en acties

Gebeurtenissen die door de component amp-carousel worden verzonden

U kunt andere acties activeren op basis van de volgende gebeurtenissen van de component amp-carousel:

Gebeurtenis	Beschrijving
Diawijziging	Wordt verzonden wanneer de weergegeven dia wordt gewijzigd.

Als u een van deze gebeurtenissen selecteert in het dialoogvenster Gebeurtenis, stelt u de component amp-carousel in als doel.

Acties die door de component amp-carousel worden uitgevoerd

De volgende acties voor de component amp-carousel kunnen worden geactiveerd als reactie op andere gebeurtenissen:

Actie	Configuratieopties
Ga naar dia	Index: de dia waar naartoe moet worden gegaan, waarbij 0 de eerste dia aangeeft.

Wanneer u een van deze actie selecteert in het dialoogvenster Gebeurtenis, stelt u de component amp-carousel in als ontvanger.

Meer informatie over hoe u gebeurtenissen configureert.

Voorbeeld

U kunt geen voorbeeld van deze component bekijken in de Google Web Designer-interface. Als u de component in actie wilt zien, bekijkt u een voorbeeld van uw document in uw voorkeursbrowser. Klik rechtsboven op de knop Voorbeeld .

Was dit nuttig?

Hoe kunnen we dit verbeteren?