topic Re: How to add external font style in Thingworx studio in Vuforia Studio

How to add external font style in Thingworx studio

Desai — Thu, 07 Jun 2018 07:23:22 GMT

Hi,

How do I add external font style to the widget Text in Thingworx studio.

I have tried this:

font-family: Montserrat;
src: url(#{resources}/Uploaded/Montserrat-Light.otf);

But it is not working.

Thanks,

Desai

Re: How to add external font style in Thingworx studio

AllanThompson — Tue, 12 Jun 2018 02:10:51 GMT

Yes, you can reference your font through a CSS Style definition. I've tried it with a WOFF font and it works fine.

In the Styles > Application setting for the Project (in the panel of the left side of the screen) add in your font definition where you refer to the font source online:

@font-face { font-family: 'Archer Book'; src: url('#{$resources}/Uploaded/Archer-Book-Pro.woff') format('woff'); font-weight: normal; font-style: normal;}
Define a CSS Class that uses this font:

.custom-title {
font-size: 25px;
font-family:'Archer Book';
}
In your label widget, refer to the CSS Class:

Now your label will use the font.

If the font is available on-line, then you don't even need to upload the font as a resource. Just change the URL in the CSS definition to point to the online version.

Hope this helps.

Allan

Re: How to add external font style in Thingworx studio

AllanThompson — Tue, 12 Jun 2018 07:06:57 GMT

You can do this through CSS.

In the Project Panel on the left side of the screen, go to Styles > Application and add in the call to use the font:

@font-face { font-family: 'Montserrat'; src: url('#{$resources}/Uploaded/Montserrat-Light.otf') format('otf'); font-weight: normal; font-style: normal;}
Create a style definition that calls this font:

.custom-title {
font-size: 25px;
font-family:'Montserrat';
}
Create your label and use the previously defined style:

If your font is available on-line, then you don't need to upload the font as a resource. Just change the source URL in the CSS definition to point to the on-line copy.

Hope this helps.

Allan

Re: How to add external font style in Thingworx studio

suraj_visvesh — Wed, 06 Mar 2024 16:51:28 GMT

The CSS doesn't seem like working for non administrator users who have only run time permissions. Got any thoughts on this?