Userpage HTML Guide

From Disneys Online Worlds Guide (Wiki)
Jump to: navigation, search

General HTML Coding Tips

This area shows some basic HTML for use within your userpage.

Tables

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

This is what the table will look like:

row 1, cell 1 row 1, cell 2
row 2, cell 1 row 2, cell 2

Images

This will insert an image on your userpage:

<img src="Your File Here" />

Bullet Points & Numbered Lists

<ul>
<li>Each Piece of Info after a Bullet</li>
<li>Each Piece of Info after a Bullet</li>
<ul>

{That's just for bullets.}

  • Bullets
  • Bullets

<ol>
<li>Each Piece of Info after a Bullet</li>
<li>Each Piece of Info after a Bullet</li>
<ol>

{That's for numbered bullets.}

  1. # Bullets
  2. # Bullets

Background Colors & Images

If you would like to have an image as the background to your page, then the following is what you need.

<table border=0 background="image link" width=100%>
<tr><td> 
ENTIRE USERPAGE CONTENT HERE 
</td></tr></table>

Remember to change the area in bold to the link to your image file, this has to be hosted somewhere. For example, http://www.toontowncentral.com/images/imagefile.jpg

Inline Anchor Links

If you want to place links inside your userpage to other parts/sections of your userpage the following is what you need.

Place the following text on the line you wish to link to. Remember to change the anchorname to a different name for each link and make sure there are no spaces in the anchorname.

<a name="anchorname">

Now around your link do the following, remember to replace anchorname with the name of your anchor but remember to leave the # infront of it.

<a href="#anchorname">link</a>

Text

Color & Style

<div style="color:#FF0000; font:Arial">Your Text Here</div>

NOTE:Bold is what you can edit.

Example Text Is Here

Alignment

<center>Text Goes Here</center>

~~OR~~

<div align="center">Text Goes Here</div>
Example
Other Example

Hiding Text

<!--- Text Goes Here -->

Plugins

MP3s & MIDIs

This code allows a music file to be embedded into your userpage and shows a little control box wherever you place the code. Replace the example link with a link to an MP3 or MIDI file and paste the code into your userpage. If you don't want the music to start automatically (autostart), remove autostart="true", or if you don't want it to play over and over (loop), you can remove loop="true". If you would not like the control box to show, add hidden="true" to the code.

<embed src="Song.mp3" height="25" width="300" autostart="true" loop="true">

Remember that the file has to be hosted on a hosting site. For example,

http://www.toontowncentral.com/files/song.mp3

(Please note that ToontownCentral is not a hosting site)

Movies & Animations

If you would like to embed a movie file, then you need to follow the steps above, except you're uploading a video, not music, and you need to use this code:

<embed src="video.wmv" height=285"45" width="320" autostart="true" loop="true">

Remember that the file has to be hosted on a hosting site. For example,

http://www.toontowncentral.com/files/video.wmv

(Please note that ToontownCentral is not a hosting site)

Flash/Shockwave

Flash

 <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="650" height="440">
 <param name="movie" value="YOUR_FILE.swf">
 <param name="quality" value="high">
 <embed src="YOUR_FILE.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="650" height="440"></embed>
 </object>

Shockwave

 <object classid="clsid:166B1BCA-3F9C-11CF-8075-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/director/sw.cab#version=8,5,0,0" width="650" height="440">
 <param name="src" value="YOUR_FILE.swf">
 <embed src="YOUR_FILE.swf" pluginspage="http://www.macromedia.com/shockwave/download/" width="650" height="440"></embed>
 </object>