How to Set Custom Fonts with PDF SDK for Web

Foxit PDF SDK for Web has a huge range of custom fonts available with the package. You can customize as much as you wish by using the 2 sample codes below.

Setting up the font Path

var pdfui = new PDFUI({
        viewerOptions: {
            libPath: '../../../lib',
            preloadJR: true,
            jr: {
            licenseSN:"",
            LicenseKey:"",
            fontPath:"../external/brotli"
            }
        })

Setting up custom fonts

function setCustomFonts(){
        pdfui.getWebPDFJR().then(function(jr) {
            var fontCalibri = {
                nameMatches: [ /(calibri)/ig ],
                glyphs: [ 
                    // 0x1f0 = 0b111110000 matches a bold font of 500,600,700,800,900 ==> font weight
                    { bold: 0x1f0, flags: -1, url: jr.api.option.fontPath + '/calibrib.ttf', isBrotli: false }
                    ,
                    // 0x40 = 0b1000000 italic ==> font descriptors
                    { bold: -1, flags: 0x40, url: jr.api.option.fontPath + '/calibrii.ttf', isBrotli: false }
                    ,
                    // -1 means to match any values. It is recommended to put it behind the data so that those in front can be matched
                    { bold: -1, flags: -1, url: jr.api.option.fontPath + '/calibri.ttf', isBrotli: false }
                ]
            };


            var fontGothic = {
                nameMatches: [ /(gothic)/ig ],
                    glyphs: [
                        // the order is very important, the smaller the set, the more forward, the more preferential matched.
                          { bold: 0x1f0, flags: 0x40, url: jr.api.option.fontPath + '/gothicbi.ttf',  isBrotli: false }
                        , { bold: 0x1f0, flags: -1, url: jr.api.option.fontPath + '/gothicb.ttf', isBrotli: false }
                        , { bold: -1, flags: 0x40, url: jr.api.option.fontPath + '/gothici.ttf', isBrotli: false }
                        , { bold: -1, flags: -1, url: jr.api.option.fontPath + '/gothic.ttf', isBrotli: false }
                ]
            };
            
            pdfui.setJRFontMap([fontCalibri, fontGothic,  ]);
        });