Sie sind nicht angemeldet.

Embedded fonts in Textfield Plugin

Valentin

Schüler

  • »Valentin« ist der Autor dieses Themas

Beiträge: 53

Wohnort: Moscow, Russia

  • Nachricht senden

1

Freitag, 1. Juli 2016, 17:02

Embedded fonts in Textfield Plugin

Hi all!

Is there any way to make embedded fonts in HTML5?
I read the Textfield Plugin documentation, and I know "Flash only":

http://krpano.com/plugins/textfield/#embeddedfonts

This information is relevant?
Or maybe there's another solution?

Tuur

Erleuchteter

Beiträge: 3 839

Wohnort: Netherlands

Beruf: Krpano custom coding / Virtual Tours / Photography / Musician / Recording engineer

  • Nachricht senden

2

Freitag, 1. Juli 2016, 17:38

Hi,

yes there is another solution.
Get an .ttf or .otf file of your font (google fonts for example)
Put this in the style of your html

@font-face {
font-family: Roboto;
src: url(font/Roboto-black.ttf);
}

and make sure you have the rtf or otf file in your font folder.
Then , for example

Quellcode

 
1
2
3

<data name="css_text">
font-family: Roboto; font-size:14px; color:#ffffff; text-align:left; line-height:20px;
</data>


then in your textfield layer just call css="data: css_text"

Hope it helps!
Tuur *thumbsup*
https://www.virtualtuur.com
Panimator: https://krpano.com/plugins/userplugins/panimator/#top
ToolBox: https://bit.ly/3TTnd6U
Measure in 360 photos : https://pame.virtualtuur.com
Moving Hotspots V2: https://krpano.com/plugins/userplugins/movinghotspots/#top
Donations
https://bit.ly/3NnpynC

Valentin

Schüler

  • »Valentin« ist der Autor dieses Themas

Beiträge: 53

Wohnort: Moscow, Russia

  • Nachricht senden

3

Freitag, 1. Juli 2016, 17:57

Thank you very much!
*thumbsup*

MikaG

Anfänger

Beiträge: 24

Wohnort: Berlin, Germany

  • Nachricht senden

4

Samstag, 2. Juli 2016, 17:40

This is great information, Tuur! Thanks a lot!

trek

Fortgeschrittener

Beiträge: 175

  • Nachricht senden

5

Freitag, 26. August 2016, 15:24

How to embed font in textstyle

Hi Tuur

Really useful post.

Added following lines to style section of html:

<style>
html { height:100%; }
body { height:100%; overflow: hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; }
a{ color:#AAAAAA; text-decoration:underline; }
a:hover{ color:#FFFFFF; text-decoration:underline; }
 @font-face {font-family: bookitalic; src: url(fonts/bookitalic.otf);}

</style>

Then changed xml as follows:

<textstyle name="STYLE4"
font="bookitalic" fontsize.no-mobile="18" fontsize.mobile="28" bold="false"
background="true" backgroundcolor="0xFFFFFF" backgroundalpha="0.667"
border="true" borderwidth="1" bordercolor="0xEE3224" roundedge="0"
textcolor="0x000000"
padding="6 10"
textalign="center"
yoffset.no-touch="-5"
yoffset.touch="-40"
/>

But... font is not displayed

Also tried changing:

<plugin name="titletext"
url="../plugins/textfield.swf"
keep="true"
align="bottomright"
x="35" y="30"
autosize="right"
wordwrap="true"
background="false"
zorder="-1"
children="true"
html="TEST"
css="p{color:#FFFFFF; font-family:bookitalic; font-style: regular; font-size:20;text-align:right; }"
effect="dropshadow(4,45,0x000000,4,1);"
/>

But this does not work either, any ideas?

thanks in advance for help *thumbup*

Cheers Tim

Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von »trek« (26. August 2016, 19:09)

trek

Fortgeschrittener

Beiträge: 175

  • Nachricht senden

6

Freitag, 26. August 2016, 19:43

Update - got it to work!

Got it to work in the end *thumbsup*

Seems that the css is sensitive to the font filename, no caps or '-' also I could not get it to work with font in a subfolder (i'm using client supplied otf's) when I changed caps to lower case, removed the '-' and placed the .otf file in the top level of the folder/directory it worked fine in both the textstyle and title text.

So thanks again Tuur and hope this saves some 'head scratching' *confused*

Tim

BTW - the selected font does not display when viewed locally?

Ähnliche Themen