How to include custom font for body?

[Green thumb]

Hi guys.

I’d like to have this free font family for my body: http://www.dafont.com/old-london.font

I’m not sure how do I include this?

Is the procedure the same as for this topic http://support.swiftideas.net/forums/topic/custom-font/ ?

Thank you in advance.

[Cosmin – SUPPORT]

Hey,

Yes, that’s pretty much it. Just need to upload it to your theme folder, then specify the CSS for it.

Regards,
————————————————————————————————————

Cosmin
Support Assistant

[Green thumb]

Hi Cosmin,

I’ve copied:

olondon_-webfont.eot
olondon_-webfont.svg
olondon_-webfont.ttf
olondon_-webfont.woff

To the /wp-content/themes/flexform/

Then I’ve edited style.css in /wp-content/themes/flexform/

I’ve added:

@font-face {
font-family: ‘old_londonregular’;
src: url(‘olondon_-webfont.eot’);
src: url(‘olondon_-webfont.eot?#iefix’) format(’embedded-opentype’),
url(‘olondon_-webfont.woff’) format(‘woff’),
url(‘olondon_-webfont.ttf’) format(‘truetype’),
url(‘olondon_-webfont.svg#old_londonregular’) format(‘svg’);
font-weight: normal;
font-style: normal;
}

in the file and and I’ve changed:

body, h1, h2, h3, h4, h5, h6 {
font-family: “Myriad Pro”, Arial, Helvetica, Tahoma, sans-serif;
font-weight: 300;
}

into:

body, h1, h2, h3, h4, h5, h6 {
font-family: old_londonregular !important;
font-weight: 300;
}

Unfortunatelly I still don’t see any changes. Did I miss something maybe?

Thank you for your help.

P.S. I’ve attached zip files with .eot .sv .ttf .woff files.

[Cosmin – SUPPORT]

Make sure the paths to the font files are correct. Best use absolute paths, with http://

Regards,
————————————————————————————————————

Cosmin
Support Assistant

[Green thumb]

Hi Cosmin I’ve managed to enable old_londonregular without http.

The only problem is that it takes effect only if I edit style.css

I had to paste this into style.css:

/* custom old_londongregular font
* =============================== */
@font-face {
font-family: 'old_londonregular';
src: url('olondon_-webfont.eot');
src: url('olondon_-webfont.eot?#iefix') format('embedded-opentype'),
url('olondon_-webfont.woff') format('woff'),
url('olondon_-webfont.ttf') format('truetype'),
url('olondon_-webfont.svg#old_londonregular') format('svg');
font-weight: normal;
font-style: normal;
}

body, h1, h2, h3, h4, h5, h6 {
font-family: 'old_londonregular' !important;
font-weight: 300 !important;
}

How do I do this in custom css under general options?

When I tried to change copyright text, I had to edit style.css and change font-size from 11 to 18px:

Howd do I do that in custom css under general options?

2799 #copyright p {
2800 font-size: 18px;
}

When I tried to change breadcrumbs font-size I had to edit style.css:
1311 #breadcrumbs {
1312 font-size: 18px;

Is there a way to do this in custom css under general or will I have to save style.css all the time and vimdiff it everytime theme gets updated?

Thanx for your helo Cosmin!

[Cosmin – SUPPORT]

For anything that overrides default theme styles, you will need to use !important in the Custom CSS from the theme options, otherwise it won’t work.

Regards,
————————————————————————————————————

Cosmin
Support Assistant

[Green thumb]

Thank you Cosmin!

You are the best!

[Cosmin – SUPPORT]

You’re welcome, glad to help 🙂

Regards,
————————————————————————————————————

Cosmin
Support Assistant