Docs

[Abd Ur Rehman]

Hello there!

Quick question?

how do I set my custom font as the default font for, say, my H1 headings, etc.?

Thanks!

[Rupok]

Hi there,

Thanks for writing in! You can set default fonts for Heading and Body from Customzie > Typography – http://prntscr.com/dx2abk

Cheers!

[Abd Ur Rehman]

This reply has been marked as private.

[Rupok]

Hi there,

Did you add the custom font already. Here goes the step by step guide to add custom webfont to your site.

You can add custom fonts to your website using CSS3 @font-face rule. To do this, please review this article: http://css-tricks.com/snippets/css/using-font-face/

Basically you need to add the following code in your child theme’s style.css file (if you haven’t installed a child theme, please visit this to install Child Theme):

@font-face {
  font-family: 'MyWebFont';
  src: url('path-to-your-font-directory/font_name.eot');
  src: url('path-to-your-font-directory/font_name.eot?#iefix') format('embedded-opentype'),
       url('path-to-your-font-directory/font_name.woff') format('woff'),
       url('path-to-your-font-directory/font_name.ttf')  format('truetype'),
       url('path-to-your-font-directory/font_name.svg#svgFontName') format('svg');
}

Replace MyWebFont with the name of your font, path-to-your-font-directory with your fonts directory URL (e.g, http://yourwebsite.com/fonts) and font_name with your font’s name.

Next, whenever you need to use this font, simply use “MyWebFont” (or your custom font name), e.g:

body {
   font-family: 'MyWebFont', sans-serif;
}

Hope this helps. 🙂

Thank you.

[Abd Ur Rehman]

This reply has been marked as private.

[Lely]

Hello There,

Yes that is correct. Please just adjust to this:

h1, .h1{
   font-family: 'MyWebFont', sans-serif;
}

Hope this helps.

[Abd Ur Rehman]

Okay!

Thanks a lot!

[Joao]

You are welcome 🙂

[Author]

Posts