Solution For Telerik Reporting Font-Family Fallback Support

  • Post published:June 15, 2015

A web-based commercial and SBA lending software was developed that manages the origination, processing, closing, and monitoring of small business loan portfolios. With the loan management system, lenders can think big and reimagine what modern business lending can be. It was developed by using Microsoft Visual Studio 2013(.NET 4.5), Bitbucket (Git), ASP.NET MVC, C#, Web API, MS SQL Server 2012, Single Page Application, Kendo UI Controls and Charts, Telerik Reporting, jQuery, Backbone.js, Marionette.js, Require.js, Underscore.js tools and technologies.

Client wanted vteam #397 to implement font-family fallback that should be compatible with different devices like iPad, Android Tablets, iPhone and browsers etc.


Initially vteam #397 had developed Telerik reports by using Verdana font-family that was available at all major devices and supported by all major web browsers. But there were some text truncation issues with latest version of Firefox due to its rendering engine updates.


As it was known that Telerik does not provide any support for font-family fallback, so vteam #397 itself implemented a workaround to handle the situation and meet the requirement. There was even no way to get HTTP Request Context inside library project (VB.NET) dedicated for Telerik reporting, so user agent request could not be inspected.

To fulfill this requirement, an out of the box solution had been implemented as follows:

  1. R&D was done and a list of sans-serif font-family was prepared. Sans-serif font-family was available on maximum devices and supported by maximum web browsers
  2. A custom script was being used to detect available font in client browser for each report request initiation
  3. One of the best supported font from the predefined list is then passed as report parameter using JavaScript
  4. Implemented the support font dynamically to render the report in HTML5 report viewer


Vteams provided extendable solution that can work with any device for supported font-family as well as font priority just by adding font name to list and no additional changes were required for it.