Qlik Community

Ask a Question

Qlik Design Blog

All about product and Qlik solutions: scripting, data modeling, visual design, extensions, best practices, etc.

Francis_Kabinoff
Employee
Employee

As many of you know, custom themes shipped with Qlik Sense February 2018, and we covered how to start creating custom themes which you can check out here -How to create a custom theme in Qlik Sense. But did you know that Qlik Sense February 2018 also shipped with a new Theme API under the Capability APIs collection?

 

What can you do with the Theme API?

The Theme API can basically be used for two purposes, to get and to apply themes. You can view the documentation here - Theme API‌. Getting a theme is useful for applying styles to extensions, widgets, and mashups that are identical to the theme style. You can also apply themes to both Qlik Sense apps and independently of the theme set in the Qlik Sense app to native Qlik Sense objects created or embedded using the Visualization API (or app.getObject, if you're still using that).

 

You can get a theme using one of two different methods, the `get` method and the `getApplied` method. The difference is that the `get` method you call on the `qlik` object and pass a theme id to get any theme in your extensions, while the `getApplied` method you call on an instance of an `app` and it simply returns the current theme applied to that app. The `getApplied` method is particularly useful for widgets and extensions, since it allows you to style your widgets and extensions in such a way that they will match the theme the user applies to their app.

 

Both the `get` method and the `getApplied` method returns a promise which resolves to a `QTheme` object. The `QTheme` object currently has two methods available on it, the `getStyles` method, and the `apply` method. The `getStyles` method can be used to get a particular style by passing it a few parameters. It's an easy way to find the style you are looking for in the `QTheme` object. The `apply` method is one of the ways in which you can apply a theme to all visualizations on the page.

 

You can also apply a theme using the `apply` method of the Theme API without first fetching a `QTheme` object. The `apply` method of the Theme API just requires that you pass the theme id. These apply methods are particularly helpful for applying a theme to mashups and other embedded visualizations. Below is a code sample and image of the mashup with the theme applied.

 

require( ["js/qlik"], function ( qlik ) {

 

qlik.theme.apply('high-contrast-theme');

 

var app = qlik.openApp('Helpdesk Management.qvf', config);

 

app.getObject('QV03','rJFbvG');

app.getObject('QV02','xfvKMP');

app.getObject('QV01','a5e0f12c-38f5-4da9-8f3f-0e4566b28398');

} );

 

mashupthemed.png

 

There's one final method to mention, and that is the `save` method. The `save` method allows you to programmatically set the theme in a Qlik Sense app. This differs from simply applying a theme, as it actually sets and saves the theme in the Qlik Sense app, and not just for the session like the apply methods do.

 

And that's the introduction to the Theme API.

14 Comments
chrislofthouse
Luminary Alumni
Luminary Alumni

For anyone wanting to leverage the Theme API, but don't know where to begin with actually creating a custom theme, then https://ometistoolkit.com/themebuilder is a great place to start. Simply specify the colours you want and it'll create the files for you. All that is left is to apply the theme in your extensions, widgets, and mashups.

2,028 Views
Francis_Kabinoff
Employee
Employee

nice!

2,028 Views
barryharmsen
Luminary Alumni
Luminary Alumni

We've just launched our online theme editor at Sensetheme, which also includes ready-made templates. Go have a look, I'm very curious to hear your feedback.

2,028 Views
Francis_Kabinoff
Employee
Employee

Looks cool. You used lui, nice! I'll have to dig into a little more next week

0 Likes
2,028 Views
pablolabbe
Luminary Alumni
Luminary Alumni

Cool !

0 Likes
2,028 Views
katsafone
Creator
Creator

Awesome and very useful.  Thanks!

2,028 Views
kkkumar82
Specialist III
Specialist III

Thanks Chris and Barry, one sad thing is that I am unable to install Feb 2018 version, by any chance can I try this in my Sep 2017 version ?

Not the last thanks Francis for the wonderful posts..

1,525 Views
roblange
Partner
Partner

Thanks Francis, Chris and Barry...we were concerned we could never realise the power of Themes, but you have all made it easy for our business users!

1,525 Views
ajaykakkar93
Specialist
Specialist

Can we use it in Qlik Sense 3.2

0 Likes
1,525 Views
Francis_Kabinoff
Employee
Employee

Themes officially shipped with Qlik Sense February 2018.

1,525 Views