3

How do you add a custom font into Google Webdesigner?

I see there is an option to include Google Fonts, but I can't find a way to include one of own personal ones.

Tibor Udvari
  • 2,932
  • 3
  • 23
  • 39

1 Answers1

3

Go to Code View add @font-face CSS as you would in a normal html document. Put the font files in assets folder.

Example:

@font-face {
  font-family: LouisRegular;
  src: url(assets/LouisRegular.ttf);
}
@font-face {
  font-family: LouisItalic;
  src: url(assets/LouisItalic.ttf);
}
@font-face {
  font-family: LouisBoldItalic;
  src: url(assets/LouisBoldItalic.ttf);
}

Now simply select the div and apply the font-family from top or from CSS panel in RHS. Note top bar might not give you any auto suggestion of the new font but add it any ways and it should work.

Note: Fonts are often more than 200kb which can hurt your banner budget, if that is the case I will recommend using text as images instead of font.

Imran Bughio
  • 4,811
  • 2
  • 30
  • 53
  • I also realised that you can't really do anything short of adding your own CSS. Since most people are probably using `Google Web Designer` as a tool to create ads, it's worth mentioning that most "ad formats" do not let you include your own font face. GDN currently supports custom fonts via `Google Fonts` though. Creating SVG outlines of the texts it the fallback I had to use personally. Make sure to check the specs guys. – Tibor Udvari Aug 26 '15 at 08:35
  • I am using GWD to create some ads with double click as publisher & thanks for the warring, I will see if they support custom font. – Imran Bughio Aug 26 '15 at 09:19
  • Is there an issue with licensing for paid fonts? – MicroMachine Jun 05 '19 at 00:07