navigate

hello there!

Thanks for visiting my humble petpage! :P Although I wasn't the first person to do this, I was definitely intrigued when I saw people with fonts using Webdings and Wingdings that I could see in Firefox. So by looking at the code a bit, I figured it out and would like to share it with you :)

Credit

CSS layout by srawasfrozen @ KillTheLights CSS

intro

Hello there! I'm Holly and this is my "getting Wingdings and Webdings on Firefox" page. Obviously. Unfortunately, this method doesn't work:

• in Internet Explorer. The 'dings will show up wrong.
• in Safari on a PC--they will show up as boxes.

As far as I know, these dings are visible for Mac users on Safari, and Firefox, as well as PC users on Firefox and Chrome. Sadly, I'm not a coding or computer expert so I don't know why that is. Basically, this is a way to use Webdings or Wingdings in your fonts if you can't bear not using Firefox, like me. :B If you like to get your fonts rated, I'd strongly recommend taking a screenie of your font if you are using dings regardless.

You also may not be able to get the characters to these dings if you don't have Microsoft Office. There is a certain feature that Microsoft Word has that enables you to get the right characters for these dings, and I'm not sure if any other common word processors have it.

let's start off with character map

Character Map is a nifty little program that has charts of all the symbols of all the font faces you have on your computer. Awesome, right? To get to it, follow the screenshot below (drag and drop into your address bar for a better view).

Fantastic! Now you have opened Character Map.

***For Mac users, I've been told there is a program called Character Palette that is about the same thing. To get to it, go to System Preferences » Personal » International » Input Menu, and click on the box next to "Character Palette." It has a little flag icon. When you copy and paste the Ding you want into Word, and then copy and paste that into your preferences, it should show up. Thanks Eliza for letting me know! OuO

Note: Sunnyneo's Wingding/Webding chart will not work for this.

getting the dings

Once you have Character Map open, scroll down to Wingdings/Webdings and double-click whatever dings you want for your font. They'll then show up in the Characters to copy box.

Highlight the character(s) in the box and copy+paste them into Microsoft Word. A little Clipboard icon will show up next to your pasted Dings. Click on the clipboard, and select Match Destination Formatting'.

Now these dings will be a bunch of boxes. This looks weird, but basically you have simply changed the font face and is now some sort of character that doesn't exist in the default font (which is why they show up as boxes).

Now go to your Preferences page to edit your font. For whatever part of your font you want to have Dings, set the font face to Webdings/Wingdings, and paste those boxes inside the font tags. Those empty box things will now be boxes with a combination of 4 numbers and letters inside them. When you hit "Submit," they should end up like what is in the picture above. Yay!

in conclusion

If you want to know the symbols for a certain ding, but are unable to use this method, don't hesitate to neomail me and ask me to get the dings for you! It's no problem, really; doesn't take much time at all. ;D I am trying to work on a petpage that will have all the dings, but as I am limited in my online time and there are a -lot- of dings, it won't be complete for a while.

Also, I am curious to know whether this works in other browsers on Macs, on Opera, or on Linux/Ubuntu. If it does or doesn't, please don't hesitate to send me a neomail :)

Anyway, thanks again for reading my page. Good luck with your font-making endeavors!

P.S. If you'd like to link back (not necessary at all of course), I have a button here.
<a href="/~Heivaq"><img src="http://i29.photobucket.com/albums/c273/silent_but_crazy/Icons/dingsbutton.gif" border="0"></a>

listed at