ubb systeem + stylesheet.
[code]
<?php

// lijst genereren
function create_list_items($str, $parsed="")
{
	// verwijder slashes
    $str = stripslashes($str);
	// haal alles uit elkaar
    $list_items = explode('[*]', $str);
	
	// loop door de array
    if($num = count($list_items) - 1)
    {
        for($i=1; $i<=$num; $i++)
        {
            $parsed .= '<li>'.trim($list_items[$i]).'</li>';
        }
    	
        return '<ul>'.$parsed.'</ul>';
    }
    else
    {
        return '[lijst]'."\r\n".trim($str)."\r\n".'[/lijst]';
    }
}

// web pagina of topic naar ubb zetten.
function ubbpage($content)
{
	// alle html filteren
	$content = htmlentities($content);	
	//zodra er code word gevonden, word dat wat tussen [code][/code] staat eerste weer decoded, en vervolgens met php highlight weergegeven
	$content = preg_replace('#\[code\](.+)\[/code\]#sieU', "'[code]'.highlight_string(html_entity_decode('$1'), TRUE).'[/code]'", $content);
	// creer een lijst
	$content = preg_replace('#\[lijst\](.+)\[/lijst\]#sieU', "create_list_items('$1')", $content);
	// nieuwe regels maken	
	$content = nl2br($content);
	// array met de gegevens om te replacen
	$codez = array
	(
		// bold
		'#\[b\](.+)\[/b\]#siU'
			=> '<strong>$1</strong>',
		// underlined
		'#\[u\](.+)\[/u\]#siU'
			=> '<u>$1</u>',
		// italic
		'#\[i\](.+)\[/i\]#siU'
			=> '<em>$1</em>',
		// strike through
		'#\[s\](.+)\[/s\]#siU'
			=> '<del>$1</del>',
		// paragraph
		'#\[p\](.+)\[/p\]#siU'
			=> '<p>$1</p>',
		// headings 1 to 6
		'#\[h=([1-6]{1})\](.+)\[/h\]#siU'
			=> '<h$1>$2</h$1>',
		// span style color
		'#\[kleur=(\#[a-f0-9]{3}|\#[a-f0-9]{6}|[a-z]{3,})\](.+)\[/kleur\]#siU'
			=> '<span style="color:$1;">$2</span>',
		//span style font size
		'#\[size=([0-9]{1,2})\](.+)\[/size\]#siU'
			=> '<span style="font-size:$1px;">$2</span>',
		// anchor
		'#\[link=((http://|https://|ftp://)([a-z0-9\#\?\.&/]*))\](.+)\[/link\]#siU'
			=> '<a href="$1" target="_blank">$4</a>',
		// table
		'#\[tabel breed=([0-9]{1,3}) rand=(1|0)\](.+)\[/tabel\]#siU'
			=> '<table width="$1%" border="$2" cellpadding="3" cellspacing="0">$3</table>',
		// tr
		'#\[rij\](.+)\[/rij\]#siU'
			=> '<tr>$1</tr>',
		// td
		'#\[cel breed=([0-9]{1,3})\](.+)\[/cel\]#siU'
			=> '<td width="$1%" align="center">$2</td>',
		// quotes noname
		'#\[citaat\](.+)\[/citaat\]#siU'
			=> '<blockquote class="citaat"><div>Citaat : </div>$1</blockquote>',
		// quotes name
		'#\[citaat=([a-z0-9\#\?\.&/]*)\](.+)\[/citaat\]#siU'
			=> '<blockquote class="citaat"><div>Citaat door : $1</div>$2</blockquote>',
		// plaatje
		'#\[plaatje\]((http://|https://|ftp://)(.+))\[/plaatje\]#siU'
			=> '<img src="$1" alt="$1" style="border:0px" />',
		// codeblock
		'#\[code\](.+)\[/code\]#siU'
			=> '<blockquote class="code"><div>Code :</div><code>$1</code></blockquote>'
			
	);
	// gooi alles wat in de array staat er door heen
	$content = preg_replace(array_keys($codez), $codez, $content);
	
	// retourneer de waardes
	return $content;
}

