1
0
-1

Hi,

I am trying to use our own font icon in a text display. I followed the steps in How do I add web fonts to Maestro to add the font to the library and they are in there now. When I try to use 

<div class="icon-alarm-solid -small"> </div> in the source of the html, the icon still does not display. Have I missed any other steps?

    CommentAdd your comment...

    1 answer

    1.  
      1
      0
      -1

      Hi Stephanie,

      You will need to find out which character the icon you want to show is mapped to, and enter that character as text, or enter the character code as a Unicode character escape as per https://www.w3.org/International/questions/qa-escapes

       

      1. Stephanie Siao

        Hi Bill, that works fine. I just had to ensure that the font family was set to the iconset first, else it was showing the empty square. Is there any easier way to use the icons?

         

        Also, would you know if there is a way to change the default icon in the open dialog button to use the custom icon instead of the default ones?

      2. Bill Frost

        Hi Stephanie,

        I'm not sure which open dialog button you are referring to.  Can you clarify?

        Also, which webfont are you using?

         

         

      3. Stephanie Siao

        Hi Bill,

        I am using a webfont that I imported in the library. It is custom-made for the project. 

        The "Open dialog" button is a component in Maestro that acts exactly like a button but opens up a dialog and has an icon attached to it.

      4. Bill Frost

        Hi Stephanie,

        If you install the font into Windows, and select the font in the Windows Character Map utility, you can see the icons and copy them into the clipboard.  From there, you can paste them into the Maestro editor.  They will appear as the empty box in the editor, but will show correctly in your form.

        To use your own icons in the Open Dialog buttons, have you tried clicking the 'Use Image' button in the Select Icon  dialog?  There are instructions there how to upload a background image for the button.

      CommentAdd your comment...