Better Theme documentation and samples

[ToddChitt]

I'm trying to write my own custom theme JSON file base on samples I have downloaded from this page: https://docs.microsoft.com/en-us/power-bi/desktop-report-themes

and this very handy git repo: https://github.com/deldersveld/PowerBI-ThemeTemplates

But I'm piecing elements together and getting errors a lot of the time. Probably because I don't understand how everything fits together, which is probablydue to lack of sample in the first page.

For example, I can have a secion like this:

"visualStyles": {

    "*":

etc.

And I get that things under this seciton will apply to all elements. But then I aslo have this:

"page": {...} 

and that is for formatting the pages.

So far, so good. But if I want to format all my cards, for example with a certain style that is different than the default, and I try to add this:

"card": {...}

It bombs out.

Why? Can I not have a "*" section and a "card" seciton both at the same level under "visualStyle" ? Or a "card" section and a "page" section at the same level?

Do certain sections need to come before others? 

BTW, the first page referenced seems to not be taking comments 😞

[dax]

Hi ToddChitt,

You said you can't use custom theme , right? Did you change something in JSON? If you  download the json file from https://github.com/deldersveld/PowerBI-ThemeTemplates and import this in powerbi, will this work?

If you change the code in JSON, please inform me your JSON sample, I will test this in my environment.

Best Regards,
Zoe Zhi

[ToddChitt]

Hello, and thanks for the reply. I used some of the samples at the Git site as a starting point. But those address single visuals at a time. I want to combine formatting for several into one file. Is there a sample somewhere that shows how to format the "visualStyles": {...} section where you have multiple sub-sctions for different chart types?

The site by MS is woefully inadequate in this regard, and, it does not seem to be taking any new comments 😞

I have boiled down my JSON theme to the following that does not work. If I remove either the "card":{...} section OR the "page": {...} section, then it works fine. But the two together don't.

Am I missing a delimiter between the two secitons or something stupid like that?

{
"name": "CardTemplate",
"visualStyles":
{

"card":
{
"*":
{
"border":
[
{
"show": true,
"color": { "solid": { "color": "#062b60"}}
}
]
}
}

"page": {
"*": {
"background": [{
"color": { "solid": { "color": "#062b60" } },
"transparency": 50
}],
"outspace": [{
"color": { "solid": { "color": "#062b60" } },
"transparency": 50
}]
}
}

}
}

[dax · Accepted solution]

Hi ToddChitt,

It seems that you want to combine multiple visuals in the same json file and apply global setting, right? If so, I think you could try below

{"name":"My Theme",
"visualStyles":{
"*":{
"*":{"*":[{"fontSize":12,"fontFamily":"Calibri, Cambria","color":{"solid":{}}}]}},
"pieChart":{"*":{"legend":[{"show":true,"showTitle":true,"labelColor":{"solid":{"color":"#75b2f0"}}}],"general":[{"responsive":true}]}},
"card":{"*":{"labels":[{"show":true,"color":{"solid":{"color":"#1c7ad9"}},"fontSize":20}]}}}}

You could use Report Theme Generator V3 this tool, to create json, when you set multiple visuals, you could click donwload button, it will ceate and download json file for you(you also could modify the file based on your requirement)

Best Regards,
Zoe Zhi

If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

[ToddChitt]

@daxThanks for the tip. Not sure I would use the Theme generator at this point. But I did see something in your sample that caught my eye:

There is a comma between sections, like just before the "card":{...} section.

So for me, adding the comma did the trick.

Cheers.