LittleNicky Posted August 2, 2006 Share Posted August 2, 2006 I want to create a tool that when a user inputs normal text (into a text box), the text is automatically changed to html when it's displayed. Any ideas? Link to comment Share on other sites More sharing options...
aspnetguy Posted August 2, 2006 Share Posted August 2, 2006 If I were to input the following text how would you expect it to come out? The brown cow walked over the hillHow do you turn text into HTML? Link to comment Share on other sites More sharing options...
boen_robot Posted August 2, 2006 Share Posted August 2, 2006 I think he refers to <strong>some</strong> text Being rendered as some textAnd I must say that if that's the case: that's the worst idea ever. You're practically begging hackers to inject malicios JavaScript there. Link to comment Share on other sites More sharing options...
LittleNicky Posted August 2, 2006 Author Share Posted August 2, 2006 I think he refers to<strong>some</strong> text Being rendered asAnd I must say that if that's the case: that's the worst idea ever. You're practically begging hackers to inject malicios JavaScript there. Yer as boen said it. Things like if I want to start a new line I press enter rather than typing <br> Link to comment Share on other sites More sharing options...
justsomeguy Posted August 2, 2006 Share Posted August 2, 2006 If that's all you want to do, you can use nl2br to convert newlines to "\n<br />". Link to comment Share on other sites More sharing options...
dcole.ath.cx Posted August 2, 2006 Share Posted August 2, 2006 well you could have it not render js or something, maybe it's for a FM where the users has access to only his folder.you can use AJAX to have it automaticly update without refreshing or submitting a form. A.J.A.X talkes with JS to update the info. Link to comment Share on other sites More sharing options...
LittleNicky Posted August 2, 2006 Author Share Posted August 2, 2006 And I must say that if that's the case: that's the worst idea ever. You're practically begging hackers to inject malicios JavaScript there.So lets say I want to create a blog. The user will have a text area to type their blog in, but when they press enter it appears to start a new line. But when they submit the blog and view it, it's all one block off text. This is what I'm trying to avoid. What would you suggest?If that's all you want to do, you can use nl2br to convert newlines to "\n<br />".Whats nl2br? Link to comment Share on other sites More sharing options...
aspnetguy Posted August 2, 2006 Share Posted August 2, 2006 I think he refers to<strong>some</strong> text Being rendered asAnd I must say that if that's the case: that's the worst idea ever. You're practically begging hackers to inject malicios JavaScript there. Well that depends on if you code it to allow javascript execution...you can easily limit to HTML or even only certain tags using one handy regualr expression.I would suggest using either of these.http://kevinroth.com/rte/http://www.fckeditor.net/The first is more simplistic than the 2nd....depends on your needs Link to comment Share on other sites More sharing options...
boen_robot Posted August 2, 2006 Share Posted August 2, 2006 So lets say I want to create a blog. The user will have a text area to type their blog in, but when they press enter it appears to start a new line. But when they submit the blog and view it, it's all one block off text. This is what I'm trying to avoid. What would you suggest?Whats nl2br?What I mean is not to allow entrance of pure HTML in a text area. You could use BBCode as this forum does or create some sort of white list, that is, HTML elements that can be entered, and not allow the user any further modifications. If you choose the BBCodes approach, you must also convert special symbols to entity codes like for example "<" to "<" etc. Link to comment Share on other sites More sharing options...
LittleNicky Posted August 2, 2006 Author Share Posted August 2, 2006 What I mean is not to allow entrance of pure HTML in a text area. You could use BBCode as this forum does or create some sort of white list, that is, HTML elements that can be entered, and not allow the user any further modifications. If you choose the BBCodes approach, you must also convert special symbols to entity codes like for example "<" to "<" etc.That's what I needed! Now how do I implement that? Link to comment Share on other sites More sharing options...
justsomeguy Posted August 2, 2006 Share Posted August 2, 2006 http://www.php.net/manual/en/function.nl2br.phpGo here for implementation help with bbcode, there are links on the bottom for it:http://www.bbcode.org/ Link to comment Share on other sites More sharing options...
aleksanteri Posted August 2, 2006 Share Posted August 2, 2006 I made my own forum engine once, pure PHP + MySQL... It's very simply though . You could just post posts and threads and read them. You could login and register. Posts had simple formatting (bold, italic, underline, strikethough, font alter, color alter, header, hr [actually, a table with ::: text in th] and smilies [i borrowed these here]). Also you could change your password. Now I'm adding a search engine to it (won't be hard). Also I never distributed it, it was private.My technique to change BBcode-like code (like , , [Tahoma], [Purple]) to HTML was the str_replace() function... like this was the code to change to <b>. $post = str_replace("[B]", "<b>", $post);$post = str_replace("[/B]", "</b>", $post); Note it was also case-sensitive! :)You wouldn't even edit your posts... that's under work too. Link to comment Share on other sites More sharing options...
justsomeguy Posted August 2, 2006 Share Posted August 2, 2006 Note it was also case-sensitive!Silly kids!http://www.php.net/manual/en/function.str-ireplace.php Link to comment Share on other sites More sharing options...
The Reverend Posted August 2, 2006 Share Posted August 2, 2006 Regex is the answer my children function bb($str){ $str = htmlentities($str); $search = array( '/\[b\](.*?)\[\/b\]/is', '/\[center\](.*?)\[\/center\]/is', '/\[i\](.*?)\[\/i\]/is', '/\[u\](.*?)\[\/u\]/is','/\[video\](.*?)\[\/video\]/is', '/\[move\](.*?)\[\/move\]/is', '/\[img\=(.*?)\]/is', '/\[hr\]/i', '/\[s\](.*?)\[\/s\]/is', '/\[o\](.*?)\[\/o\]/is', '/\[font\=(.*?)\](.*?)\[\/font\]/is', '/\[url\=(.*?)\](.*?)\[\/url\]/is', '/\[url\](.*?)\[\/url\]/is', '/\[img\](.*?)\[\/img\]/is', '/\[img w\=(.*?)\](.*?)\[\/img\]/is', '/\[sup\](.*?)\[\/sup\]/is', '/\[sub\](.*?)\[\/sub\]/is', '/\[tr\](.*?)\[\/tr\]/is', '/\[td\](.*?)\[\/td\]/is', '/\[table\](.*?)\[\/table\]/is', '/\[tr (.*?)\](.*?)\[\/tr\]/is', '/\[td (.*?)\](.*?)\[\/td\]/is', '/\[table (.*?)\](.*?)\[\/table\]/is', '/\[code\](.*?)\[\/code\]/is', '/\[email\](.*?)\[\/email\]/is', '/\[email\=(.*?)\](.*?)\[\/email\]/is', '/\[quote\](.*?)\[\/quote\]/is', '/\[quote\=(.*?)\](.*?)\[\/quote\]/is', '/\n/i' ); $replace = array( '<strong>$1</strong>', '<center>$1</center>', '<em>$1</em>', '<u>$1</u>','<object width="425" height="350"><param name="movie" value="$1"></param><embed src="$1" type="application/x-shockwave-flash" width="425" height="350"></embed></object>', '<marquee>$1</marquee>', '<img src="$1" />', '<hr />', '<span style="text-decoration:line-through;">$1</span>', '<span style="text-decoration:overline;">$1</span>', '<span style="font-family:$1">$2</span>', '<a href="$1" target="_blank">$2</a>', '<a href="$1" target="_blank">$1</a>', '<img src="$1" />', '<img src="$2" width="$1"/>', '<sup>$1</sup>', '<sub>$1</sub>', '<tr>$1</tr>', '<td>$1</td>', '<table>$1</table>', '<tr $1>$2</tr>', '<td $1>$2</td>', '<table $1>$2</table>', '<b>Code:</b><br /><table class="code"><tr><td class="code">$1</td></tr></table>', '<a href="mailto:$1">$1</a>', '<a href="mailto:$1">$2</a>', '<table width=\'60%\' align=\'center\' border=\'1\' bgcolor="#999999"><tr><td><b>Quote:</b></td></tr><tr><td width=\'100%\'><i>$1</i></td></tr></table>', '<table width=\'60%\' align=\'center\' border=\'1\' bgcolor="#999999"><tr><td><b>Source: $1</b></td></tr><tr><td width=\'100%\'><i>$2</i></td></tr></table>', '<br />' ); $str = preg_replace ($search, $replace, $str); return $str; }; Link to comment Share on other sites More sharing options...
reportingsjr Posted August 3, 2006 Share Posted August 3, 2006 You never thought of using the <pre> tag lol? I tried this once a chat but what happened was like 2 or 3 spaces were added inbetween every letter. You can try it out though. Link to comment Share on other sites More sharing options...
LittleNicky Posted August 3, 2006 Author Share Posted August 3, 2006 Regex is the answer my childrenfunction bb($str){ $str = htmlentities($str); $search = array( '/\[b\](.*?)\[\/b\]/is', '/\[center\](.*?)\[\/center\]/is', '/\[i\](.*?)\[\/i\]/is', '/\[u\](.*?)\[\/u\]/is','/\[video\](.*?)\[\/video\]/is', '/\[move\](.*?)\[\/move\]/is', '/\[img\=(.*?)\]/is', '/\[hr\]/i', '/\[s\](.*?)\[\/s\]/is', '/\[o\](.*?)\[\/o\]/is', '/\[font\=(.*?)\](.*?)\[\/font\]/is', '/\[url\=(.*?)\](.*?)\[\/url\]/is', '/\[url\](.*?)\[\/url\]/is', '/\[img\](.*?)\[\/img\]/is', '/\[img w\=(.*?)\](.*?)\[\/img\]/is', '/\[sup\](.*?)\[\/sup\]/is', '/\[sub\](.*?)\[\/sub\]/is', '/\[tr\](.*?)\[\/tr\]/is', '/\[td\](.*?)\[\/td\]/is', '/\[table\](.*?)\[\/table\]/is', '/\[tr (.*?)\](.*?)\[\/tr\]/is', '/\[td (.*?)\](.*?)\[\/td\]/is', '/\[table (.*?)\](.*?)\[\/table\]/is', '/\[code\](.*?)\[\/code\]/is', '/\[email\](.*?)\[\/email\]/is', '/\[email\=(.*?)\](.*?)\[\/email\]/is', '/\[quote\](.*?)\[\/quote\]/is', '/\[quote\=(.*?)\](.*?)\[\/quote\]/is', '/\n/i' ); $replace = array( '<strong>$1</strong>', '<center>$1</center>', '<em>$1</em>', '<u>$1</u>','<object width="425" height="350"><param name="movie" value="$1"></param><embed src="$1" type="application/x-shockwave-flash" width="425" height="350"></embed></object>', '<marquee>$1</marquee>', '<img src="$1" />', '<hr />', '<span style="text-decoration:line-through;">$1</span>', '<span style="text-decoration:overline;">$1</span>', '<span style="font-family:$1">$2</span>', '<a href="$1" target="_blank">$2</a>', '<a href="$1" target="_blank">$1</a>', '<img src="$1" />', '<img src="$2" width="$1"/>', '<sup>$1</sup>', '<sub>$1</sub>', '<tr>$1</tr>', '<td>$1</td>', '<table>$1</table>', '<tr $1>$2</tr>', '<td $1>$2</td>', '<table $1>$2</table>', '<b>Code:</b><br /><table class="code"><tr><td class="code">$1</td></tr></table>', '<a href="mailto:$1">$1</a>', '<a href="mailto:$1">$2</a>', '<table width=\'60%\' align=\'center\' border=\'1\' bgcolor="#999999"><tr><td><b>Quote:</b></td></tr><tr><td width=\'100%\'><i>$1</i></td></tr></table>', '<table width=\'60%\' align=\'center\' border=\'1\' bgcolor="#999999"><tr><td><b>Source: $1</b></td></tr><tr><td width=\'100%\'><i>$2</i></td></tr></table>', '<br />' ); $str = preg_replace ($search, $replace, $str); return $str; }; It looks impressive, but any chance you can explain what's going on here? Link to comment Share on other sites More sharing options...
aleksanteri Posted August 3, 2006 Share Posted August 3, 2006 Silly kids!http://www.php.net/manual/en/function.str-ireplace.php Was there that kind of function? I never saw that. Link to comment Share on other sites More sharing options...
LittleNicky Posted August 3, 2006 Author Share Posted August 3, 2006 I made my own forum engine once, pure PHP + MySQL... It's very simply though . You could just post posts and threads and read them. You could login and register. Posts had simple formatting (bold, italic, underline, strikethough, font alter, color alter, header, hr [actually, a table with ::: text in th] and smilies [i borrowed these here]). Also you could change your password. Now I'm adding a search engine to it (won't be hard). Also I never distributed it, it was private.My technique to change BBcode-like code (like , , [Tahoma], [Purple]) to HTML was the str_replace() function... like this was the code to change to <b>.$post = str_replace("[B]", "<b>", $post);$post = str_replace("[/B]", "</b>", $post); Note it was also case-sensitive! :)You wouldn't even edit your posts... that's under work too. So this sort of thing would be implemented by having a 'bold' button which inserts a "B" before and a "/B" after my text that I've selected. Is that correct? So what about inserting a <br>? Users would not want to click a button on the screen every time they want a new line. Link to comment Share on other sites More sharing options...
aleksanteri Posted August 3, 2006 Share Posted August 3, 2006 \n into <br />? $post = str_ireplace("\n", "<br />", $post); That changes every line break into <br />, that works if you have a text area. You can't even write \n in the text box to make a <br />, it is automatically converted to PHP format. :)Oh and this is the exact code for bold I have at my forum engine now: $post = str_ireplace("[B]", "<b>", $post);$post = str_ireplace("[/B]", "</b>", $post); You can variate that code to italics, underline (use <span style="text-decoration: underline> if XHTML Strict), strikethrough, even fonts and colors like I did! My technique to fonts and colors was to have a common.lib.php file and there write in an array all the fonts that I would like. Then I just used foreach() for the bold code. Same for colors. Link to comment Share on other sites More sharing options...
LittleNicky Posted August 3, 2006 Author Share Posted August 3, 2006 \n into <br />?$post = str_ireplace("\n", "<br />", $post); That changes every line break into <br />, that works if you have a text area. You can't even write \n in the text box to make a <br />, it is automatically converted to PHP format. Ok cool, so do i put all of these into a php file then include them the relevant pages? Link to comment Share on other sites More sharing options...
aleksanteri Posted August 3, 2006 Share Posted August 3, 2006 Yep.And I also changed all str_replaces to str_ireplaces that they would be case-insensitive (thanks justsomeguy). But that line break code you don't need to, the line break is always \n, never \N. Link to comment Share on other sites More sharing options...
justsomeguy Posted August 3, 2006 Share Posted August 3, 2006 You can use the nl2br function to convert all newlines to br tags automatically:http://www.php.net/manual/en/function.nl2br.phpAs for the regular expression code: Regex is the answer my childrenfunction bb($str){ $str = htmlentities($str); $search = array( '/\[b\](.*?)\[\/b\]/is', '/\[center\](.*?)\[\/center\]/is', '/\[i\](.*?)\[\/i\]/is', '/\[u\](.*?)\[\/u\]/is', '/\[video\](.*?)\[\/video\]/is', '/\[move\](.*?)\[\/move\]/is', '/\[img\=(.*?)\]/is', '/\[hr\]/i', '/\[s\](.*?)\[\/s\]/is', '/\[o\](.*?)\[\/o\]/is', '/\[font\=(.*?)\](.*?)\[\/font\]/is', '/\[url\=(.*?)\](.*?)\[\/url\]/is', '/\[url\](.*?)\[\/url\]/is', '/\[img\](.*?)\[\/img\]/is', '/\[img w\=(.*?)\](.*?)\[\/img\]/is', '/\[sup\](.*?)\[\/sup\]/is', '/\[sub\](.*?)\[\/sub\]/is', '/\[tr\](.*?)\[\/tr\]/is', '/\[td\](.*?)\[\/td\]/is', '/\[table\](.*?)\[\/table\]/is', '/\[tr (.*?)\](.*?)\[\/tr\]/is', '/\[td (.*?)\](.*?)\[\/td\]/is', '/\[table (.*?)\](.*?)\[\/table\]/is', '/\[code\](.*?)\[\/code\]/is', '/\[email\](.*?)\[\/email\]/is', '/\[email\=(.*?)\](.*?)\[\/email\]/is', '/\[quote\](.*?)\[\/quote\]/is', '/\[quote\=(.*?)\](.*?)\[\/quote\]/is', '/\n/i' ); $replace = array( '<strong>$1</strong>', '<center>$1</center>', '<em>$1</em>', '<u>$1</u>', '<object width="425" height="350"><param name="movie" value="$1"></param><embed src="$1" type="application/x-shockwave-flash" width="425" height="350"></embed></object>', '<marquee>$1</marquee>', '<img src="$1" />', '<hr />', '<span style="text-decoration:line-through;">$1</span>', '<span style="text-decoration:overline;">$1</span>', '<span style="font-family:$1">$2</span>', '<a href="$1" target="_blank">$2</a>', '<a href="$1" target="_blank">$1</a>', '<img src="$1" />', '<img src="$2" width="$1"/>', '<sup>$1</sup>', '<sub>$1</sub>', '<tr>$1</tr>', '<td>$1</td>', '<table>$1</table>', '<tr $1>$2</tr>', '<td $1>$2</td>', '<table $1>$2</table>', '<b>Code:</b><br /><table class="code"><tr><td class="code">$1</td></tr></table>', '<a href="mailto:$1">$1</a>', '<a href="mailto:$1">$2</a>', '<table width=\'60%\' align=\'center\' border=\'1\' bgcolor="#999999"><tr><td><b>Quote:</b></td></tr><tr><td width=\'100%\'><i>$1</i></td></tr></table>', '<table width=\'60%\' align=\'center\' border=\'1\' bgcolor="#999999"><tr><td><b>Source: $1</b></td></tr><tr><td width=\'100%\'><i>$2</i></td></tr></table>', '<br />' ); $str = preg_replace ($search, $replace, $str); return $str; }; The first thing he does is set up two arrays, a "search" array and a "replace" array. The preg_replace function takes both arrays, and the target string. When two arrays are pased to preg_replace, it will replace the first search element by the first replace element, the second search element by the second replace element, the third search element by the third replace element, etc. So the first search element:'/\[b\](.*?)\[\/b\]/is'Which is a regular expression to find all cases of bold tags, gets replaced with the first replace element:'<strong>$1</strong>'Which of course converts it into "<strong>" tags. The $1 is a "backreference", meaning that the $1 gets replaced with the first match from the search pattern. In practical terms, that means that whatever text is between the bold tags will be inserted into the replacement pattern.If you look through the search array, you can see that it finds bold, italic, underline, video, image, strikethrough, object, font, url, code, quote and many more bbcode tags, and replaces them with their corresponding HTML equivalents. It should also be noted that this will also replace all newlines with br tags, so if you use this function as well as nl2br, you will get 2 br tags for every newline (if you use nl2br first since nl2br leaves the newlines, but this function will replace the newline with the br tag).This is actually a very handy function, and is probably exactly what you're looking for. Link to comment Share on other sites More sharing options...
aspnetguy Posted August 3, 2006 Share Posted August 3, 2006 Only thing I would change is all the single celled tables to <div> Link to comment Share on other sites More sharing options...
LittleNicky Posted August 3, 2006 Author Share Posted August 3, 2006 You can use the nl2br function to convert all newlines to br tags automatically:http://www.php.net/manual/en/function.nl2br.phpAs for the regular expression code:The first thing he does is set up two arrays, a "search" array and a "replace" array. The preg_replace function takes both arrays, and the target string. When two arrays are pased to preg_replace, it will replace the first search element by the first replace element, the second search element by the second replace element, the third search element by the third replace element, etc. So the first search element:'/\[b\](.*?)\[\/b\]/is'Which is a regular expression to find all cases of bold tags, gets replaced with the first replace element:'<strong>$1</strong>'Which of course converts it into "<strong>" tags. The $1 is a "backreference", meaning that the $1 gets replaced with the first match from the search pattern. In practical terms, that means that whatever text is between the bold tags will be inserted into the replacement pattern.If you look through the search array, you can see that it finds bold, italic, underline, video, image, strikethrough, object, font, url, code, quote and many more bbcode tags, and replaces them with their corresponding HTML equivalents. It should also be noted that this will also replace all newlines with br tags, so if you use this function as well as nl2br, you will get 2 br tags for every newline (if you use nl2br first since nl2br leaves the newlines, but this function will replace the newline with the br tag).This is actually a very handy function, and is probably exactly what you're looking for.It does look like what I want. I'm having trouble implementing it tho.At what point might I use the function? I assume I have to apply it to the input of the textarea, but how? Link to comment Share on other sites More sharing options...
justsomeguy Posted August 3, 2006 Share Posted August 3, 2006 You can just do this:echo bb($post_content);Of course, you have to define the function before you use it, so stick it in an include file or something like that.include("bbcode.php");echo bb($post_content); Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now