adding chatterbox Options

[xenosaga]

can someone help me add a chatterbox in the left side of my module..the extra module?

<!-- begin code provided by createblog.com --><br /><DIV style="margin-top: -15px; margin-left: 100px; padding-bottom: 0px"><br /><p><map name="FPMap0"><br /><area href="http://www.xanga.com/signin.aspx" shape="rect" coords="35, 52, 74, 65"><br /><area href="http://www.xanga.com/claf" shape="rect" coords="32, 63, 102, 76"><br /><area href="http://www.xanga.com/Private/SubscribeTo.aspx?user=zer_wil_de_mach" shape="rect" coords="34, 75, 80, 86"><br /><area href="http://www.xanga.com/Private/subs.aspx" shape="rect" coords="32, 86, 106, 98"><br /><area href="http://www.xanga.com/Private/profilebasic.aspx" shape="rect" coords="32, 96, 68, 110"><br /><area href="http://www.xanga.com/guestbook.aspx?user=zer_wil_de_mach" shape="rect" coords="34, 109, 73, 120"><br /><area href="http://www.xanga.com/logout.aspx" shape="rect" coords="34, 119, 80, 131"><br /><area href="http://www.createblog.com" shape="rect" coords="33, 129, 94, 143"></map><br /><img src="http://img.photobucket.com/albums/v667/zer_wil_de_mach/kosmo.jpg" usemap="#FPMap0" width="767" height="1062"></p><br /><br /></body><br /><br /></html><br /><div style="overflow: auto; width: 205px; height: 653px; margin-top: -570px; margin-left: 23px;"><br /><br /><b>About Me</b><br /><br>Name: Donna<br><br />Age: 15<br>Birthday: August 15 1989^th<br><br />Hobbies: playing games, going online, playing ddr =P, and others as long as its not boring<Br><br />Expertise: being myself!<p><br /><br /><b>Misc.</b><br><br /></div><br /><br /><!-- begin code provided by createblog.com --><br /><div style="<br />overflow: auto;<br />width: 477px;<br />height: 528px;<br />margin-top: -642px;<br />margin-left: 264px;"> <br /><style type="text/css"><br />.#rblEprops{display:none;}<br />#pnlEnabled table, #htmleditor, #lblTimeZone, #pnlEprops, #rblEprops <br />/* width of the comment page */<br />{width:245px;}<br />.leftmoduletitlebar, .leftmoduleborder, .leftmoduleinterior, table.left, table.left TH, table.left TD, table.navigation, table.footer <br />{display: none;} <br /></style><br /><style type="text/css"><br />/* Name of Your Skin - By You*/<br />body <br />background-image:url();<br />background-repeat: repeat-x;<br />background-color: #C7DFF7;<br />scrollbar-face-color: #BFDFFF;<br />scrollbar-shadow-color: #C7DFF7;<br />scrollbar-highlight-color: #fffFFF;<br />scrollbar-3dlight-color: #BFDFFF;<br />scrollbar-darkshadow-color: #fffFFF;<br />scrollbar-track-color: #C7DFF7;<br />scrollbar-arrow-color: #ffffff;}<br /><br />/* edits the date */<br />div.blogheader, .caption <br />{background-image: url();<br />background-repeat:no-repeat;<br />background-position:center;<br />font-family: FONT FAMILY;<br />text-transform:none;<br />font-size:#px;<br />line-height:#px;<br />font-weight:normal;<br />color:#000000;<br />letter-spacing:2px;<br />background-color:#COLOR CODE;<br />text-align:center;<br />border:1px solid #ffffff;}<br /><br />.blogbody b, .standard b, p b, strong {<br />/* edits bolded text in your entry */<br />font-weight: bold;<br />color: #000000;}<br /><br />input, select, textarea, iframe.htmleditor, .textfield, .button {<br />/* this edits the buttons, dropdowns, etc. */<br />border: 2px solid #80BFFF;<br />font:normal #px FONT FAMILY;<br />background-color: #transparent;<br />font-color:#000000;}<br /><br /> table.footer TD {<br />/* this makes the footer at the bottom centered */<br />/* leave it alone unless you know what to do*/<br />text-align: center;}<br /><br />table.left th {<br />/* on your menu module, this edits the title part of it */<br />/* like BLOGRINGS, POSTING CALENDAR, etc */<br />background-image: url();<br />background-color:none;<br />color: #000000;<br />font: bold 10pt FONT FAMILY;<br />text-transform: none;<br />text-align:center;<br />border: #80BFFF 2px solid;}<br /> <br />table.left { <br />/* this edits the menu module */<br />width:180px;<br />color:000000;<br />background-color:#COLOR CODE;<br />BORDER: #80BFFF 2px solid;}<br /><br />font,td,p,xmp<br />{color:#000000;<br />font-face: FONT FAMILY;<br />font-weight:normal;<br />font-size:10pt;<br />text-align:justify;}<br /><br />table.blogbody tr td { <br />/* this edits the left margin of blog */ <br />width:0px; <br />padding-left: 0px;} <br /><br />table.blogbody {<br />/* this edits the other the place where the  blog is */<br />background-color:transparent;<br />family-font: FONT FAMILY;<br />BORDER: #80BFFF 2px solid;<br />width:470px;} /* <-- The width for this should be around 5-15 pixels less then the width for your blog's div layer. */ <br /><br />a:link<br />{line-height: 10pt; <br />font-family: FONT FAMILY;<br />font-weight:normal; <br />color:#COLOR CODE; <br />text-transform:none;<br />font-size:10pt; <br />cursor:crosshair;}<br /><br />a:active<br />{font-family: FONT FAMILY; <br />color:#000000; <br />text-transform:none;<br />font-size:10pt; <br />cursor:crosshair;}<br /><br />a:visited<br />{font-family: FONT FAMILY; <br />color:#000000; <br />text-transform:none;<br />text-decoration:strikeout;<br />font-size:10pt;<br />cursor: crosshair;}<br /><br />A:hover {font-family:FONT FAMILY;<br />color:#000000;<br />text-transform: uppercase; <br />cursor: crosshair; <br />font-weight:bold;<br />font-size:10pt}</style><br /><br /><!-- end code provided by createblog.com --><br /><!-- end code provided by createblog.com -->

here's the xanga link of the one im testing my skin

[Jus2s1mp13]

first you need to sign up to get a chatter. If you haven't. Once you got it, use the code they give you and just place the code in where you want it. Like it seem to me you want to put under you misc. So you would place the code underneath there.