redherring917
Posts: 21
Joined: Tue Sep 10, 2024 8:32 pm

Custom components and styling

Suppose I wanted to include content on a dashboard something like the attached (just a very roughly mocked up example), where each of these 6 images is hyperlinked to their respective page. And suppose I wanted users to be able to remove any number of these images from their dashboard in “edit mode”. In my very limited understanding of things, I’m guessing that I’d want to make each of these hyperlinked images its own separate component. But ideally I’d want those components to appear “borderless”, such that they essentially look similar to this mockup… images "floating" in whitespace without component borders.

Can anyone provide details and hopefully some sample code on how I could accomplish this?

Thanks!
Attachments
2024-09-10_10-44-31.png
2024-09-10_10-44-31.png (61.91 KiB) Viewed 3592 times
User avatar
dawid.d
Site Moderator
Posts: 1119
Joined: Thu Oct 06, 2022 11:31 am

Re: Custom components and styling

Hello,

Thank you for reaching out!

See the demo below, I created a custom component based on your concept. Individual items can be hidden/shown in editmode. You can customize it more with CSS.

Demo: https://jsfiddle.net/BlackLabel/6hec07s5/

Hope it was helpful
Best regards
Dawid Draguła
Highcharts Developer
redherring917
Posts: 21
Joined: Tue Sep 10, 2024 8:32 pm

Re: Custom components and styling

Very nice! Thank you very much.

Return to “Highcharts Dashboards”