Site URL: https://www.velocitta.it
Hello,
I am trying to make two different accordions in one of my page (it is the program of a festival wich develops in 2 days, I really like the hide and see accordion feature, so I am trying to customize the accordions and make it work for my specific case)
Here is my situation:
I have 2 accordions for the 2 days (Saturday, Sunday) one next to each other ;
in every accordion I have multiple items ; every item is one event ; every event has an icon wich refers to the 'type' of event (bike ride, food, game, talk, ...)
I succeeded in putting this icons by adding some CSS and following @tuanphan codes injection.
My problem now is for example: the Item 1 of Accordion 1 (Saturday) has the 'food' icon ; but the Item 1 of Accordion 2 should have the 'game' icon. But since it is the 1st Item it will automatically give the same icon since he considers I have 1 accordion only.
Is there a way to name differently the 2 accordions so that they are not linked?
Do you have any advise? Thank you !!