Modify Default Report Headers

Unknown

Modify Default Report Headers

Unknown

Hi,

We are undergoing the process of upgrading to 4.0 to 5.0. Due to the header changes in 5.0, many of our report headers do not fully display. I would like to apply a global change to modify all of our report headers. What is the best way to achieve this? I would potentially like to change the font size, background color, height, border, padding, etc.

Thanks

Unknown

Hello,

As a quick solution, you can use CSS to modify the appearance of a report header. Once you create your style you can apply the same style to every report page. I put an example of how to use custom CSS in Decisions.

In order to create a custom style first create a CSS file by using the below CSS classes. Then go to System > Designers > CSS folder. Select folder view on the top right corner and click on Add at the bottom of the page. Upload previously created file here.

Go to each of your page designers that have reports on it and find your CSS document name under style sheets in the Properties panel. Once you select your style it will be applied to report views. Please check below documentation and screenshots for more information.

[color=rgb(34, 34, 34)][font=Arial, Helvetica, sans-serif][b][url=https://documentation.decisions.com/docs/using-css-page]Using CSS in a Page[/url]
[/b]
[/font][/color]
[color=rgb(34, 34, 34)][font=Arial, Helvetica, sans-serif][u][b]Example CSS File Content[/b][/u][/font][/color]
[color=rgb(34, 34, 34)][font=Arial, Helvetica, sans-serif].grid-container .ui-jqgrid-hbox .ui-jqgrid-htable .ui-th-div {
padding: 10px 10px;
overflow: hidden;
text-overflow: ellipsis;
font-size: 10px;
font-family: Arial, Arial, Helvetica, sans-serif;
color: white;
font-weight: bold;
}

.ui-jqgrid-hdiv .ui-state-default {
background-color: #047B6E;
color: white;
}[/font][/color]
[color=rgb(34, 34, 34)][font=Arial, Helvetica, sans-serif]
[/font][/color]
[img]att3[/img]

[img]att2[/img]

[img]att1[/img]
[i]edited by kenan@decisions.com on 7/2/2019[/i]
[i]edited by kenan@decisions.com on 7/2/2019[/i]
[i]edited by kenan@decisions.com on 7/2/2019[/i]

Unknown

Great! Is there a way to do this globally. I want to change all my report at once.

Unknown

In order to make change globally, you need to modify multiple Less files. The best solution is creating a custom Less file with the desired styles in it. Please follow the steps below.

[ul][li]Create a custom less file and add it to [b]C:Program FilesDecisionsDecisions Web HostHUIstylesless[/b] folder.[/li][/ul][ul][li]To compile this file import it in [b]C:Program FilesDecisionsDecisions Web HostHUIstyleslessUserPortal.less[/b] for User Portal and import it in [b]C:Program FilesDecisionsDecisions Web HostHUIstyleslessstudio.less[/b] for Studio Portal[/li][/ul][ul][li]Save your changes and wait for compilation as it will take a few seconds to finish the compilation. You can verify if the compilation is finished by looking at the modify dates of CSS files at [b]C:Program FilesDecisionsDecisions Web HostHUIstyles[/b].[/li][/ul][ul][li]Clear the browser cache and refresh it.[/li][/ul]
Please check example Less file for your reference.

Regards
[i]edited by kenan@decisions.com on 7/2/2019[/i]