Latest Announcemnent
New thread

The Username Mega Thread

Status
Not open for further replies.
K

KaiTrac

Banned
Banned
284
2008
0
0
In this post i will show all the tricks to get a cool username.

1. The Basics

AdminCP -> Usergroup Manager -> Registered user -> Edit usergroup




Add color

In Username HTML Markup first box add:
Code: 
<font color="#ffff00">
To close add in second box:
Code: 
</font>
I won't explain this again everything i explain goes like this.
Begintag first box endtag second box.

All HTML color codes can be found here:
Code: 
http://html-color-codes.com/
Example:
Kaitrac



Add bold italic underline

Code: 
 <b> -> </b>
 <u> -> </u>
 <i> -> </i>
Example:
Bold Italic Underline



Add an image

Code: 
<img src="http://yoursite/images/name.jpg" style="border:0px;"> -> </img>
Example:
rankedimg.jpg


x1.jpg





Scrolling username
Code: 
<marquee> -> </marquee>
Example:
Code: 
http://www.mountaindragon.com/html/marquee.htm
Larger Font
Code: 
<font size="5"> -> </font>
Example:
fontsize.jpg

largerfont.jpg

x4.jpg





Trick the members
Code: 
<a href="http://meatspin.com"> -> </a>
Example:
Click here!




2. The advanced

onMouseOver
Code: 
<span title="I'm the boss!"> -> </span>
Example:
onmouseoverboss.jpg

x2.jpg





Color background

Code: 
<span style="background:grey"> -> </span>
Example:
x3.jpg
bgcolor.jpg





Button
Code: 
<input name="Button" type="button" value="Click me"> -> no end tag needed
Example:
clickme.jpg


x5.jpg


Variations:
Code: 
<a href="http://clickme.com"><input name="Button" type="button" value="Click me"> -> </a>
Code: 
<a href="mailto:BillGates@vista.sucks"><input name="Button" type="button" value="Mail me"> -> </a>
Adding borders
Code: 
<div style="width:30px; height:12px; border:2px; dashed pink;"> -> </div>
Example:
gayborder.jpg

x6.jpg




This trick has alot of variations.
For all look here:
Code: 
http://www.quackit.com/html/codes/html_borders.cfm
3. The 1337

Frame
Code: 
<iframe src="http://www.youtube.com/watch?v=3oIrUViQJ5U" width:50px; height:50px;"> -> </iframe>
Example:
jewtoob.jpg

x7.jpg





Add more text
Code: 
-- { -> } --
Example:
ascii.jpg

x8.jpg


You can add any type of text.
More ASCII:
Code: 
http://www.ascii.nl/


Blink
Code: 
<blink> -> </blink>
Example:
Code: 
http://www.htmlcodetutorial.com/_BLINK.html


onMouseOver Play Sound
Code: 
<a href="#" onMouseOver="EvalSound('sound1')"> -> </a>


TAKE NOTE THAT IN FIREFOX YOU NEED QUICKTIME PLUGIN INSTALLED

Create wav text to speech here:
Code: 
http://www.research.att.com/~ttsweb/tts/demo.php
Save the .wav file.

Upload in forum root.

AdminCP -> Style Manager -> FORUMHOME

Find:
Code: 
<body>
Add below:
Code: 
<script>
function EvalSound(soundobj) {
  var thissound= eval("document."+soundobj);
  thissound.Play();
}
</script>

<embed src="http://yoursite.com/name.wav" autostart=false width=0 height=0 name="sound1"
enablejavascript="true">


