topic Re: Qlik Sense / SaaS - Create Side Menu in App Development

Qlik Sense / SaaS - Create Side Menu

profilejamesbond — Fri, 29 Aug 2025 10:08:29 GMT

Hi,

How to create that kind of side menu in Qlik Sense / SaaS ?

Thanks

Re: Qlik Sense / SaaS - Create Side Menu

hugo_andrade — Fri, 29 Aug 2025 14:32:53 GMT

Hi @profilejamesbond ,

That is built using the Layout Container in Qlik Sense and Qlik Cloud.

You have the icons aligned with actions to activate sheets upon clicking on them.

Make it a Master Item and place it on all your sheets.

For a simplified view, you can use the Navigation Menu object as well. The navigation menu isn't as pretty, but super straight forward to configure.

Re: Qlik Sense / SaaS - Create Side Menu

howdash — Fri, 29 Aug 2025 15:15:25 GMT

This looks very cool! Do you know how to get an icon to show up on top of text and how to change icon color, but not text color, to communicate which sheet is active?

Re: Qlik Sense / SaaS - Create Side Menu

hugo_andrade — Fri, 29 Aug 2025 17:41:04 GMT

Hi @howdash ,

I would add a second action on the button. The second action would set a variable, for example: vActiveSheet. This variable would be used to color the icons, or to load another icon on top of the gray one.

Makes sense?

Re: Qlik Sense / SaaS - Create Side Menu

howdash — Sat, 30 Aug 2025 00:50:24 GMT

It makes sense.

This was an interesting challenge. I played around with this today and was able to recreate pretty much everything as @profilejamesbond had in the attached picture.

The exact steps are:

1. Create vActiveColor and vInactiveColor variables to hold color codes of active and inactive icons.

2. Create a button that has only an icon as the label.

3. Set the navigation action of the button to be Go to a sheet and select a sheet you would like the user to be sent to when the button is clicked.

4. Add a text coloring expression for the icon in the button object to be something like this:

=If(ObjectID('sheet') = '<sheet_id>', $(vActiveColor), $(vInactiveColor))

This uses ObjectID function to identify currently active sheet. You'll need to replace the '<sheed_id>' with actual sheet ID. Sheet ID, by the way can be added by simply adding the Text & image object with ObjectID('sheet') as measure. This will reveal the ID of a sheet that you are on.

5. Create a text object from Custom object list to be used as a "button" title, like Learn.

6. Create another text object from Custom objects list to be used as the title for the navigation menu.

7. Create Layout container from Custom objects list.

8. Add the header text, navigation button, and button text to the layout container.

9. Duplicate the button and button text objects to be used to navigate to other sheets.

10. Adjust which sheet the button should navigate to.

11. Adjust button's icon and icon coloring expression to reference the new sheet's ID.

12. Adjust button's text to be the name of the new sheet.

13. When all buttons and texts are added to the layout container, add the finished layout container object to master items.

14. Add the finished layout object container from Master items list to each sheet.

I've made a video showing how to get the menu created. Here's the video: