#m,#n,head,table{display:none;} #m,#mb,#object{visibility:hidden;} table{background:none;} body{font: 8pt georgia; font-weight: normal; color: #4c4c4c;} body{background-image:url('http://img476.imageshack.us/img476/3405/backgroundxlove3jt5.png'); background-color:#dce1ab; background-position:top left; background-repeat:repeat-y;} b{font: 8pt georgia; color: #696969; font-weight: bold; background-color:#ffffff;} i{font-weight:normal; text-decoration:line-through;} u{font: 8pt georgia; color: #828844; font-weight: bold;} h1{font:8pt georgia; color:#a2a2a2; font-weight: bold; background-color:#d8daa8; border-bottom:4px solid #a7af45;} hr{width:150pt;height:5pt;color:#ff75f0;} a:link{font:8pt verdana; color:#9ba256; font-weight:normal;} a:visited{font:8pt verdana; color:#b0b370; font-weight:normal;} a:active{font:8pt verdana; color:#9ba256; font-weight:normal;} textarea{width:100px; height:30px; font:7pt tahoma; color:#8e905a;} a:hover{font:8pt verdana; color:#828844; font-weight:bold; text-transform:uppercase;} #ID{position:absolute; left:0; top:0;} #ID2{position:absolute; left:50; top:460; width:650;} .CLASS{font: 8pt georgia; font-weight: normal; color: #4c4c4c;} />

WELCOME TO LOVE TO MAKE: FONT GUIDE!

INTRODUCTION

Welcome to Nikki's How to make a decent font page. The purpose of this page is for everyone to make a good font just for their own taste. With this guide, I hope you would be able to succeed on making your own fonts. This page will tell you some tricks and how to make the font code of neoHTML and neoSignature under the limit neopets required. If you have the anymore tips you would like to tell others about, neomail nikki about it.


Counter Started on January 6, 2007.

BASIC INFORMATION

NEOBOARDS - USER PREFERENCES Starting off. User Preferences in neoBoards' section is where we can start testing our font we made. Where is the user preferences place I'm talking about? The screenie below shows you how to get there from Neopets homepage.



Are you there yet? =O That's not even a bit difficult xD If you are at the page, we should now observe the page a bit maybe? The user preferences page contains 3 things we should worried most about in this guide, which are Avatars, NeoHTML and lastly NeoSignature. What is font??! Easy Peasy. Let NeoHTML + NeoSignaure = Font ;3 Let me explain a little bit about each one of the 3 parts before we get into difficult steps ahead.

1)Avatars: This is the small 50x50 icon appeared on the left side of your message whenever you post on NeoBoards or in your guild. Many Neopians make their fonts to fit their current avatar. Why? It's pretty I guess. A lot of font raters do rate if your avatar and font matches together. Some of them do use default avatar with random fonts. Whichever way you like, I suggest following it. =)) The more avatars you have, the varieties of avatars to match your font with. Avatar starried is a good avatar site where you can check for avatar guides and more! To go check the page, copy and paste into your "address" box.


2)NeoHTML: It is always a must to include the word neoHTML however you try to design it. The word "neoHTML" represents your message (what you wrote). You are able to design your neoHTML part with font tags changing colors, font family and even sizes (This will be introduce in the next section of the guide). NeoHTML has a limit of 120 characters available to type. The image at the left is an example of my neoHTML for the Sloth! font.

3)NeoSignature: This part of the font will appear just below your neoHTML. It will of course be seperate by a dashed line. This is known as the "siggy line." Also in later section, I would tell you how to get rid of this siggy line. Just like the NeoHTML, you would be using the same exact tags. Same with the NeoHTML, NeoSignature has a limit of 120 characters. The image at the left is an example of my neoSignature made for the Ruki - Mummified Font.

Now that you know the different parts of Fonts, we shall get you started into the next step of tags. At this point, if you're having any difficulties, don't hesitate to neomail nikki if you have questions! I'll be glad to answer if I do can.

THE TAGS

Oh this is so important. Remember it well ;) Through this font tag, you are able to change the wordings' color, font family and size as I've already explained before. "How do you do that?" you might ask. Read on.



The example above is called the tag. There are 3 major things you should know about this:

1)Size or S As you might have guess, you may choose a variation from size 1-4. One making your wordings look smallest and 4 is the largest. When you want to change your font size, type size equals to "a number" as shown above.
Current: [fonts=1]Hello![/font]
2)Font Famly or F This is where you can change your font family to what you desire. Note that there ARE some font family which would not be able to use in fonts such as Century Gothic. don't forget to use f=a font family as an example above. For a list of Font family you are able to use copy the link in the textarea below. SunnyNeo Provides a nicely placed Chart.
Current: [fontf=verdana]Hello![/font]


