Implementing custom font with #font-face
-
I’m trying to change the fonts up on this page. I don’t like the Serif font they use for the headers, so I wanted to use a retro-gaming font to create an old-fashioned feel. I found and downloaded the font, but I’m having trouble fixing up the CSS to use it.
The font is at http://alpha-build.tecnobrat.com/commodore64.ttf. Do I have to somehow store the font on alpha-build.net? I registered my domain through WordPress, so I can’t set up a subdomain to connect to tecnobrat.com. =/
The blog I need help with is: (visible only to logged in users)
-
-
Just to be clear—the blog is at http://alpha-build.net.
I noticed that when I tried to preview the custom CSS, I used the following code:
[code]@font-face {
font-family: "Commodore 64";
src: url("http://alpha-build.tecnobrat.com/commodore64.ttf");
}body { font-family: "Commodore 64", serif }[/code]
Obviously that won’t work right because it’s the body instead of the headers, but when I tried to save it WordPress actually stripped out the url, leaving this:
[code]@font-face {
font-family:"Commodore 64";
}body {
font-family:"Commodore 64", serif;
}[/code]Is there any way around that?
-
Blargh, apparently I don’t know how to use markup on this forum :P
Sorry! It had me fill in the blog url in a dropdown so I assumed it would display it somewhere.
-
Thanks for posting the URL so we can confirm that it is a blog that’s being free hosted by wordpress.com. The accepted file types that can be uploaded into wordpress.com do not include .tiff files. See > http://en.support.wordpress.com/accepted-filetypes/
Also note that CSS is theme specific, so you cannot use the CSS stylesheets from other themes with the themes here at wordpress.COM. As you are just starting out with CSS editing please read this post http://csswiz.wordpress.com/2009/10/15/if-you-have-the-wp-com-css-upgrade/
I registered my domain through WordPress, so I can’t set up a subdomain to connect to tecnobrat.com. =/
http://en.support.wordpress.com/domain-mapping/map-subdomain/
-
The way to display code here is between backticks ` the backtick is found on the same key as the tilde ~ in lower case.
-
The file indicated above is not actually a .tiff image—it’s a .ttf (TrueType Font) file.
I looked through the post you linked, but as you can see from the CSS I pasted above, I’m not copy/pasting an entire stylesheet—just a small snippet of additional CSS code.
Also, my goal wasn’t to map my blog to a subdomain—it was to map an external website to a subdomain of the domain I registered for my blog. I wanted my blog to be at http://alpha-build.net, but for http://alpha-build.tecnobrat.com to be at http://files.alpha-build.net. I was hoping that would prevent any issues that might be caused by loading a font from another website. Unfortunately, according to http://en.support.wordpress.com/domain-mapping/domain-management/ this doesn’t appear to be possible:
“Can I create subdomains?
No. You cannot setup a subdomain (including “www”) for a domain purchased through WordPress.com. If you own a domain through another registrar, you may map a subdomain.”
-
- The topic ‘Implementing custom font with #font-face’ is closed to new replies.
WordPress.com Forums 