AnsweredAssumed Answered

How to get a popup with an obscure font to display for all?

Question asked by chayCWC on Oct 14, 2020
Latest reply on Oct 14, 2020 by chayCWC

I have a web map where I would like to include an Indigenous syllabics font in the popup. My current method works fine until you open the map on a device that does not have the font installed.

This is by simply working in the popup under html for the Custom Attribute Display. Here is the bit that tells the font to display in those syllabics:

 

<font face="SayisiDS">{Syllabic_G}</font>

 

Where "SayisiDS" is the name of the font installed on my desktop and "Syllabic_G" is the field name for the attribute in the point file. The curly brackets seems to be what tells the code that this is a field name.

 

 

I considered uploading an image of each syllabic name and linking to it in each popup, but it is very labour intensive (there are about 100, and ArcGIS Online doesn't seem to have a quick way to upload many files) and besides it would be much more likely I would make a mistake in the process (and not notice).

 

The answer may be to convert the font to a web font, e.g. at fontsquirrel
https://www.fontsquirrel.com/tools/webfont-generator 

 

Then host the web font on ArcGIS Online? If those file type(s) are allowed. Otherwise host elsewhere?

 

Then use css @ font-face to embed the font in a style sheet? I'm not familiar with programming this way, so don't really know how or if this would work here.

https://www.paulirish.com/2009/bulletproof-font-face-implementation-syntax/ 


Got these ideas from a stack overflow answer here, that references my above two links:
javascript - How to embed fonts in HTML? - Stack Overflow

 

I'm working on trying this out and will update the post for others' future reference... For context I have very little experience in web programming so it's possible my ideas above are fully or partially nonsensical!

 

If anyone reads this and knows another solution, or has any other comments about this, I would be glad to hear from you!

Outcomes