cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
1095
Views
2
Helpful
8
Replies
Highlighted
Contributor

Glyphicons and Awesome-Font

Hey.

Have anyone tried to use glyphicons or awesome font in a gadget ?

I cannot get any icons to show up in my gadgets

Best regads

Thomas

Everyone's tags (2)
1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Frequent Contributor

Re: Glyphicons and Awesome-Font

I just got it to work!

I had to add a style element in the gadget xml so uccx proxies it correct and the font files in the same directory

<style>
   @font-face {

   font-family: 'Glyphicons Halflings';

   src: url('glyphicons-halflings-regular.eot');
   src: url('glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('glyphicons-halflings-regular.woff') format('woff'), url('glyphicons-halflings-regular.ttf') format('truetype'), url('glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
   }

</style>

View solution in original post

8 REPLIES 8
Highlighted
Cisco Employee

Re: Glyphicons and Awesome-Font

Hi Thomas,

The Finesse desktop uses the glyphicons from bootstrap: http://getbootstrap.com/components/. As far as other awesome fonts, I haven't tried it.

Thanx,

Denise

Highlighted
Contributor

Re: Glyphicons and Awesome-Font

Hi Denise.

No - the icons doesn't show up. It seem like Finesse is not downloading the woff og eot file with the glyphicons

Thx.

Thomas

Highlighted
Cisco Employee

Re: Glyphicons and Awesome-Font

Hi Thomas,

Interesting. I know that it is used on the Finesse container, but I too can't get it to work in a third party gadget. I would have to debug further to see why.

Thanx,

Denise

Highlighted
Frequent Contributor

Re: Glyphicons and Awesome-Font

I have the same issue, it tries to download the font files from the uccx server /fonts/ path

Highlighted
Cisco Employee

Re: Glyphicons and Awesome-Font

Hi,

Sorry Thomas. I know I said I would debug this and it totally slipped my mind.

The Finesse container already loads a bootstrap version for the desktop. It seems like there is some sort of conflict with loading it for the gadget as well. I didn't look too much into it, but noticed using the browser's developer tools that it wasn't being loaded no matter what I did with the xml.

I was able to "hack" a solution together by copying the glyphicons css from the bootstrap's css as well as manually copy over the glyphicons file. Attached are my gadget files. I know this isn't the best solution, but it would allow you to use the glyphicons.

Glyph.png

Thanx,

Denise

Highlighted
Frequent Contributor

Re: Glyphicons and Awesome-Font

Hi Denise,

We host our gadgets on an external server (as it needs to integrate with other systems),

it looks like bootstrap is then not available in the gadget and needs to be included in the gadget,

that is not a problem but the Glyphicons won't work, not with the 'hack' either

the font-face paths are relative to the css, but they are always fetched from the uccx server :-(

Highlighted
Frequent Contributor

Re: Glyphicons and Awesome-Font

I just got it to work!

I had to add a style element in the gadget xml so uccx proxies it correct and the font files in the same directory

<style>
   @font-face {

   font-family: 'Glyphicons Halflings';

   src: url('glyphicons-halflings-regular.eot');
   src: url('glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('glyphicons-halflings-regular.woff') format('woff'), url('glyphicons-halflings-regular.ttf') format('truetype'), url('glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
   }

</style>

View solution in original post

Highlighted
Contributor

Re: Glyphicons and Awesome-Font

s.monteiro solutions works for me...

Thanks for helping Denise.

This widget could not be displayed.