Embedded fonts with hiqpdf - html

I'm trying to generate a pdf from html by using Hiqpdf. As they say in the website: http://www.hiqpdf.com/documentation/html/037cb13e-febe-4d08-a90c-a08bbd5a4348.htm this dll supports fonts embedding. However, I'm using the following fonts stored in my computer and it doesn't work.
#font-face {
font-style:normal;
font-weight:normal;
font-family:f2generic;
src:url('C:/Users/myuser/AppData/Local/Temp/f2generic.otf') format("opentype");}
I don't know is it is something wrong with the path (as it must be absolute path or the format of the font). In html format i can display the fonts right.
I checked property htmlToPdfConverter.Document.FontEmbedding and it is true, so I don't know why it doesn't work.
Thanks in advance.

You should try to use fully qualified URLs for resources like file:///C:/Users/myuser/AppData/Local/Temp/f2generic.otf

Related

How to reflect custom font for Urdu (or other RTL language) in document with SCSS and Markdown?

I'm trying to add Urdu (right-to-left) content to my site, built using Zola (static site generator). Zola only reads/publishes .md files, so can't just publish html files directly, and so am trying to modify the markdown file to use the right font. It works great for English content (where I use the default fonts), but I'm having issues in extending its functionality to Urdu.
The default font reflects Urdu content in Arabic-style Naskh rather than Urdu/Persian-style Nastaliq. This makes it harder to read.
I've downloaded the google font Gulzar-Regular and added the following lines to my main.scss html file. I was expecting to be able to change the font variables for specific text, e.g., as we can make text right to left, or larger in size. I was expecting to be able to do the same for the font itself, i.e., telling the build to use this particular font in this context.
When this didn't work, I did a lot of googling to understand if other's had a similar problem. I found some material for converting right to left, and to use RTL languages for one-off words within mostly English content, but that did not address the usage of fonts. Some usage was also found re fonts but that was typically within a single html file, not within a separate SCSS and md file.
Here's what I've tried:
(in main.scss)
html { #font-face{
font-family: {"Gulzar-Regular", serif;
src: url(Gulzar-Regular.ttf);
}
I've also tried:
html {
font-family: Gulzar-Regular;
src: url(Gulzar-Regular.ttf);
}
Note, I downloaded the file (ttf) in the same directory as the main.scss file.
In my .md file, I've added:
<div dir="rtl">
<span style="font-family:Gulzar-Regular;font-size:1em">
!CONTENT!
</span>
</div>
In either case, I only get Naskh (i.e, default font). Would love to hear from anyone who has used additional fonts, especially for non-latin and right-to-left languages like Arabic, Hebrew, Persian, etc.

Vega Lite font availability

I was wondering if there is a list of supported fonts used by Vega Lite? I didn't manage to find in the docs but maybe missed in.
Specifically I am trying to use museo sans 300, which works fine in my D3.js code, but doesn't seem to be recognised in Vega Lite.
Is there a way to link to custom font files?
The way I get custom fonts for Vega Lite charts in my website is simply via CSS!
First: Define a font in your CSS
#font-face {
font-family: MyFont;
src: url(fonts/somefont.ttf);
}
Second: Refer to the font name in your Vega Lite configs
axis : {
titleFont: "MyFont"
}
Hope this helps, this is not directly related to your goal from question but still gives you ability to do custom fonts inside the chart.

How to enable (custom) admonition icons when converting asciidoc to html5 using the maven plugin

I use the asciidoctor-maven-plugin(1.5.3) to convert asciidoc files to pdf and html files.
Problem:
The pdf file that is created is rendered including the admonition icons - So, all is well here.
The html file on the other hand does not seem to be created in the right way - the admonition icons are missing. There is no text/caption instead just a strange placeholder.
I tried using the :icons: font backend attribute, where font is the only option I found in the asciidoc documentation.
(By the way this is the same as adding <icons>font</icons> like shown below in the pom.xml.)
The font option should show icons from http://fortawesome.github.io/Font-Awesome/icons/ but it does not.
Question:
Do I have to import those icons form anywhere or dowload them and specifically include them using the :iconsdir: path/to/icons backend attribute?
The important part of the pom.xml looks like this.
<configuration>
<backend>html5</backend>
<sourceHighlighter>coderay</sourceHighlighter>
<attributes>
<imagesdir>./images</imagesdir>
<toc>left</toc>
<icons>font</icons>
<sectanchors>true</sectanchors>
<idprefix/>
<idseparator>-</idseparator>
</attributes>
</configuration>
Ok, this is embarrassing, at least one half of the story.
The embarrassing part
The actual mistake I made was using the noscript firefox plugin, which disallowed the use of fontawesome....
In fact, I had to explicitly allow cloudfare.com in noscript to make it work.
So, my pom.xml stays with the attribute <icons>font</icons>.
The good part
I found out how to use custom icons:
declare <iconsdir>./images/icons</iconsdir> (This is also the default, relative to the source directory.)
copy some icons in it. I got them from here. (Pay attention to the names: note.png for NOTE: This is a note.)
change <icons>font</icons> to <icons>image</icons>

Using Font Faces - Your own font

I'm trying to add my own font to my website I have checked out quite a few stackoverflow articles many seem to be browser specific or path issues. I cant seem to get my font to display on any browser, anyone know what's up?
#font-face {
font-family: "Helvetica";
src: url('http://spawnasite.co.uk/Helvetica-Condensed-Light-Light.ttf') format("truetype");
}
h1{
text-align: center;
text-transform:uppercase;
color:#232323;
font-size: 24px;
font-family: "Helvetica", sans-serif;
}
Js Fiddle here http://jsfiddle.net/Gz26Q/
My guess here is that the font you're referencing is protected.
Not all font foundries, especially one like Helvetica, allow their fonts to be embedded. They have code within the font to prevent this.
You could still use the font on your computer, but not embed it within another application or document that doesn't have the font installed.
As a reminder from what has been mentioned before:
Change the name of your custom font-family from "Helvetica" to something else in order to avoid overriding default naming conventions.
Use multiple types of fonts for backups.
Additionally,
I highly recommend looking at FontSquirrel -- some fonts even have their own webfont kit pre-made for you to use out of the box.
If you try to load fonts in Chrome and want better rendering -- be sure to put the SVG on the top of the declaration. See here for more information.
You are trying to override an existing font, call it myHelvetica
Use others formats: eot, wot.
See these links:
http://blog.themeforest.net/tutorials/how-to-achieve-cross-browser-font-face-support/
http://caniuse.com/ttf
The basic problem is very simple: the URL of the font resource is wrong. An attempt to fetch http://spawnasite.co.uk/Helvetica-Condensed-Light-Light.ttf results in 404 Not Found.

Alternate Gothic No. 2 not embedding properly

I'm writing a Pure AS3 app, embedding a font using the Embed metatag like so:
[Embed(source="assets/fonts.swf", fontName="AlternateGothic No2")]
public static const ALTERNATE_GOTHIC_2:Class;
This has always worked for me, but Alternate Gothic No. 2 gives me issues. In Flash, the font is labeled as AlternateGothic and the style is No2. I typically combine these with a space in between as the fontName, but it's not working.
The font is Postscript Type 1, so I can't embed the file and fontFamily, unless I spend $100+ on a font converter.
I also tried creating a font symbol, but that didn't work either. Any ideas?
FontExplorerX has the font labeled as AlternateGothic-No2, so I tried that and it worked.