Matrix Text effect
Add this code inbetween <head> and </head>
AdminCP -> Styles & Templates -> Style Manager -> Edit Templates -> Forum Home Templates - FORUMHOME
Code: 
Matrix Attachement
Add this in usergroup:
Code: 
<div id="matrix"> -> </div>
Example:
Code: 
http://www.dynamicdrive.com/dynamicindex10/matrixeffect.htm
x9.jpg
Animated color Text effect
Add this code into the <BODY> tag of the FORUMHOME
Code: 
<SPAN ID="animate"></SPAN>
<SCRIPT language="JavaScript">
animate('animate', '#ff8000');
</SCRIPT>
Add this code into the <HEAD> tag of the FORUMHOME
Code: 
<SCRIPT language="JavaScript"  type="text/javascript">

        var ie4 = false;
        if(document.all) {
                ie4 = true; 
        }       
        function setContent(name, value) {
                var d;  
                if (ie4) { 
                        d = document.all[name];
                } else {
                        d = document.getElementById(name);
                }       
                d.innerHTML = value;    
        }       

    function getContent(name) {
        var d;
                if (ie4) {
                        d = document.all[name];
                } else {
                        d = document.getElementById(name);
                }
                return d.innerHTML;
    }

        function setColor(name, value) {
                var d;  
                if (ie4) { 
                        d = document.all[name];
                } else {
                        d = document.getElementById(name);
                }
                d.style.color = value;  
        }

    function getColor(name) {
                var d;
                if (ie4) {
                        d = document.all[name];
                } else {
                        d = document.getElementById(name);
                }
                return d.style.color;
        }

        function animate(name, col) {
        var value = getContent(name);
        if (value.indexOf('<span') >= 0) { return; }
        var length = 0;
                var str = '';
        var ch;
        var token = '';
        var htmltag = false;    
                for (i = 0; i < value.length; i++) {
            ch = value.substring(i, i+1);
            if (i < value.length - 1) { nextch = value.substring(i+1, i+2); } else { nextch = ' '; }
            token += ch;
            if (ch == '<' && '/aAbBpPhHiIoOuUlLtT'.indexOf(nextch) >= 0) { htmltag = true; }
            if (ch == '>' && htmltag) { htmltag = false; }
            if (!htmltag && ch.charCodeAt(0) > 30 && ch != ' ' && ch != '\n') {        
                            str += '<span id="' + name + '_' + length + '">' + token + '</span>';
                token = '';
                length++;
            }
                }
                setContent(name, str);
                command = 'animateloop(\'' + name + '\', ' + length + ', 0, 1, \'' + col + '\')';
                setTimeout(command , 100);
        }

        function animateloop(name, length, ind, delta, col) {
        var next = ind + delta;
        if (next >= length) { delta = delta * -1; next = ind + delta; }
        if (next < 0) { delta = delta * -1; next = ind + delta; }
                setColor(name + '_' + ind, getColor(name + '_' + next));
                setColor(name + '_' + next, col);
                command = 'animateloop(\'' + name + '\', ' + length + ', ' + next + ', ' + delta + ', \'' + col + '\')';
                setTimeout(command , 100);
        }
</SCRIPT>

Finally add this in usergroup settings:
Code: 
<span id="animate"> -> </span>
Example:
Code: 
http://linked-forum.com/forum.php
Drag a username everywhere! (Brilliant)
Add this code inbetween <head> and </head>
Code: 
<style type="text/css">

.drag{
position:relative;
cursor:hand;
z-index: 100;
}

</style>

<script type="text/javascript">

/***********************************************
* Drag and Drop Script: © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

var dragobject={
z: 0, x: 0, y: 0, offsetx : null, offsety : null, targetobj : null, dragapproved : 0,
initialize:function(){
document.onmousedown=this.drag
document.onmouseup=function(){this.dragapproved=0}
},
drag:function(e){
var evtobj=window.event? window.event : e
this.targetobj=window.event? event.srcElement : e.target
if (this.targetobj.className=="drag"){
this.dragapproved=1
if (isNaN(parseInt(this.targetobj.style.left))){this.targetobj.style.left=0}
if (isNaN(parseInt(this.targetobj.style.top))){this.targetobj.style.top=0}
this.offsetx=parseInt(this.targetobj.style.left)
this.offsety=parseInt(this.targetobj.style.top)
this.x=evtobj.clientX
this.y=evtobj.clientY
if (evtobj.preventDefault)
evtobj.preventDefault()
document.onmousemove=dragobject.moveit
}
},
moveit:function(e){
var evtobj=window.event? window.event : e
if (this.dragapproved==1){
this.targetobj.style.left=this.offsetx+evtobj.clientX-this.x+"px"
this.targetobj.style.top=this.offsety+evtobj.clientY-this.y+"px"
return false
}
}
}

dragobject.initialize()

</script>
Than simply add this into usergroup:
<b class="drag"> -> </b>

Example:
usernamedrag.jpg




I will update this thread when i find something new.
If i missed something reply here and i will add it.


Please say thanksit took me alot of work and editting.
 
12 comments
Few little error eg. their's no such thing as </img> but otherwise nice work and should be helpful for those who want it.

It's also better pratice to use <strong> instead of <b>, stay away from marquee etc due to browser compatability.
 
Status
Not open for further replies.
Back
Top