?>
<style type="text/css">
.citaat
{
	border:1px solid black; 
	padding:5px; 
	width: 50%;
}
.citaat div
{
	color:#999; 
	border-bottom:1px solid #999; 
	width:50%;
}
.code
{
	background:#EEEEEE; 
	padding:5px; 
	width: 50%; 
	overflow:auto; 
	overflow-x: scroll;
}
.code div
{
	color:#999; 
	border-bottom:1px solid #999; 
	width:50%;
}
</style>
[/code]
###
### Formulier pagina + css
### 
[code]
<style type="text/css">

.editor 
{
	background-color:#EAEDFF;
}

.helppage
{
	background-color:#EAEDFF;
	padding:2px;
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	width:250px;
	text-align:justify;

}
.easymode
{
	display:block;
	background-color:#EAEDFF;
	border:1px solid #EAEDFF;
	text-decoration:none;
	padding:2px;
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}

.editor input
{
	background-color:#EAEDFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	border:0px solid #006090;
	border-top:0px solid #006090;
	padding:1px;
	padding-left:10px;
	width:100%;
	color:#333333
}
.editor textarea
{
	background-color:#EAEDFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	border:1px solid #006090;
	padding:3px;
	width:100%;
	height:300px;
}

.editor td
{
	text-align:center;
}
.editor a, .editor a:visited , .editor a:active
{
	display:block;
	background-color:#EAEDFF;
	border:1px solid #EAEDFF;
	text-decoration:none;
	padding:2px;
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}
.editor a:hover
{
	display:block;
	background-color:#B0D8FF;
	border:1px solid #004080;
	text-decoration:none;
}
</style>
<script language="javascript" type="text/javascript">

function showDesc(type)
{
	if(type == 'bold')
	{
		infoDesc = 'Dikke tekst : [b] tekst [/b]';
	}
	if(type == 'italic')
	{
		infoDesc = 'Schuine tekst : [i] tekst [/i]';
	}
	if(type == 'underlined')
	{
		infoDesc = 'Onderstreepte tekst : [u] tekst [/u]';
	}
	if(type == 'striked')
	{
		infoDesc = 'Doorgestreepte tekst : [s] tekst [/s]';
	}
	if(type == 'paragraph')
	{
		infoDesc = 'Plaats tekst in een paragraaf : [s] tekst [/s]';
	}
	if(type == 'heading')
	{
		infoDesc = 'Titel voor een tekst : [h=1/6] tekst [/h]';
	}
	if(type == 'link')
	{
		infoDesc = 'Maak een hyperlink naar een pagina : [link=http://www.eenadres.nl] tekst [/link]';
	}
	if(type == 'size')
	{
		infoDesc = 'Tekst grootte veranderen : [size=xx] tekst [/size] : xx grootte in pixels, standaard is 13';
	}
	if(type == 'plaatje')
	{
		infoDesc = 'Een plaatje invoegen : [plaatje]http://www.eenadres.nl/plaatje.jpg[/plaatje]';
	}
	if(type == 'kleur')
	{
		infoDesc = 'Tekst kleur veranderen : [kleur=kleur] tekst [/kleur] : notatie : #FFF, #FFFFFF, engelse term voor de kleur';
	}
	if(type == 'citaat')
	{
		infoDesc = 'Iets of iemand citeren : [citaat=naam] tekst [/citaat] : =naam weglaten voor een normale citaat';
	}
	if(type == 'lijst')
	{
		infoDesc = 'Voeg een lijst toe : [*] item : voor elk item een [*]';
	}
	if(type == 'code')
	{
		infoDesc = 'Voeg een stukje code toe : [code] html/php/javascript/css codes [/code]';
	}
	if(type == 'tabel')
	{
		infoDesc = 'Voeg een tabel in : breed= breedte in %, rand= 1 of 0.';
	}
	document.getElementById('desc').value = infoDesc;
}

function hideDesc()
{
	document.getElementById('desc').value = 'Klik op een BB Tag hierboven om het in te voeren.';
}

