Can someone explain how to add custom fonts to a non-developer? | Community
Skip to main content
September 20, 2013
Solved

Can someone explain how to add custom fonts to a non-developer?

  • September 20, 2013
  • 6 replies
  • 5223 views
I would like to be able to use custom fonts, but I'm not sure exactly where to make this happen in our CSS and how. 

Thanks!

Greg
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by
Greg,

you can do this by adding the CSS file into landing page instead of template,

Here are the steps,

Continue till step 4 from the above link,
step5: Edit the landing page
step6: Drag drop a HTML element and paste the CSS on it.

use the font reference where ever required.

Thanks,
SK

6 replies

December 23, 2015

Wow! Thank you so much for this post. It helped immensely!

Accepted solution
September 30, 2013
Greg,

you can do this by adding the CSS file into landing page instead of template,

Here are the steps,

Continue till step 4 from the above link,
step5: Edit the landing page
step6: Drag drop a HTML element and paste the CSS on it.

use the font reference where ever required.

Thanks,
SK
September 28, 2013
Is there a way to do this within a specific landing page in the design studio and not in a template?
September 25, 2013
Hi Greg,

You can refer the link below for step by step instruction,

http://info.regalix.com/how-to-add-custom-fonts-in-marketo-templates.html

Thanks,
SK
September 22, 2013
Hi,

I'm not sure where that is supposed to go? Again, I'm a non-developer, so anything that walks through step-by-step would be of great help. Thanks!

Best,
Greg
September 20, 2013
Hi Greg,

You can achive this using @font-face rule in CSS.

Sample code:

@font-face {
font-family: 'AauxProBold';
src: url('/rs/xxxxx/images/aauxprobold0.eot');
src: url('/rs/xxxxx/images/aauxprobold0.eot?#iefix') format('embedded-opentype'),url('/rs/xxxxx/images/aauxprobold0.woff') format('woff'),url('/rs/xxxxx/images/aauxprobold0.ttf') format('truetype'),url('/rs/xxxxx/images/aauxprobold0.svg#aauxprobold0') format('svg');
font-weight: normal;
font-style: normal; }

You can assign the font family as below,

h1{font-family: 'AauxProBold';
font-size:40px;
line-height:42px;
color:#bbd5ef;}

Note: there are some online font face generators which can be used to generate fonts in a required format and corresponding CSS.

Hope this helps.

Thanks,
SK