Hello everybody!
I am working on a new internal tool, have the header orientation in vertical for logged in users.
In order to use icons in the menu links I had to use the module:
“Header with sublinks, icons and description”.
The problem, is that the user has to click to display the menu and that it is visual.
Is there any script or way to leave it displayed by default?
Thanks!
@RafaPG can you pls share screenshots or video recording about the above issue ? then it will be easy for me to help.
Good morning @artur !
Thank you for your reply.
I attach an image, which will be better understood than my English translator.
The submenu with icons by default is not displayed.
I need to set it as displayed by default.
Thanks for your help!
DM-ing you so we can troubleshoot in your app
Hello @artur ,
You have a DM.
No one else has come across this use case?
Using a vertical menu with icons to give the interface a more user friendly visual appearance.
Thanks!
Hi @RafaPG ,
I use the following to open the top-level link after page load.
$(".MuiAccordion-root:first-child div[role=button]")[0].click();
You may have to adjust the selector.
Hello @RafaPG ,
I have the exact same use case and I’m struggling to resolve it.
Did you manage to make it work?
Thanks!
Hey folks we chatted also via DM
May I know why instead of links you use sub-links and then need to click to open ?
The main reason for using sub-link is that they allow customization of the icons. Giving a more corporate look and feel.
It would be good to consider the option of allowing a header with links and icons. With this it would not be necessary to use extra code.
Attached sample image
@bencoh26 @rhinonix
I have not been able to get the code snippet to work.
Can you help us by sharing how to locate the module to execute the action?
Thanks!
@RafaPG try this
<script>
window.addEventListener('block-loaded-home-colaborador-con-iconos', () => {
$(".MuiAccordion-root:first-child div[role=button]")[0].click();
});
</script>
Thank you very much Artur!
It’s working!!! 
The application is looking great
Hi again @artur!
I am working on another application and following the same concept I asked the previous time.
In this case how could I display several submenus?
The submenus I need to display are:
Thanks!
Hey @RafaPG , could you please try this code? Just replace the BLOCKID with your block name
<script>
window.addEventListener('block-loaded-BLOCKID', () => {
document.querySelectorAll('.MuiAccordion-root').forEach((link) => {link.querySelector('div[role=button]').click()});
});
</script>