People Who've Helped

Flower Kiss @ MyOtaku
LadyNebulaStar @ MyOtaku
Le Kun @ MyOtaku
Magnus Lensherr @ MyOtaku
Sariana @Facebook
Silent Love @ MyOtaku
PyschoChaosNinja @MyOtaku

I also would like to thank all those who had codes on their sites that I learned from...I have forgotten some of your names but you have my deepest thanks. ^_^

Before we start please read�

I put up this site for the aid of people who do not know much HTML and really want to fix their site. I�ve fixed the codes to work with MyOtaku. Hopefully people will be able to use these codes with ease and have an easier time. ^^
Because of some of the people on here I have to now resort to rules and guidelines. Follow them and be nice, or don't follow and earn my dislike!

1)) If there are any parenththesis for codes then Remember to always replace the parenthesis (and )�s with the angle brackets < and >�s in the codes unless I say so. Otherwise the codes will not work.
2)) Please remember that I am taking all this time to do this and it takes a great deal of effort. Please, no harassing me with asking for more codes or help.
3)) I would appreciate it if you would put a link back to here on your site so that other people can know about this place. I cannot force you though so I must rely on your good will.

Thanks again,
Take care and God bless you all,
Shishou

Basic text alterations

Let�s start with the simple things shall we? These are a few basic things it is nice to know.

1. Bold. To make your words come in bold, use this code Put the words you want bold here

Example. This is how bold looks.

2. Italic. To make your words italic, use this code Put words here.

Example. Hello!

3. Underline. To make your words underlined, use this code Put words here you want underlined.

Example. No!

4. Strikeout. To make your words look like they were crossed out, use this code. <S>Put words here.</S>

Example. ~~Help me!~~

5. Big. To make your words big, use this code. <BIG>Put words here that you want big.</BIG>

Example. I am big now!!! Huuhahaha!

6. Small. To make your words small, use this code. Put words here.

Example. I am tiny�Nooooo

7. Superscript. To make your words go upwards use this code. Put words here

Example. ^{I fly in the sky.}

8. Subscript. To make your words go lower than others use this code. Put Words Here

Example. _{I am a woooorrmm! Not really but I feel like one. XD}

Advanced Text Alterations *NEW!*

This is something I love to do for my site. Adding special effect to your text. For example you can check out my site. See what I mean? If you don�t that is alright too. ^^; What I wanted you to notice was, I�ve got a lot of special effects going on with my text. I just add on to the basic alterations given to you in the previous lesson(?) Mind you I am not going to explain the coding works. Just giving it to you. (I fear I will botch it otherwise) I expect people more familiar with HTML/CSS to know how to use these.
If you don�t here is a brief instruction: all you need to is copy the code, paste it on notepad or other similar word processor, add your preferences(if your not sure then look below at the Font Codes section, it should explain all), and paste it in your EDIT POST STYLE and lastly use the , <s>, ect codes to activate them.

Special Effects

basic

more advanced

Font Codes: changing it, making it a different color, getting the size bigger or smaller.

Lets get started on the font codes shall we? You want to change the color? Easy! A simple code to change your font color is this.
words go here.

You can also put the color code instead of the color name. The hex code attribute is kind of difficult to use if you want to pick out a custom color.

i.e #663300=dark red which will make the font look like this.
The way the color was defined in the above example was in hexadecimal, or "hex code." Hex code, for defining HTML colors, consists of three pairs of numbers/letters. The first pair corresponds to that color's red value, the second to the color's green value, and the third to the color's blue value. (If you've ever used a graphics program and made your own custom colors, it's like that, mixing various amounts of red, green, and blue). The numbers/letters themselves go from 0 to F (0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F), and the higher the value, the brighter the shade. #000000 is black, for example, and #FFFFFF is white.

Now on to changing the font to different fonts. The code is this one. type the words here.
There are many types of fonts some of them aren�t supported on certain browsers. The ones most common fonts are,
Arial=Which looks like this.
Verdana=Which looks like this.
Times New Roman=Which looks like this.
Trebuchet=Which looks like this.
Courier=Which looks like this.

Now on to font sizes. Something that comes in handy when you need it. The code? Why it is right here! ::*grins*::
Words go here.
The bigger the number the bigger the size of the font.
Examples.
size 2.
size 3.
size 4.
size 5.
size 6.
size 7.

Simple you see?
Now let�s try putting all three codes together. Here it is when I put it together,
type the words here
Let�s see� I want a blue color, and the style to be courier and the size to be 4, what am I going to do? Well this is what it�ll look like when I type those things into the code! ------>
Step away from the rabbit!
Let�s try it out now.
Step away from the rabbit!
Waah laaa!

Backgrounds

Here are the steps for getting a wallpaper/background for your site.

