Archived: Display Custom Font in LabVIEW NXG Web Module

To display custom fonts such as Libre Barcode 39 offered by Google Fonts in LabVIEW NXG Web Module, you can include the font support by editing the HTML Source of the webVI. This article will describe in detail what you should do in order to display custom fonts such as Libre Barcode 39 in LabVIEW NXG Web Module's shipping example, Customize With CSS:

Identify the control or indicator you wish to implement the custom font. For demonstration purposes, the following label's font will be changed to Libre Barcode 39.
Click the Edit HTML Source
Add the following link tag into row 17 of HTML Source. The link tag helps to link the HTML Source of the webVI to an external style sheet.
- <link href='https://fonts.googleapis.com/css?family=Libre Barcode 39' rel='stylesheet'>
Locate the HTML element responsible for the label. Search for the label text with <Ctrl-F> will help you locate its location easily. The location of the label's HTML element is at row 171 and 172.
Add a HTML id attribute to the HTML element of the label as illustrated below. In this case, the id of the label is "labelExample".
By using internal CSS approach, define the font family of HTML element with HTML id attribute of labelExample at row 16 as illustrated below.
Click OK to save and close the HTML Source.
Click Run and now the selected label displays its content in Libre Barcode 39 font.