function addBB(type)
{
	var getal = /^\d{1,2}$/;
	if(document.getElementById('easymode').value == 'checked')
	{
		easymode = true;
	}
	else
	{
		easymode = false;
	}
	
	if(type == 'bold')
	{
		addText = '[b] [/b]';
	}
	if(type == 'italic')
	{
		addText = '[i] [/i]';
	}
	if(type == 'underlined')
	{
		addText = '[u] [/u]';
	}
	if(type == 'striked')
	{
		addText = '[s] [/s]';
	}
	if(type == 'paragraph')
	{
		addText = '[p] [/p]';
	}
	if(type == 'heading')
	{
		if(easymode)
		{
			Heading = prompt('Welke kop grootte wil je? 1 t/m 6 ','');
			if(Heading == '1' || Heading == '2' || Heading == '3' || Heading == '4' || Heading == '5' || Heading == '6')
			{
				addText = '[h=' + Heading + '] [/h]';
			}
			else
			{
				addText = '[h=3] [/h]';
			}
		}
		else
		{
			addText = '[h=3] [/h]';
		}
	}
	if(type == 'link')
	{
		if(easymode)
		{
			Link1 = prompt('Wat is het adres van de pagina?','http://');
			Link2 = prompt('Welke tekst moet er komen te staan?','');
			if(Link1 && Link2)
			{
				addText = '[link=' + Link1 + ']' + Link2 + '[/link]';
			}
			else
			{
				addText = '[link=][/link]';
			}
		}
		else
		{
			addText = '[link=] [/link]';
		}
	}
	if(type == 'size')
	{
		if(easymode)
		{
			Size = prompt('Welke tekst grootte wil je? (in pixels, 13 standaard) ','13');
			if(Size.search(getal) != -1)
			{
				addText = '[size=' + Size + '] [/size]';
			}
			else
			{
				addText = '[size=13] [/size]';
			}
		}
		else
		{
			addText = '[size=13] [/size]';
		}
	}
	if(type == 'plaatje')
	{
		if(easymode)
		{
			Plaatje = prompt('Wat is de link naar het plaatje? ','http://');
			if(Size)
			{
				addText = '[plaatje]' + Plaatje + '[/plaatje]';
			}
			else
			{
				addText = '[plaatje] [/plaatje]';
			}
		}
		else
		{
			addText = '[plaatje] [/plaatje]';
		}
	}
	if(type == 'kleur')
	{
		if(easymode)
		{
			Kleur = prompt('Welke kleur wil je? ','#');
			if(Size)
			{
				addText = '[kleur=' + Kleur + '] [/kleur]';
			}
			else
			{
				addText = '[kleur=] [/kleur]';
			}
		}
		else
		{
			addText = '[kleur=] [/kleur]';
		}
	}
	if(type == 'citaat')
	{
		if(easymode)
		{
			Citaat = prompt('Wie citeer je?','');
			if(Size)
			{
				addText = '[citaat=' + Citaat + '] [/citaat]';
			}
			else
			{
				addText = '[citaat] [/citaat]';
			}
		}
		else
		{
			addText = '[citaat] [/citaat]';
		}
	}
	if(type == 'lijst')
	{
		if(easymode)
		{
			Lijst = prompt('Hoeveel lijst items wil je?','1');
			if(Lijst.search(getal) != -1)
			{
				addText = '[lijst]';
				if(Lijst == 0)
				{
					Lijst = 1;
				}
				i = 1;
				while(i <= Lijst)
				{
					Item = prompt('Wat wilt u als nummer ' + i + ' in de lijst?','');
					addText += '\n[*]' + Item;
					i++;
				}
				addText += '\n[/lijst]';
			}
		}
		else
		{
			addText = '[lijst]\n[*]\n[/lijst]';
		}
	}
	if(type == 'code')
	{
		addText = '[code] [/code]';
	}
	if(type == 'tabel')
	{
		Tabelx = prompt('Hoeveel kolommen wil je? (horizontale hokjes)','1');
		Tabely = prompt('Hoeveel rijen wil je? (verticale hokjes)','1');
		if(Tabely.search(getal) != -1 && Tabelx.search(getal) != -1)
		{
			Tabelbreed = prompt('Hoe breed wil je de tabel hebben? (in procent, % hoeft niet)','');
			if(Tabelbreed.search(getal) == -1)
			{
				Tabelbreed = 100;
			}
			
			Tabelrand = prompt('Wil je een rand in je tabel?','ja/nee');
			
			if(Tabelrand == 'ja')
			{
				Tabelrand = '1';
			}
			else
			{
				Tabelrand = '0';
			}
			
			addText = '\n[tabel breed=' + Tabelbreed + ' rand=' + Tabelrand + ']';
			
			if(Tabelx == 0)
			{
				Tabelx = 1;
			}
			if(Tabely == 0)
			{
				Tabely = 1;
			}
			
			var currentx = 1;
			var currenty = 1;
			TD = Math.round(Tabelbreed / Tabelx);
			while(currenty <= Tabely) 
			{
				addText += '\n[rij]';
				while(currentx <= Tabelx)
				{
					addText += '\n[cel breed=' + TD + ']';
					data = prompt('Wat moet er in rij ' + currenty + ', in kolom ' + currentx + ' Komen te staan?' ,'');
					addText += '\n' + data + '\n[/cel]';
					currentx++;
				}
				addText += '\n[/rij]';
				var currentx=1;
				currenty++;
			}
			addText += '\n[/tabel]';
		}
	}
	document.getElementById('message').value += addText;
}
</script>
<form method="POST">
<table class="editor">
	<tr>
		<td>
			<a href="#" style="width:18px" onmouseover="showDesc('bold');" onmouseout="hideDesc();" onclick="addBB('bold'); return false;">b</a>
		</td>
		<td>
			<a href="#" style="width:18px" onmouseover="showDesc('italic');" onmouseout="hideDesc();" onclick="addBB('italic'); return false;">i</a>
		</td>
		<td>
			<a href="#" style="width:18px" onmouseover="showDesc('underlined');" onmouseout="hideDesc();" onclick="addBB('underlined'); return false;">u</a>
		</td>
		<td>
			<a href="#" style="width:18px" onmouseover="showDesc('striked');" onmouseout="hideDesc();" onclick="addBB('striked'); return false;">s</a>
		</td>
		<td>
			<a href="#" style="width:18px" onmouseover="showDesc('paragraph');" onmouseout="hideDesc();" onclick="addBB('paragraph'); return false;">p</a>
		</td>
		<td>
			<a href="#" style="width:18px" onmouseover="showDesc('heading');" onmouseout="hideDesc();" onclick="addBB('heading'); return false;">h</a>
		</td>
		<td>
			<a href="#" style="width:45px" onmouseover="showDesc('link');" onmouseout="hideDesc();" onclick="addBB('link'); return false;">link</a>
		</td>
		<td>
			<a href="#" style="width:45px" onmouseover="showDesc('size');" onmouseout="hideDesc();" onclick="addBB('size'); return false;">size</a>
		</td>
		<td>
			<a href="#" style="width:45px" onmouseover="showDesc('plaatje');" onmouseout="hideDesc();" onclick="addBB('plaatje'); return false;">plaatje</a>
		</td>
		<td>
			<a href="#" style="width:45px" onmouseover="showDesc('kleur');" onmouseout="hideDesc();" onclick="addBB('kleur'); return false;">kleur</a>
		</td>
		<td>
			<a href="#" style="width:45px" onmouseover="showDesc('citaat');" onmouseout="hideDesc();" onclick="addBB('citaat'); return false;">citaat</a>
		</td>
		<td>
			<a href="#" style="width:45px" onmouseover="showDesc('lijst');" onmouseout="hideDesc();" onclick="addBB('lijst'); return false;">lijst</a>
		</td>
		<td>
			<a href="#" style="width:45px" onmouseover="showDesc('code');" onmouseout="hideDesc();" onclick="addBB('code'); return false;">code</a>
		</td>
		<td>
			<a href="#" style="width:45px" onmouseover="showDesc('tabel');" onmouseout="hideDesc();" onclick="addBB('tabel'); return false;">tabel</a>
		</td>
		<td>
			<div class="easymode">Easy Mode</div>
		</td>
		<td rowspan="3" valign="top">
			<div class="helppage">Schakel easy mode uit als je ervaring hebt met dit systeem. Easy mode zorgt ervoor dat je hulp krijgt bij het invoeren van de Bulletin Board Tags.</div>
		</td>
	</tr>
	<tr>
		<td colspan="14">
			<input type="text" disabled="disabled" id="desc" name="desc" value="Klik op een BB Tag hierboven om het in te voeren." />
		</td>
		<td>
			<input type="checkbox" name="easymode" id="easymode" checked="checked" class="easymode" value="checked" onclick="if(this.value == 'checked'){this.value = '';}else{this.value = 'checked';}" style="margin-left:0px;" />
		</td>
	</tr>
	<tr>
		<td colspan="15">
			<textarea name="message" id="message"></textarea>
		</td>
	</tr>
	
</table>
</form>
[/code]