Include font in presentation

[GitNitneroc]

Hello !
I'd like to include a specific font in my presentation, (or in the html export).

I know I could export text to path in my svg, or modify the html to add the font in the html-head, but those solutions both have drawbacks. Is there another option ? I saw the CSS or JS files option, maybe there is something I could do here ?

Thanks for your help

[ejvindh]

In Inkscape I think that you could also do "Object to path". Has the advantage that it also makes the transitions more smooth. Drawback: You cannot edit your text as text anymore. This is the reason why I always save two versions of my svg's: One before, and one after having done "object to path" on the entire svg. The "object-to-path" is thus the very last thing I do, before publishing my presentation.

[tshoppa]

Hi,
I include fonts as base64 encoded fontface in a style tag, either in the svg or in the html. Here's an example SVG Inline Font.zip. It usually works fine when I share a presentation and want to ensure that fonts are available on the client device.

But that's probably what you refer to with add the font in the html-head, so maybe you can describe the issues you are dealing with when using this solution?

[GitNitneroc]

Hello and thank you guys !

Adding to the html is something I'd like to avoid : I'd like to keep the Sozi-exported html as-is. I already have to modify the inkscape-exported svg (to add youtube embedded videos) and I'd like to keep the workflow as smooth as easy as possible on my current project. I didn't know I could add a base64 font inside the svg and this could be a nice solution !

I ended up using ejvindh's solution because I really needed the frame-rate boost, but it's sub-optimal in my opinion because of what he listed but also some other side-effects : underlined text is not underlined anymore and links now require that you click precisely on the characters rather than in the bounding box.

[aumouvantsillage]

I'd like to keep the Sozi-exported html as-is

The base64 fonts can also be added to a custom CSS file that Sozi can insert into the generated HTML via the "Custom styles and scripts" feature.
https://stephenscaff.com/articles/2013/09/font-face-and-base64-data-uri/

[GitNitneroc]

Very nice and elegant solution, thank you !
I am really impressed with your work on Sozi, congratulations on this !

Do you accept Brave browser's tips ? (BAT token )

[aumouvantsillage]

(I have deleted my previous answer that was sent from the wrong account)

Very nice and elegant solution, thank you !

If I remember well, embedding the fonts was one of the reasons for allowing custom stylesheets.

I am really impressed with your work on Sozi, congratulations on this !

Thanks. I'm glad you find it useful.

Do you accept Brave browser's tips ? (BAT token )

If more users want to support Sozi via this system, I will have a closer look at it, but you are the first to suggest this payment method.

[GitNitneroc]

I don't know much about Brave tips actually, but I have some left and it's integrated into github. Any other way to tip in cryptocurrencies ?

[aumouvantsillage]

I used to accept Bitcoin a few years ago but I have given up.
I am not really interested in cryptocurrencies at the moment.

[hoshi411]

I actually found the solution.
This is my file.
I recommend that Sozi do this automatically.
But at least you can use my CSS file and drop your font files into the project folder and it will use those fonts.
No need to convert base64 or any of that .

Here is my CSS file
https://www.codepile.net/pile/W9jJgJ9R

Here is a sample of my work with custom local fonts.
https://binary-personality.github.io/index.html#home

[aumouvantsillage]

But at least you can use my CSS file and drop your font files into the project folder and it will use those fonts.
No need to convert base64 or any of that .

I think that many people (including myself) feel more comfortable if their presentation is saved as a standalone HTML file.
The initial question in this discussion was about embedding the fonts to avoid distributing them separately, so converting to base64 makes sense here.

Sozi will not enforce one solution or the other: if some users are OK with having the fonts in separate files, it is still possible.
Having Sozi generate a stylesheet is an interesting idea, but is there a consensus about what this stylesheet should include?

[hoshi411]

Wait. Is the svg also embedded into the html file? I thought it was only being linked. I didn't realize that it was all going into a single html file. I began to see my sozi projects as a folder.

eventually sozi projects will need to be a folder with multiple items because if videos are linked and the json file etc. , you already have more than html alone.

Eventually, you will make Sozi projects a folder which house all the files. I already made the mistake of not putting my svg onto its own project folder before opening it in Sozi. I later needed to go fishing for all the related files.

So, i see it as a necessity going forward.

I want to also say.

THANK YOU FOR THIS AMAZING PEICE OF SOFTWARE. This has enabled me to do what no other software can.

Just thank you.

[aumouvantsillage]

Wait. Is the svg also embedded into the html file?

Yes. In most cases, the HTML can be distributed as a standalone document.
It contains a copy of the SVG, the JSON, and the player script.

There are situations where you need to ship additional files: linked images, embedded videos, or fonts if you choose not to insert them as data URLs.

[hoshi411]

...a concensus...

Thank you for replying to my comments.
Just a basic boilerplate starter should be fine.

Like the one i posted.

It just gives explanation for the user on how to drop font files onto the project folder.

Sozi could be powerful enough to setup the css file already listing the fonts needed . Under font-family .

So much of that could be scripted so i didnt need to fumble through my svg and try to remember which fonts i used amd how to spell them etc.

But, my solution already is the easiest to implement.

Drop fonts on project folder.
Write font names in css file.
Done.

[hoshi411]

I found this old discussion.
https://sozi.baierouge.fr/community/d/127-to-keep-the-svg-external-from-the-html-as-a-reference

But, you already do not embed the json file, right?

So the html file already seems not to be standalone.

[aumouvantsillage]

But, you already do not embed the json file, right?

Yes I do.The JSON data of the presentation is copied to the HTML.

[hoshi411]

Good to know. Ive been uploading it everywhere.