Accordion Layout - OutsystemsUI Web


Right now I'm trying to use the dropdown widget but I can't make it look like a dropdown so mine looks like this: 

I'm guessing that it looks like this because i don't have any CSS to this component but, how can i solve it? Using a Theme?

I'm using the OutsystemUI Web because I can't make SilkUI work and also (on forge it says it's installed but i cant access it on the outsystems dependencies menu) and i don't know what is the best option to build my interface.

Hi Carolina,

When you create the application, you had to select a theme.
Which one did you select? Top Menu?

Your application will have a theme based on the Top Menu theme (or any other you have selected). And it will inherit all the styles applied to that theme.

Also, for the widgets to work, you need to use a page layout from the theme you selected or you need to create one that has the required JavaScript.

So, first thing, check that the theme that is being applied to your screen (through the Screen Flow selection and application) is based on the OutSystemsUi theme, like this:


Yes! I'm using OutsystemsUIWeb eSpace as a theme !

Hi Carolina,

Just check the while creating a module did you select web blank type. That could also be the reason.




As Koushik mentioned, you need to be sure that your module is setup correctly (usually it is).

This is how my module is set:

I have a Theme Module (you may not need one). This Module was the first module Responsive that I create. It has Theme (called TU_HP_TravelUp) that has as Base Theme the BaseTheme (from OutSystems UI). I made it public.

Then, in my End User module, I have the Module setup like this:

Then, each Web Flow has the theme set to the default module theme:

This means that all Web Screens in my MainFlow will use the default theme from the module, that I set up to be the theme from my Theme Module, that inherits the OutSystems UI BaseTheme.

How is your setup?


I forgot to tell before but Yes, when i first started i picked the top menu layout

That's how my setup looks...

Actually, now that I checked again, the accordion im using is from '' Web Pattern", there isnt accordion available on OutsystemsUI 


If you are using the Accordion from Web Patterns, you are using the one from SilkUI. The styles classes can be different and thus you probably are not using the correct styles.

Change to the one from OutSystemsUiWeb and remove any reference to Web Patterns.


the ting is,  i cant find the accordion from outsystemsuiweb i only have the options that you can see on the previous comment i did



Go to the Manage Dependences screen (the Power Plug icon menu in the toolbar), select the OutSystemsUiWeb module and mark the widget. You didn't reference it (probably you removed unused references before).