Changing font-family in PDF export (OnDemand)

Hello!

I am looking for some help on adding a new font to my PDF export. I have found a very helpful page on this so I know it can be done!

Advanced PDF Export Customisations

In the Incorporating Other Fonts section it seems to describe exactly what I want to do. However I have to supply a font path that is on the Confluence server. Because I am using Confluence OnDemand, how can I find out what that path might be? And what fonts are available?

Many thanks in advance for any help you can provide,

Helen

2 answers

1 accepted

Hi Helen,

can you upload an attachement with OnDemand ?

If so, this is what I do:

  1. Upload a font file to a page as an attachement
  2. Go to the attachements and copy the URL of this file
  3. Include the font in your CSS with:
    @font-face {
    src: url(URL_of_the_font_file/name_of_the_file.ttf);
    -fs-pdf-font-embed: embed;
    }
  4. Use this new font as any other font with
    font-family: Name of the font*;

* The last part, finding the right name of this new font, is tricky. I think that very often my fonts didn't show because the name of the font is not exactly the same as the name of the file. I think the best guess is to double click the file and search for "Font name: abcxyz" and copy this "abcxyz".

Thanks Steffen! I seem to have it working... I am using Cambria and have attached the bold version of the font to the page. I'm not sure how I'd go about using the italic or normal versions though. I tried attaching the Cambria.ttc (font collection) file to the page, but it didn't seem to work. Might try again though... Any ideas?

That is something I haven't understood either. When I search for Cambria I find four different files for bold, bold italic, italic and regular but the "Font name" for all of them is the same, just "Cambria". So I don't know how you can attach the different versions.

Perhaps upload all of them and still try with a name that includes the version:

src: url(URL_of_the_font_file/Cambria regular.ttf);
src: url(URL_of_the_font_file/
Cambria italic.ttf);

Or try to use them with

p {
font-family: Cambria;
font-weight: bold;
font-style: italic;

}

I can also only try.

Perhaps you find a solution when you search for "@font-face bold italic regular"...

I have it working like this:

@font-face
{
font-family: Cambria;
src: url(//wiki/download/attachments/40698001/cambriab.ttf);
font-weight:bold;
}

@font-face
{
font-family: Cambria;
src: url(//wiki/download/attachments/40698001/cambriai.ttf);
font-style:italic;
}

@font-face
{
font-family: Cambria;
src: url(//wiki/download/attachments/40698001/cambriaz.ttf);
font-weight:bold;
font-style:italic;
}

These @font-faces use the attached fonts in a page that I created for this purpose as you originally suggested.
Then I use them as follows:
h1
{
font-family: Cambria;
font-size: 14pt;
font-weight: bold;
font-style:italic;
}
h2
{
font-family: Cambria;
font-size: 13pt;
font-weight: bold;
}
h3
{
font-family: Cambria;
font-size: 12pt;
font-style:italic;
}
h1 uses the cambriaz.ttf, h2 uses cambriab.ttf and h3 uses cambriai.ttf.
Hope that helps :)

Brilliant - I have been messing around with this for ages - finally this post helped!

Thanks

Indeed it works. Just keep in mind that the comment of @Steffen Heller is real.

The last part, finding the right name of this new font, is tricky. 
I think that very often my fonts didn't show
because the name of the font is not exactly the same as the name of the file.
I think the best guess is to double click the file and search for "Font name: abcxyz" and copy this "abcxyz".

I ran into the same issue for Open Sans font.

@font-face {  
font-family: OpenSans;  
font-weight: 800;  
src: url(//wiki/download/attachments/1000223/OpenSans-ExtraBold.ttf);  
-fs-pdf-font-embed: embed;   
} 

Wasnt working as the use case of @Helen Griffith.

I had to apply the technic listed by @Steffen Heller. Open the font file and copy paste the original name of the font.

@font-face {  
font-family: 'Open Sans Extrabold';  
font-weight: 800;  
src: url(//wiki/download/attachments/1000223/OpenSans-ExtraBold.ttf);  
-fs-pdf-font-embed: embed;   
} 

And it now works perfectly

Confluence OnDemand can only store one font file/collection (*.ttf and *.ttc). You must ask the support to install the desired font for you. Be carefull about the desired font supporting bold, italics and all the required symbols used in confluence.

In my case I wanted DejaVu Font to be my default font. We had a lot of troubles to have all versions packaged in a collection (to show italic, bold and all symbols) but some engineers at Atlassian managed to do it (with FontForge).

So, no workaround. ask the support

Thanks boogaloob—as per my comment to Steffen's response, I kind of have it working. It will probably do for now as the PDF export isn't a regular requirement—I hope!

Suggest an answer

Log in or Sign up to answer
Atlassian Community Anniversary

Happy Anniversary, Atlassian Community!

This community is celebrating its one-year anniversary and Atlassian co-founder Mike Cannon-Brookes has all the feels.

Read more
Community showcase
Kesha Thillainayagam
Posted Apr 13, 2018 in Confluence

We want to hear how your non-technical teams are using Confluence!

Hi Community! Kesha (kay-sha) from the Confluence marketing team here! Can you share stories with us on how your non-technical (think Marketing, Sales, HR, legal, etc.) teams are using Confluen...

373 views 20 10
Join discussion

Atlassian User Groups

Connect with like-minded Atlassian users at free events near you!

Find a group

Connect with like-minded Atlassian users at free events near you!

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you