Skip navigation.

Ramblings

a test …

Use webfonts in your blog, NOW!

, , ,

You might have heard some fuzz about webfonts by now. It's super-easy to use your own webfonts in your blog here at My Opera, so that visitors with Opera 10 can benefit from the evolution of web technologies.

First find a font of your taste somewhere, there are thousands of free web fonts out there, just search for "free fonts" in any search engine.

Then go into your account page, and select the Layout menu entry. Select a blog theme other than the default one. Then click on the link to add a personal CSS rules.

At the top of the form simply include the following:

/* Special font-face selector */
@font-face {
  /* "Nickname" of the font to refer to it later */
  font-family: "acoustic";
  /* Change the url to point to wherever your font resides */
  src: url("http://www.webpagepublicity.com/free-fonts/a/Acoustic Bass.ttf") format("truetype");
}

h1,h2,p,a,div.content {
  /* refer to the font "nickname" to apply it to the elements you want */
  font-family: "acoustic";  
}
Done!

Drag images and pages around with your mousePerl iron-man initiative

Comments

sms985 6. March 2009, 17:06

amazing!

Charles Schloss 6. March 2009, 17:32

:cool:

I am using the Opera 10 theme blog :smile: with web fonts

DrLaunch 6. March 2009, 22:48

Nice. But could you select a more readable font for your blog? P:

Anonymous 7. March 2009, 09:00

Anonymous writes:

My eyes! Aaargh! It burns!

Nicolas Mendoza 7. March 2009, 10:27

drlaunch, yes, just used a crazy one as an example :wink:

Espen Myhre 11. March 2009, 18:41

so nice :smile:

Manu 19. June 2009, 21:32

Thanks, been looking for something like this, finally found it. Now,a testin period to see which fonts look better :D

::Some One:: 23. August 2009, 00:59

I can't find this CSS (((

DrLaunch 23. August 2009, 14:13

The code is in the dashed rectangle above.

You add the code in My Page -> Design -> Custom Style Sheet. Make sure you set it to use your code together with the default style sheet.

::Some One:: 23. August 2009, 14:50

Thanks, I'll tray

::Some One:: 23. August 2009, 15:20

It's not working ((( :cry:

DrLaunch 23. August 2009, 20:17

No wonder. The code from the rectangle above isn't showing up in your custom style sheet. Did you copy it and paste it in your custom CSS? Did you save it?

::Some One:: 24. August 2009, 03:41

yes.... Oh...:whistle: Let it be that there is)) :smile:

Jerry Rumsfeld 28. November 2009, 07:52

Ok, I _know_ this is an ancient post. But it seemed the right spot to put it.

You surely have seen Up Rough's Ascii Arena, yes? If not: http://www.asciiarena.com ; and yes of course it works nicely in Opera. It's Safari that has issues (and not _all_ webkit browsers do but Spot allows OWB on MorphOS to work now (: )

Anyway. So. Notice anything about the fonts? (: Ah, of course you do. Also, well, thought you'd like it anyway.

- also, you were not at Kindergarden? Or was I just too busy working on the demo that we didn't release? Waffle and Baffle were there, maybe you only allow *affle people to go to KG from Opera now, cuz p01 was mia as well...

Nicolas Mendoza 28. November 2009, 17:37

Hehe, wasn't there, too tired, sorry.

Oh wow, that IS AWESOME! topaz FTW ;DD

How to use Quote function:

  1. Select some text
  2. Click on the Quote link

Write a comment

Comment
(BBcode and HTML is turned off for anonymous user comments.)

If you can't read the words, press the small reload icon.


Smilies

Download Opera, the fastest and most secure browser
December 2009
M T W T F S S
November 2009January 2010
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31