Accordion Cards
Documentation and Live Example
Features
Content
- Cards: Add up to 5 customizable card items.
- Flexible content: Easily re-order cards to your liking.
- Customize labels: Choose between 3 different label styles. (icon, image, number)
- Links: Add a link to card names.
- Background options: Enable a color overlay to create contrast between text and image.
- Box shadow: Add box-shadow to your cards for unique style.
- Advanced options: Add CSS classes or code snippets to achieve any customization task.
- Compatible with all HubSpot themes
- Fully responsive on all screen sizes
Styles
- Adjust the name and description text styles.
- Add a color overlay to increase text visibility.
- Enable box-shadow for unique style.
- Adjust card item border radius.
Live example
Customize
Flexible Content
Adjust content:
- Add up to 5 customizable card items.
- Easily re-order content.
Customize card label
Customize card label:
- Choose between 3 different label styles. (icon, image, number)
- Customize each individual card label.
Link card names
Add links:
- Add a link to card names.
Background Options
Background settings:
- Select a color overlay to create contrast between text and image.
- Add a box-shadow to your cards.
Custom Styling
Add additional classes and CSS snippets:
- Add Extra classes. To add multiple classes, separate each class with a space.
- Add CSS code snippets. Target existing classes with Custom CSS code snippets or target your added Extra classes.
Live example
If you can't find the answer to your question, email me at support@mgedigital.co.za