Telerik Reporting R1 2017

Styling and Appearance

The article elaborates on the styles used by the WebForms wrapper of the HTML5 Report Viewer, and how they can be loaded manually in order to be modified.

The required stylesheets are provided automatically through a HTTPHandler via request to the Reporting REST service. If you want to customize the viewer styling you can stop the HTTPHandler from providing report viewer required Kendo CSS and JavaScripts by manually registering the Kendo JavaScript and CSS in the page head as shown here:

<head>
....
  <!--kendo.all.min.js can be used as well instead of kendo.web.min.js and kendo.mobile.min.js-->
  <script src="http://kendo.cdn.telerik.com/2015.3.930/js/kendo.web.min.js"></script>
  <!--kendo.mobile.min.js - optional, if gestures/touch support is required-->
  <script src="http://kendo.cdn.telerik.com/2015.3.930/js/kendo.mobile.min.js"></script>
  <!-- the required Kendo styles -->                  
  <link href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.common.min.css" rel="stylesheet" />
  <link href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.blueopal.min.css" rel="stylesheet" />
</head>

The HTML5 Web Forms Report Viewer is using the default viewer template. In order to use your own viewer template you have to provide path to your customized one to the TemplateUrl

For more information on the used stylesheets and report viewer templates check out the following HTML5 Report Viewer articles: