How to consume OpenUI5 custom themes in the same project?

Viewed 206

I have started exploring my OpenUI5 app from this template - openui5-basic-template-app.

I need to create custom theme for my OpenUI5 WebApp. I have gone through this sample - https://github.com/matz3/ui5con17-custom-theme

I have already gone through following links - here and here

Now question is, How can I combine these two projects together so that I can use ui5con17-custom-theme in my openui5-basic-template-app

How to use custom theme, or how to refer custom theme in UI5 webApp???

I am very new in OpenUI5 app development. Please help!!!

1 Answers

If your main question is how to point your app to the custom theme, then have a look at the second half of the "Setting Themes" page in the SDK

E.g. set the theme-roots bootstrap attribute to tell UI5 where to load the theme from:

data-sap-ui-theme-roots='{"my_theme" : "<URL_of_root_folder_of_custom_theme>"}'

Below this root, UI5 will automatically create sup-paths according to the used control libraries.

Of course also set the "data-sap-ui-theme" attribute to the name of your theme the same way you would normally select one of the default themes.

If something fails, check in the network trace from where the browser attempts to load the theme files.

Related