9 Replies Latest reply on Jul 11, 2017 11:02 PM by Vikash Kushvaha

    How to call a custom font in an HTML tile?

    Alex Nassi

      I am trying to use a custom font that my company purchased in some HTML tiles, but cannot figure out how to get the font to appear on my tile. This is working properly when I use my local system, but when I upload the font .tff or .otf file to Jive, the font will not appear.

       

      The fonts are uploaded as a static resource on the space where they need to be used in .tff and .otf format.

       

      An example of my code is:

      <html> 

       

      <head> 

      <style> 

       

       

      @font-face { 

          font-family: 'jimlee-reg'; 

          src: url('[copied from static resources]') format('opentype'); 

       

       

          body { 

              color: #5e5e5e; 

              font-family: 'jimlee-reg'; 

          } 

      </style> 

      </head> 

       

       

      <body> 

      <h3>sample tile</h3> 

      <p>this is sample html tile content.</p> 

      </body> 

       

       

      </html>             

       

       

      Loading this into Jive I get the following console error:

      app-community.[mycompany].com/resources/add-ons/185191ef-772a-4541-8b5a-411108…statics/69439/.custom-tile-1498677847697.html?a=1498677871656&key=listen:1 Access to Font at 'https://community.[mycompany].com/resources/statics/69439/CCJimLee-Regular.otf?a=1498663611475' from origin 'https://app-community.[my company].com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://app-community.[my company].com' is therefore not allowed access.

       

      I searched JiveWorks and the closest solution I was able to find was for self-hosted instances, not for Cloud. I also submitted a case to Jive Support and have yet to hear back.

       

      Is there a way this font file can be hosted in our instance and called/referenced? Is there another directory this can be loaded to from either my end or Jive's end? This functionality works for images, so I don't see why it won't work for the font. Any explanations, ideas, or workarounds are helpful.

       

      Thank you!