|
Function to convert BBcode to HTML
I found an article here http://www.iceteks.com/articles.php/javascript/1 on how to use BBcode in forms whcih works fine but I am having trouble converting the BBcode back to HTML so it can be inserted into the database. The second part of the article is here http://www.iceteks.com/articles.php/javascript2/1
When I enter some data into the textarea, add some BBcode tags and click preview, I get nothing displayed.
I don't know what is going wrong.
Here is the form which does as it's supposed to
- Code: Select all
<html><head>
<title>Editor</title>
<script src="editor.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
</head><body>
<form action="bbcode2.php" method="post" name="editform" onsubmit="return checkForm(this)">
<table id="editform">
<tr>
<td colspan="2" id="header">Post a new message</td>
</tr>
<tr id="subject">
<td>Subject:</td>
<td><input type="text" name="subject" size="50" class="form_elements_text"/></td>
</tr>
<tr>
<td rowspan="2" id="smilies">Smilies
<a href="javascript:smilie(':)')">
<img src="smile.gif" alt="smile" title="smile" /></a>
<a href="javascript:smilie(':D')">
<img src="biggrin.gif" alt="big grin" title="big grin"/></a>
<a href="javascript:smilie(':p')">
<img src="razz.gif" alt="razz" title="razz" /></a></td>
<td>
<input type="button" class="button" value="bold" name="bold" onclick="javascript:tag('b', '', 'bold*', '', 'bold', 'bold');" onMouseOver="helpline('bold')" />
<input type="button" class="button" value="italic" name="italic" onclick="javascript:tag('i', '', 'italic*', '', 'italic', 'italic');" onMouseOver="helpline('italic')" />
<input type="button" class="button" value="underline" name="underline" onclick="javascript:tag('u', '', 'underline*', '', 'underline', 'underline');" onMouseOver="helpline('underline')" />
<input type="button" class="button" value="quote" name="quote" onclick="javascript:tag('q', '', 'quote', 'quote');" onMouseOver="helpline('quote')" />
<input type="button" class="button" value="code" name="code" onclick="javascript:tag('c', '- Code: Select all
', 'code*', '
', 'code', 'code');" onMouseOver="helpline('code')" />
<input type="button" class="button" value="url" name="url" onclick="javascript:tag('url', '', 'url*', '', 'url', 'url');" onMouseOver="helpline('url')" />
<input type="button" class="button" value="img" name="img" onclick="javascript:tag('img', '[img]', 'img*', '[/img]', 'img', 'img');" onMouseOver="helpline('img')" />
<br />
Font size: <select name="fontsize" onChange="font('[size=' + this.form.fontsize.options[this.form.fontsize.selectedIndex].value + ']', '[/size]'); this.selectedIndex=2;" onMouseOver="helpline('fontsize')" class="form_elements_dropdown">
<option value="50%" >Tiny</option>
<option value="75%" >Small</option>
<option value="100%" selected >Normal</option>
<option value="150%" >Large</option>
<option value="200%" >Huge</option>
</select>
Font color: <select name="fontcolor" onChange="font('[color=' + this.form.fontcolor.options[this.form.fontcolor.selectedIndex].value + ']', '[/color]'); this.selectedIndex=0;" onMouseOver="helpline('fontcolor')" class="form_elements_dropdown" >
<option value="black" style="color:black">Black</option>
<option value="silver" style="color:silver">Silver</option>
<option value="gray" style="color:gray">Gray</option>
<option value="maroon" style="color:maroon">Maroon</option>
<option value="red" style="color:red">Red</option> <option value="purple" style="color:purple">Purple</option>
<option value="fuchsia" style="color:fuchsia">Fuchsia</option>
<option value="navy" style="color:navy">Navy</option>
<option value="blue" style="color:blue">Blue</option>
<option value="aqua" style="color:aqua">Aqua</option>
<option value="teal" style="color:teal">Teal</option>
<option value="lime" style="color:lime">Lime</option>
<option value="green" style="color:green">Green</option>
<option value="olive" style="color:olive">Olive</option>
<option value="yellow" style="color:yellow">Yellow</option>
<option value="white" style="color:white">White</option> </select>
<br />
<input type="text" name="helpbox" size="75" class="helpbox" readonly="readonly"/>
</td>
</tr>
<tr>
<td>
Post:<br />
<textarea rows="10" cols="50" name="post" class="form_elements_text"></textarea>
</td>
</tr>
<tr>
<td colspan="2" id="post">
<input type="submit" name="Post" value="Post" class="button" />
<input type="submit" name="preview" value="Preview" class="button"/>
<input type="reset" value="Start over" class="button" onclick="javascript:confirm_reset();"/>
</td>
</tr>
</table>
</form>
</body></html>
I have 2 different examples on how to convert BBcode to HTML.
This one is the second part of the article but it doesn't work for me
- PHP: Select all
<?php
$post = $_POST['post'];
function output_post ($post) {
//Make safe any html
$post_no_html = htmlspecialchars($post);
//Make sure there is no whitespace at the end of the message
//It's conceivable that the user will start their message with whitespace
$post_abridged = chop($post_no_html);
//Callback function for preg_replace_callback below
function convert_for_html ($matches) {
$regex[0] = "[";
$regex[1] = "]";
$replace[0] = "[";
$replace[1] = "]";
ksort($regex);
ksort($replace);
$treated = str_replace($regex, $replace, $matches[1]);
$output = '<table class="code"><tr><td>Code:</td></tr><tr><td class="code_box">' . $treated . '</td></tr></table>';
return $output;
}
//Convert code tags
$code_treated = preg_replace_callback(
"/\[code\](.+?)\[\/code\]/s",
"convert_for_html",
$post_abridged);
//Arrays for the bbCode replacements
$bbcode_regex = array(0 => '/\[b\](.+?)\[\/b\]/s',
1 => '/\[i\](.+?)\[\/i\]/s',
2 => '/\[u\](.+?)\[\/u\]/s',
3 => '/\[quote\](.+?)\[\/quote\]/s',
4 => '/\[quote\=(.+?)](.+?)\[\/quote\]/s',
5 => '/\[url\](.+?)\[\/url\]/s',
6 => '/\[url\=(.+?)\](.+?)\[\/url\]/s',
7 => '/\[img\](.+?)\[\/img\]/s',
8 => '/\[color\=(.+?)\](.+?)\[\/color\]/s',
9 => '/\[size\=(.+?)\](.+?)\[\/size\]/s');
$bbcode_replace = array(0 => '<b>$1</b>',
1 => '<i>$1</i>',
2 => '<u>$1</u>',
3 => '<table class="quote"><tr><td>Quote:</td></tr><tr><td class="quote_box">$1</td></tr></table>',
4 => '<table class="quote"><tr><td>$1 said:</td></tr><tr><td class="quote_box">$2</td></tr></table>',
5 => '<a href="$1">$1</a>',
6 => '<a href="$1">$2</a>',
7 => '<img src="$1" alt="User submitted image" title="User submitted image"/>',
8 => '<span style="color:$1">$2</span>',
9 => '<span style="font-size:$1">$2</span>');
ksort($bbcode_regex);
ksort($bbcode_replace);
//preg_replace to convert all remaining bbCode tags
$post_bbcode_treated = preg_replace($bbcode_regex, $bbcode_replace, $code_treated);
//Convert new lines to <br />
$post_with_br = nl2br($post_bbcode_treated);
echo $post_with_br;
}
?>
and this is the other one which also doesn't work for me
- PHP: Select all
<?php
//BBcode 2 HTML was written by WAY2WEB.net
//It is free for you to use anywhere as long as you provide a link back to www.way2web.net
function BBCode($Text)
{
// Replace any html brackets with HTML Entities to prevent executing HTML or script
// Don't use strip_tags here because it breaks [ url ] search by replacing & with amp
$Text = str_replace("<", "<", $Text);
$Text = str_replace(">", ">", $Text);
// Convert new line chars to html <br /> tags
$Text = nl2br($Text);
// Set up the parameters for a URL search string
$URLSearchString = " a-zA-Z0-9\:\/\-\?\&\.\=\_\~\#\'";
// Set up the parameters for a MAIL search string
$MAILSearchString = $URLSearchString . " a-zA-Z0-9\.@";
// Perform URL Search
$Text = preg_replace("/\[url\]([$URLSearchString]*)\[\/url\]/", '<a href="$1" target="_blank">$1</a>', $Text);
$Text = preg_replace("(\[url\=([$URLSearchString]*)\](.+?)\[/url\])", '<a href="$1" target="_blank">$2</a>', $Text);
//$Text = preg_replace("(\[url\=([$URLSearchString]*)\]([$URLSearchString]*)\[/url\])", '<a href="$1" target="_blank">$2</a>', $Text);
// Perform MAIL Search
$Text = preg_replace("(\[mail\]([$MAILSearchString]*)\[/mail\])", '<a href="mailto:$1">$1</a>', $Text);
$Text = preg_replace("/\[mail\=([$MAILSearchString]*)\](.+?)\[\/mail\]/", '<a href="mailto:$1">$2</a>', $Text);
// Check for bold text
$Text = preg_replace("(\[b\](.+?)\[\/b])is",'<span class="bold">$1</span>',$Text);
// Check for Italics text
$Text = preg_replace("(\[i\](.+?)\[\/i\])is",'<span class="italics">$1</span>',$Text);
// Check for Underline text
$Text = preg_replace("(\[u\](.+?)\[\/u\])is",'<span class="underline">$1</span>',$Text);
// Check for strike-through text
$Text = preg_replace("(\[s\](.+?)\[\/s\])is",'<span class="strikethrough">$1</span>',$Text);
// Check for over-line text
$Text = preg_replace("(\[o\](.+?)\[\/o\])is",'<span class="overline">$1</span>',$Text);
// Check for colored text
$Text = preg_replace("(\[color=(.+?)\](.+?)\[\/color\])is","<span style=\"color: $1\">$2</span>",$Text);
// Check for sized text
$Text = preg_replace("(\[size=(.+?)\](.+?)\[\/size\])is","<span style=\"font-size: $1px\">$2</span>",$Text);
// Check for list text
$Text = preg_replace("/\[list\](.+?)\[\/list\]/is", '<ul class="listbullet">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=1\](.+?)\[\/list\]/is", '<ul class="listdecimal">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=i\](.+?)\[\/list\]/s", '<ul class="listlowerroman">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=I\](.+?)\[\/list\]/s", '<ul class="listupperroman">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=a\](.+?)\[\/list\]/s", '<ul class="listloweralpha">$1</ul>' ,$Text);
$Text = preg_replace("/\[list=A\](.+?)\[\/list\]/s", '<ul class="listupperalpha">$1</ul>' ,$Text);
$Text = str_replace("[*]", "<li>", $Text);
// Check for font change text
$Text = preg_replace("(\[font=(.+?)\](.+?)\[\/font\])","<span style=\"font-family: $1;\">$2</span>",$Text);
// Declare the format for [ code ] layout
$CodeLayout = '<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="quotecodeheader"> Code:</td>
</tr>
<tr>
<td class="codebody">$1</td>
</tr>
</table>';
// Check for [ code ] text
$Text = preg_replace("/\[code\](.+?)\[\/code\]/is","$CodeLayout", $Text);
// Declare the format for [ php ] layout
$phpLayout = '<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="quotecodeheader"> Code:</td>
</tr>
<tr>
<td class="codebody">$1</td>
</tr>
</table>';
// Check for [ php ] text
$Text = preg_replace("/\[php\](.+?)\[\/php\]/is",$phpLayout, $Text);
// Declare the format for [ quote ] layout
$QuoteLayout = '<table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="quotecodeheader"> Quote:</td>
</tr>
<tr>
<td class="quotebody">$1</td>
</tr>
</table>';
// Check for [ quote ] text
$Text = preg_replace("/\[quote\](.+?)\[\/quote\]/is","$QuoteLayout", $Text);
// Images
// [img]pathtoimage[/img]
$Text = preg_replace("/\[img\](.+?)\[\/img\]/", '<img src="$1">', $Text);
// [img=widthxheight]image source[/img]
$Text = preg_replace("/\[img\=([0-9]*)x([0-9]*)\](.+?)\[\/img\]/", '<img src="$3" height="$2" width="$1">', $Text);
return $Text;
}
$text = BBCode($Text);
echo $text;
?>
If anyone can help me get this working I would be very happy
Last edited by AdRock; Sep 1st, 2007 at 20:51.
|
Function to convert BBcode to HTML
Sep 1st, 2007, 20:39
Similar Threads