1.)) Find a wallpaper generally 1024 by 768 or a simple picture will do fine�

2.)) Save the image or copy the URL( also known as copy image location)

3.)) Go to ImageShack or Photobucket.

4.)) Browse for the picture on your computer or if you copied the image location, click where it says url(for imageshack) and paste the URL in the upload box. Or click to where it says upload images from URL(for Photobucket) and paste the URL in the upload box.

5.)) Once you load the picture you want to copy the code that starts with http://

6.)) Go to edit styles and paste it where it says,
Add A Background Image
(Format: http://www.site.com/file.gif)

7.)) Than load�

8. And you have a wallpaper now!

Many, many, many people has asked this question. One of the most popular questions asked,
�How do you get your background to stay still?�
There are several codes for this effect. But I�ll show you just one. This one is a little easier to do then the rest I think. Plus this one works for your main background and your guestbook background to stay fixed in place. Whereas the other code just keeps the main background in place. And in addition to keeping both backgrounds still it makes your background wallpaper seeable too.
Simple! The easiest way to do it is to go to edit styles and type FIXED into the boxes across,
Change Main Background Color,
Change Site Border Color,
Change Inner Background Color,
Change Menu Color,
So it would look like this if I typed FIXED into the boxes, ----

Change Main Background Color

Add A Background Image
(Format: http://www.site.com/file.gif)

Change Site Border Color

Change Inner Background Color

Change Menu Color

Everything making sense so far? I certainly hope so, because this code I am going to show you next can be a little tricky and difficult to understand for people new to HTML and even a little tricky when you know some HTML. I shall try to make it understandable as best as I can. I am going to show/tell one of the codes that let you have two separate wallpapers, one for your main page and one for your guestbook page. A special thanks to LadyNebulaStar for this code. ^-^
This is how she told me to do it, pretty much word for word. Thank you so much LadyN!!!

In your Edit Profiles, go to the box where you wrote your "Introduction" at. Once you are at your "Introduction" box, place your cursor after your introduction message, or if you have a picture, after your picture code, make sure you press the enter button twice or more after your Introduction message to make some space in between.
(If you have a picture after your Introduction message, the enter twice of more) Note: Do not enter too much, twice is what I recommend. After you did that, here is the code you should use to get your main page a different background.

<style>body {background: url("Url of background goes here") fixed} </style>

Then you just hit your Edit Profile button when you are done.
Check into your site and see if it works before you go any further. What should happen is that you should see your old or guestbook background show up first and then your new background you put for your main page. (Make sure your posts are there too) If not, all you have to do is delete the code you put in your Introduction section for the background of your Edit Profile and hit the "Edit Profile" button. Everything should turn back to normal.
In the Edit Styles, you know the "Add a background Image" searchbar? The wallpaper Url you have there is the one that controls your guestbook. If you want that one in your main page, just cut and paste the wallpaper Url you have there in your Edit Profile section instead. You can put a different background Url in your "Add a Backgound Image" section in the Edit profiles to your liking. After you cut and paste the old "Add an Image Background" in your Edit Profile.

Able to understand all that? I hope so! Because I don�t think I can explain it any better than that. If you want you can just copy the code here,

And paste it to a word document and then put the background wallpaper URL where it says(�Url of background wallpaper goes here�). Then copy it again and paste it in your introduction in your edit profile page. And after you�ve done that get the wallpaper URL that you want for your guestbook and put it in your add a background image in your edit styles section. If you think that this way is any easier you are more than welcome to try it. ^^�

There are definitely more advanced codes for backgrounds and wallpapers that I know, but depending on my mood we�ll see if I ever get around to putting them up.

Having your profile as long as you want! 0.o

Ran out of room to put things in your profile?
This comes in handy!!! These are the steps for making your profile hold as much as you want. ---

1.You�ll NEED to have a word document or a notepad. Something to put down as much text/typing as you�ll use.
2.Paste and put all your codes and whatnot that you have in your introduction box in the notebook or word document.
3.Delete everything in your introduction box.
4.Copy all the codes and things you want in your introduction box in your notebook/word document and paste it in the introduction box on your profile page.
5 .DO NOT TYPE ANYTHING AFTER THAT IF YOU HAVE MORE THAN 1500(sometimes it is 900 for some people) WORDS CHARACTERS, BECAUSE IT WILL GET RID OF ANYTHING AFTER YOU TYPE MORE THAN 1500(or if you have 900) CHARACTERS( WORD LETTERS)!!! So be careful that you don�t delete your work� >.< It has happened to me in the past and it was very annoying!!!

Marquees

I am giving this its own little section because you can do a lot with marquees. From the simple having the words move across the page from right to left, to having it go upwards and downwards and bouncing around. Buuuutt I am not going to get into that too much. :P

The simplest code there is for moving your text across the page is,

<marquee>words go in here</marquee>

Example.
Whoa!!! What the heck am I doing fly around like this?

Adding color behind the marquee. The code will look like this,
<marquee bgcolor="#000000">Words go here</marquee>

Remember what I said about the color hex code? (If not look back up in the font section under changing colors.) Well you use that hex code for choosing a color for the background of the marquee.
Here is an example.
I put what color I want down and what I want to say, so it�ll look like this ---
<marquee bgcolor=�#00ccff�>Ouch!</marquee>

And then Presto! My result!
Ouch!

Making the marquee move from the left to right instead of right to left is fairly easy.
<marquee direction="right">Text goes here</marquee>
Yes that is all there is to it.
Example.
I�m Backwards?

Oh, and here is the code for a blinking marquee.
<blink>Text Goes Here</blink>
Example.
Ho Hum

Another fun thing to do with your text marquees is so make them bounce around, like this.
Bouncy! Bouncy!
The code for this is right here, just replace the part where it says WRITE TEXT HERE!!! with the words you want. ^^

That is all I am going to explain to you about. If you want to know more about marquees (there is so much more you can do with marquees!) a cool place to learn is
Draac�s marquee lesson

Links and Buttons

This is something that could possibly be one of the most used codes? Meh, I don�t really know�I just know that people like to use these codes a lot.

Here is a basic link code to for a link to someone�s site.

<a href="The URL of the webpage here">Name of page goes here</a>
Result: My site

This is a code for a link that opens a new window.
<a target="_blank" href="The URL of the webpage goes here">The Name Of The Page here</a>

Result:My site

Pretty simple really once you figure it out.

This is a code for a link that has a little message when you hover over it.
<a target="_blank" href="The URL of the webpage goes here" title="message here">The Name Of The Page here</a>

Result:My site

Making an image a link.(You use this code for site buttons) This is how you do it ----
<a href="The URL of website here"><img src="the image URL here"></a>

Result:

Adding hover images is a neat effect to your site. The code is fairly simple�to understand too�I think�^^�

The code is,

Paste this code to a word document and put the image URL that you want where it says URL GOES HERE!!!

Site Titles

This is for making your site have whatever you want to name it instead of the regular MyOtaku.com: Shishou-Mozilla Firfox site title.
For a simple Title use this code ---

Copy it and paste it to a word document and then change the title to whatever you want and then paste it in your post styles. And it should work�

This is for having a scrolling title�
A special thanks to Magnus Lensherr for this code!!! THANK YOU!

Copy this and paste it to a word document and change the name to whatever you want. And paste it in your post styles. Otherwise it won�t work. ^^�
When you set it to true, it keeps scrolling over and over. When you set it to false it only scrolls once. I hope you understand this. ^^�

Navigation Bar *Updated*

These codes are kinda fun to mess with. ::*smiles*:: Okay first off I am going to show you how to have your side bar navigation disappear.Make sure you have navigation links to your guestbook, the backroom of MyOtaku, your portfolio, and all the other links you need, otherwise no one will be able to get around on your site!!!
This is the code ---

Now for adding cool things around your navigation bar.
These are the different things you can put around your navigation bar. I am going to give you the code for each one. I think that will be easier. You can test them out on your site to see which one looks best to you.

Outset

Ridge

Inset

Solid

Dotted

Dashed

Oh, and you can also put a background behind your navi bar if you want one. This is the code for it. ---

�

This is the code for having your navi bar reversed to the opposite side of the page. Another special thanks to Magnus Lensherr. I was so curious how she did it and she traded her secret for another code. LoL. Again I thank you Magnus if you ever read this.

So here is the code ----

Magnus says to just paste that in your intro box in your edit profile section and wah la!�Enjoy!

Message Boxes

I think many people want to know how to do this particular code. I have been asked many times about it and now I am finally typing it down in my tutorial for all to see and use!!! This is the code for having a message box appear when someone enters your homepage and a message box for someone leaving your homepage.It will be easier if you just copy this code and paste it to a word document and type down the message that you want and then paste this with the rest of the stuff you want in your profile. Make sure you don�t accidentally erase the "�s in between the ( )�s. If you erase those the code will not work. Try not to overload your site with message boxes because it can get annoying. So make sure you only paste the code once to your post styles. Some people have pasted it all over and it becomes a big mess. T_T

If you want the code for just having a box appear when someone visits your homepage like I have on this site, just copy the first part of the code from when it starts with the SCRIPT to when it ends with the /SCRIPT. If you want a message box to only appear when someone is leaving your homepage only copy the last part of the code, where it starts from BODY to where it ends in /style. Make sure you copy the angle brackets with the code otherwise it won�t work!

Glow *New*