Accordion component

Een Accordion component, ook wel collapsible of openklapper genoemd, is een container component en bevat de volgende onderdelen:

• Accordion item
• Text
• Accordion link list (voor links / buttons / takeovers)
• Logo

 

Er zijn 3 nieuwe features beschikbaar!

Feature 1: Mogelijkheid om een eigen logo toe te voegen in het Accordion component.
De werking is als volgt:

1. Plaats een Accordion component en minstens één Accordion item. Hierdoor verschijnen er drie subcomponenten onder het Accordion component. Het tweede subcomponent wordt het 'Logo' subcomponent genoemd (zie deze afbeelding);
2. Sleep het 'Logo' subcomponent naar het midden van je scherm;
3. Het 'Picture' veld is nu beschikbaar (zie deze afbeelding). Hierin plaats je vervolgens de URL van een BrandSpot afbeelding. 
4. Klik vervolgens op 'Save Page' en het logo is zichtbaar (zie deze afbeelding)! 
    

Feature 2: het weergeven van 2 accordion items naast elkaar (2 kolommen). 
De werking is als volgt:

1. Plaats een Accordion component en een Accordion item. Hierdoor verschijnen er drie subcomponenten onder het Accordion component. Het derde subcomponent wordt het 'Text' subcomponent genoemd (zie deze afbeelding);
2. Sleep 2 'Text' subcomponenten onder het Accordion item en plaats tekst in die 2 aparte subcomponenten zoals je gewend bent (zie deze afbeelding);
3. Klaar met vullen? Klik op Save Page en de 2 kolommen zijn zichtbaar (zie deze afbeelding)! 
    

Feature 3: Op een willekeurige pagina linken naar de titel van een accordion item. 
De werking is als volgt:

1. Wil je op een pagina linken naar een accordion item? Ga eerst naar de pagina waar het accordion component staat;
2. Bovenaan die pagina (met het accordion component) vind je de functionaliteit 'Toon link bij accordeon component". Vink deze aan (zie deze afbeelding);
3. Scrol vervolgens totdat je het accordion component ziet. Naast ieder accordion item staat de tekst 'Kopieer accordeon link' in het rood (zie deze afbeelding);
4. Klik op de link, afhankelijk van welk item je wil gebruiken. Er verschijnt een pop-up melding dat de link is gekopieerd (zie deze afbeelding); 
5. Ga nu naar de pagina waar je deze accordion link wil plaatsen. Dit kan in ieder component waar je een URL kan plaatsen, zoals in het Call to action component (veld 'URL primary link'). De URL die je plaatst bevat een unieke ID (zie deze afbeelding);  
6. Klaar? Klik op Save Page. Wanneer je klikt op die link, dan wordt je direct naar dat specifiek accordion item doorverwezen. 

Hieronder een korte instructievideo over Feature 3: Linken naar de titel van een accordion item.