Hello! I am using the Bueno theme from Woo (this is my website http://www.kidtineraries.com/blog/ and this is the url of the template: http://www.woothemes.com/2009/11/bueno/). As you can see on the far right, the page navigation (e.g. Home About RSS) and the titles in the widgets are fonts. I want them to look like my logo, so I'd like to make them images instead. Does anyone know how i do this? This is the code for the nav: #pagenav a { color:#000000; display:block; font-family:trebuchet MS; font-size:25px; margin:0; padding:0 15px 10px; text-decoration:none; text-transform:uppercase; z-index:100; } but I don't know the code for the titles in the widgets. Please help!
Uh, I didn't see anything special about the nav on the right (Home, About, RSS) but after turning scripts on and waiting 5 minutes, I could see your special fonts in the titles. That (poorly coded, with all that invalid code, arg I hate template garbage, did you see how many javascripts they've packed in there?!?!?) template is using a javascript called Cufon. Google it: it has some accessibility issues, most notably that users cannot select the text if they'd like. There's a newer rival to Cufon, I forget the name, which might have solved that problem, but I forget. So you'd have to change the font in the cufon script. <script type="text/javascript"> Cufon.replace('h1, h2, h3', { fontFamily: 'ChunkFive' }); </script> Code (markup): Now the font you've used for your logo: is that your own font, or is it a paid font? If it's your own, or an absolutely-totally free font, you may be able to just change the name of the font-family in your script tag. However there are problems if it's a paid font: people would be downloading that font to view your website, which might be illegal (if say you wanted to use Helvetica). So I agree that, esp if that text isn't going to change much, you can do with removing the silly cufon junk and using images. Cufon is nice when you have lots of special fonts for text that changes often: who wants to go make images for every single new piece of text? Since your logo uses a font that certainly isn't web-safe (nobody has it native on their computers), you'll have to make the text yourself in your favourite graphics program, like Photoshop or PaintshopPro or Gimp... Then, to make your page still accessible, you'd prolly want to use Gilder-Levin image replacement, OR just remove the header text and put images inside your header tags: <h3>About Us</h3> becomes <h3><img src="images/aboutus.png" width="thewidth" height="theheight" alt="About Us" /></h3> This way, no images, the user still has the alt text, which you can even style for people using Gecko browsers (Firefox etc). If you want to have more styling ability for the text if the user has no images, then try Gilder-Levin image replacement. That is more code, so only do it if styling the non-image text is imperative. Having an image inside header tags should be fine SEO-wise. It's in a header, so the alt text is the same as header text as far as the googles are concerned.