3)Color or C This is where you edit your colors. This might be considered the hardest of the 3. You are able to use the actual color names or the hexcode.
Current: [fontc=red]Hello![/font] or [fontc=#FF0000]Hello![/font]
  • The Actual Color Names: There are lots of actual colors names you could use but it will be a full list of it once i type it all out. If you want to see pretty much all of it try searching in Google with title, "Font Colors". Examples are: Fuchsia, Lavender, Cyan, Yellow, Red, Green, Blue, Teal, Black, et cetera.
    Note* You always have to check what you wrote. Always type in gray instead of grey. It will turn bright green with "grey."

  • What is hexcode? Hexcode is a series of 6 numbers which represents each color. It is made by 3 primary colors of red, yellow and blue mixing together in the computer. There are 16 total characters used for Hexcode which are 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E and F. This is when you start making each colors match your avatar. If you have such programs like adobe photoshop or paint shop pro, you may use the color picker like shown below.

  • Copy and Paste (Ctrl C + Ctrl V) the avatar into adobe. You can zoom the picture if you want like what i did with the pink square. After that double click on the green square to get the color picker pop-up bar to appear. You may also click on the green circle/eye dropper tool but the pop-up won't appear. When the popup shows up, click any where in the avatar you want to find out the hexcode color until you get something like above. See the popup, the yellow square shows you the hexcode.

  • Here's another step but for people without programs like adobe photoshop. Download GetColor! - Color Picker from the site below. It is free and you are able to get any color from any pixel of the avatar. (Thanks gabbygabby_02 for this!)


    For an example, this is how GetColor! looks like ;3


  • If you do not have/not allowed to download any programs for graphics or any sort, you might as well try it this way. This is in Paint and Msn 8.0 Plus.

  • Open Paint, Copy and Paste the avatar into the program. Use the eye dropper tool and click on the avatar where you want to find out the color. go to Colors, Edit Colors. A Edit Colors Pop-Up Bar will appear. Click Define Custom Colors to make it looks like the above. After that remember the Red, Green Blue OR Hue, Sat, Lum. Doesn't really matter which one, it will turn out the same.


  • When you got the numbers, open msn. Click on the Format Panel as shown above. Follow the instruction until the popup appears. This time type out the numbers of those you remembered. Be careful not to switch if at first you chose RGB but later got the HSL or vice versa. When you're done, click okay. A tag will appear, but don't copy it out! Just take the hexcode (ex. #203451)
    *Note*: You are also able to use microsoft word instead of paint to get the RGB :3


    This is what you shouldn't do AT ALL. The original neoHTML has a size of 2, font-family of Arial and a color of Black. It would waste your space if you put any of these in. It will look the same with or without s=2, c=black, c=000000, f=arial. Don't forget there is a limit of characters!!

    ARE YOU CONFUSED? if so neomail me.

    OTHER TAGS

    There are more tags where you can decorate your neoHTML and neoSignature. Here are a whole list of them.

    [b]word here[/b] = Bold.
    [u]word here[/u] = Underline.
    [i]word here[/u] = Italic.
    [sup]word here[/sup] = Words above the line.
    [sub]word here[/sup] = Words below the line.
    [quote]word here[/quote] = Quote obviously.
    [center]word[/center] = center.
    [br] = skip down one line
    [p] = double of br. skip down two line

    Use your creativity and i'm sure you'll be able to make it pretty. Originality is the best thing. If you're heading for my award for an example, originality is worth 5 points out of the total 10 rating score.

    FONT TRICKS

    So there are font tricks. First I'll tell you how to get rid of the signature line, or siggy line.


  • To get rid of this, add [ in the neoHTML section. and close it with ] in the neoSignature . Put it right at the back for neoHTML and put it right in front for neoSignature.


    The End Result will look like this.

    Even more complex tags together could turn out to something like below, but anyhow, you would need to use it wisely so you can add more things to decorate.

    ------------------



  • Center - With the tricks to get rid of the siggy line [,] it helps connect both neoSignature and neoHTML together. Because of this, you do not need to add two center tags, each for neoSignature and neoHTML. You could do just like shown above.
    NOTE* below (Font Color Tricks) does not work anymore if you use Firefox with the new neopets layout. You must put a # and 6 hexcode letters/numbers. For IE user, I suggest if possible to try make it the full hexcode so that everyone can see clearly.
  • Font Color Tricks - For the hexcode, you do not need to add the whole thing (ex. #404040) in there. For neopets, you are able to only provide the first 5 of the hexcode. The font color will still be the same. From c=#404040 change it c=40404.
  • Redundant Tags - From the above image, you see two bold tags, one after another. Congratulations! You've just wasted 7 precious characters! :P Do connect it together as one. If and only if it's close to one another.
  • Additional Words with NeoHTML In yellow, you saw two slashes (or //) This shows that you CAN add more stuff to your neoHTML if you want. The only thing that is not allowed is if you didn't put any neoHTML where neoHTML should be =PP
  • Smilies - I guess you all know this but i'll add it down anyways. You can put smilies into your neoHTML or neoSignature. The *chia* above is an example.

    ------------------

    Hidden/Invisible Fonts


    As you can see the font turns invisible. With this, you are able to make words look unique in a way by placing at different location of the font. To be able to do this, you could do two ways which are:
    [fontc=snow]text here[/font]
    OR
    [fontc=FFFFF]text here[/font]

    Need more help with this section? Click here.

    FONT STRUCTURES

    This is one of the structure on how you can make your font.
    People do not have the same point of view and because of this, I would make structures for fonts with lots of symbols and plain fonts. More to come soon!!



    SHOW THE WORLD YOUR FONTS

    After you've made your fonts, all you need to do is print screensave it (ONLY IF YOU WANT TO). This is an additional help for people who do not know how to screensave. It's really easy, trust me on this ^^ First thing you need to do, observe your keyboard. Next find the word, "PrintScreen SysRq" on it. It could also be differently written such as "PrtScr SysRq." As you might have guess, yes click on it. Click on it while opening the page you want to screensave. Done that? Open a program such as paint, adobe photoshop, etc. Then paste it. You can cut it out and left with only your font if you want, up to you to decide. Save it, and Congrats ;33

    Don't understand any steps? Want some screenies step-by-step? Neomail me!

    TRY FOR MY FONT AWARD?

    If you think your marvellous font might qualify for your award, don't hesitate to neomail me and get a rating!!

    Here are my font awards:


    This is for a rating of 9.5 and above only. (I personally like my 8/10 font award better lol xD)


    This is for a rating of 8 and above only.

    - - - - - - - - - - - - - - -

    My Font Rating System
    5/5 on 'Creativity and Originality
    1/1 on Avatar Matching
    2/2 on Visibility and Positioning Structure
    2/2 on Others (overused symbols, plain-ess, impressive, et cetera.)
    Overall 10 out of 10.

    I give out suggestions if you want to know. I don't think I'm harsh, I guess. I do support you on making your font what you like more than if the rater like.

    If you want to see my fonts, click HERE. Neomail me by clicking here.

    LINK BACK TO US?

    There would be more to come soon. If this guide helps you, I would appreciate it if you link back to us. If you have something you would like us to post here for you (with your credits of course), you can do so by neomailing me. It could be wordings, structure image like above, or as even a screenie.
    This are the banners/buttons I made if you do want to link back.




    If you have any questions, or if the guide isn't clear, please do neomail nikki if you need help. Send me your code if you need me to check it out. Thanks for checking by!

    SCREENIES TO SEE









    OTHER COOL PLACES

    Bubble's Font Dictionary


    F.O.N.T - By stargal368


    Alonna's Adoptables


    If you have a page that you want me to link to here, neomail me.

    Credits

    Thank you Neopets for a place to place Love to Make: A Guide to Beaufiful Fonts at. Special Thanks to Destiny954, B-A-S-H and RazorICE at DeviantArt for the brushes. (In case you're wondering, no other brushes were used in this page). && Also Thank you imageshack, adobe photoshop cs2. This is made by Nuknik (Nikki) aka xx_sp1ff3h. No stealing.




  • Heads Up! You're about to leave Neopia!

    You've clicked on a link that will take you outside of
    Neopets.com. We do not control your destination's website,
    so its rules, regulations, and Meepit defense systems will be
    different! Are you sure you'd like to continue?



    It is a journey
    I must face...alone.
    *dramatic music*
    I want to stay on Neopets,
    where the dangers of
    Meepit invasion
    are taken seriously.
    Heads Up! You're about to leave Neopia!

    You've clicked on a link that will take you outside of
    Neopets.com. We do not control your destination's website,
    so its rules, regulations, and Meepit defense systems will be
    different! Are you sure you'd like to continue?



    It is a journey
    I must face...alone.
    *dramatic music*
    I want to stay on Neopets,
    where the dangers of
    Meepit invasion
    are taken seriously.
    Heads Up! You're about to leave Neopia!

    You've clicked on a link that will take you outside of
    Neopets.com. We do not control your destination's website,
    so its rules, regulations, and Meepit defense systems will be
    different! Are you sure you'd like to continue?



    It is a journey
    I must face...alone.
    *dramatic music*
    I want to stay on Neopets,
    where the dangers of
    Meepit invasion
    are taken seriously.
    /help/bumper/headers/log-in-to-facebook

    NEOPETS, characters, logos, names and all related indicia
    are trademarks of Neopets, Inc., © 1999-2014.
    ® denotes Reg. US Pat. & TM Office. All rights reserved.

    PRIVACY POLICY | Safety Tips | Contact Us | About Us | Press Kit
    Use of this site signifies your acceptance of the Terms and Conditions