Credits: Xavier for his Cbox Sidebar :rose: Sir Feruzz Pageowner and Pageviewer Basis Ok let's start Step 1: Put this code at the top of your js if you already have it... Skip This Step [quote]var pageOwnerFName; var pageViewerFName; pageOwnerFName = window.location.href.slice(7, window.location.href.indexOf(".")); try { pageViewerFName = getElementsByClassName(null,"span","signoutid")[0].firstChild.innerHTML.replace(/Hi,\s+?/gim, ""); }catch(e) { pageViewerFName = ""; } function getElementsByClassName(oElm,sTag,sClass) { var elm = []; if (!oElm)oElm = document; if (!sTag)sTag = "*"; var els = oElm.getElementsByTagName(sTag) || document.all; for (var j=0,k=els.length;j<k;j++) { if (new RegExp(sClass).test(els[j].className)) { elm.push(els[j]); } } return elm; }[/quote] Step 2: Final Code [quote]/* ONLOAD HANDLER */ if (!addEvent(function() { CHATBOX.init();})) { window.onload = function() { CHATBOX.init();};} /* END ONLOAD HANDLER */ /* CHATBOX OBJECT */ if (typeof CHATBOX == "undefined") { CHATBOX = {}; } CHATBOX = { module: [], init: function() { var sty = ""; for (val in this.frame) { sty += val +":"+ this.frame[val]+";"; } this.module = document.createElement("DIV"); this.module.setAttribute("align","center"); this.module.setAttribute("style",""+sty+""); this.module.innerHTML = "<center>"+ "<iframe frameborder='0' width='90%' height='200' src='http://[b]www?[/b].cbox.ws/box/?boxid=[b]BOXID[/b]&boxtag=[b]BOXTAG[/b]&sec=main' marginheight='2' marginwidth='2' scrolling='auto' allowtransparency='yes' name='blurry' id='blurry'></iframe><br/><br/></center><form name='chat' width='60%' target='blurry' action='http://[b]www?[/b].cbox.ws/box/?boxid=[b]BOXID[/b]&boxtag=[b]BOXTAG[/b]&sec=submit' method='post'><input type='hidden' name='nme' value='"+pageViewerFName+"'><input type='hidden' maxlength='50' name='eml' value='http://"+pageViewerFName+".multiply.com/'><textarea style='overflow:hidden' class='cboxMsgArea' cols='22' rows='3' name='pst' width='20%'></textarea><br /><input type='submit' class='cboxButtons' value='Submit' name='asa' onmouseover=\"this.className='cboxButtons cboxButtonshov'\" onmouseout=\"this.className='cboxButtons'\"><input class='cboxButtons' type='reset' value='Clear' maxlength='23' onClick='reset()' onmouseover=\"this.className='cboxButtons cboxButtonshov'\" onmouseout=\"this.className='cboxButtons'\"><input type='button' class='cboxButtons' value='Refresh' name='blurry' onClick='window.blurry.location.href=document.getElementById(\"blurry\").src' onmouseover=\"this.className='cboxButtons cboxButtonshov'\" onmouseout=\"this.className='cboxButtons'\"><br /><b><font color=#ff0000>Chat Box</font></b> <b><font color=#00FF00>Reminder: </font></b> <b><font color=#00FFFF>Please Log-In To Your <br>Multiply Account</font></b> </form>"; document.getElementById("rail").appendChild(this.module); } }; /* END CHATBOX OBJECT */[/quote] Just input appropriate data of your cbox ok and your done with it... Step 3: Tweaking your message area (Do this please to properly align your Cbox) Put this in your custom css [url]multiply.com/setup/pages/upload-css[/url] [quote]#cbox { background-color: translucent; background-image:url(http://img62.imageshack.us/img62/204/000kk2.gif); background-attachment: scrollable; background-repeat: repeat; background-position: center center; border: 2px solid #b22222; } .cboxMsgArea { color: #cc9966; font-family: Arial; font-size: 100%; font-weight: bold; background-color:#000000; border:2px solid #5FFB17; width: [b]160px[/b]; height: [b]60px[/b]; }[/quote] Your done... Goodluck Image Preview: [img]http://img529.imageshack.us/img529/8179/89856781xb8.jpg[/img] Not satisfied with the image preview? Here's the live preview : [url]blurryblurry.multiply.com[/url]

Last edited by blurrycloud (2008-01-11 17:41:44)