3v4l.org

run code in 200+ php & hhvm versions
Bugs & Features
<style> textarea { padding: 10px; margin-top: 5px; width: 3px; height: 150px; width:350px; font-size:15px; border-radius:3px; border:1px solid lightgrey; } textarea:focus { color: red; border:1px solid red; outline:none; } #functions { border:1px solid lightgrey; width:350px; padding-top:5px; padding-bottom:5px; margin:0 auto; border-radius:5px; } #functions:hover { border:1px solid red; } input[type=button] { color:red; padding-left:5px; padding-right:5px; background-color: lightgrey; border:none; border-radius:5px; outline:none; font-size:13px; cursor: pointer; } input[type=button]:active { background-color:darkgrey; } input[type=button]:hover { background-color:red; color:lightgrey; } button { color:white; background-color: red; font-size:15px; border:none; outline:none; border-radius:4px; cursor: pointer; margin-top: 5px; } button:active { font-size:17px; } body { background-color: lightgrey; } #parser { background-color:white; border-radius:5px; text-align: center; width: 350px; margin:0 auto; padding:15px; } #live { background-color:white; border-radius:5px; text-align: center; width: 350px; margin:0 auto; margin-top:20px; padding:15px; font-size:10px; } #output { border:1px solid red; border-radius:5px; width:100%; font-size:14px; padding:5px; } </style> <script> function formatText(tag) { var Field = document.getElementById('comment'); var val = Field.value; var selected_txt = val.substring(Field.selectionStart, Field.selectionEnd); var before_txt = val.substring(0, Field.selectionStart); var after_txt = val.substring(Field.selectionEnd, val.length); Field.value += '[' + tag + ']' + '[/' + tag + ']'; } </script> <body> <div id="parser"> <div id="functions"> <input type="button" value="Bold" onclick="formatText ('b');" /> <input type="button" value="Italic" onclick="formatText ('i');" /> <input type="button" value="Underline" onclick="formatText ('u');" /> <input type="button" value="Code" onclick="formatText ('quote');" /> <input type="button" value="URL" onclick="formatText ('url');" /> <input type="button" value="IMG" onclick="formatText ('img');" /> </div> <form method="post"> <textarea name="comment" id="comment"></textarea> <br> <button>Parse</button> </form> </div> </body> <?php //BBCode Parser function function showBBcodes($text) { // BBcode array $find = array( '~\[b\](.*?)\[/b\]~s', '~\[i\](.*?)\[/i\]~s', '~\[u\](.*?)\[/u\]~s', '~\[quote\](.*?)\[/quote\]~s', '~\[size=(.*?)\](.*?)\[/size\]~s', '~\[color=(.*?)\](.*?)\[/color\]~s', '~\[url\]((?:ftp|https?)://.*?)\[/url\]~s', '~\[img\](https?://.*?\.(?:jpg|jpeg|gif|png|bmp))\[/img\]~s' ); // HTML tags to replace BBcode $replace = array( '<b>$1</b>', '<i>$1</i>', '<span style="text-decoration:underline;">$1</span>', '<pre>$1</'.'pre>', '<span style="font-size:$1px;">$2</span>', '<span style="color:$1;">$2</span>', '<a href="$1">$1</a>', '<img src="$1" alt="" />' ); // Replacing the BBcodes with corresponding HTML tags return preg_replace($find,$replace,$text); } // How to use the above function: if ($_POST){ $bbtext = $_POST['comment']; $htmltext = showBBcodes($bbtext); ?> <div id="live"> <p> Live </p> <div id="output"> <?php echo $htmltext; ?> </div> </div> <?php } ?>
Output for 5.6.0 - 7.3.0rc4
<style> textarea { padding: 10px; margin-top: 5px; width: 3px; height: 150px; width:350px; font-size:15px; border-radius:3px; border:1px solid lightgrey; } textarea:focus { color: red; border:1px solid red; outline:none; } #functions { border:1px solid lightgrey; width:350px; padding-top:5px; padding-bottom:5px; margin:0 auto; border-radius:5px; } #functions:hover { border:1px solid red; } input[type=button] { color:red; padding-left:5px; padding-right:5px; background-color: lightgrey; border:none; border-radius:5px; outline:none; font-size:13px; cursor: pointer; } input[type=button]:active { background-color:darkgrey; } input[type=button]:hover { background-color:red; color:lightgrey; } button { color:white; background-color: red; font-size:15px; border:none; outline:none; border-radius:4px; cursor: pointer; margin-top: 5px; } button:active { font-size:17px; } body { background-color: lightgrey; } #parser { background-color:white; border-radius:5px; text-align: center; width: 350px; margin:0 auto; padding:15px; } #live { background-color:white; border-radius:5px; text-align: center; width: 350px; margin:0 auto; margin-top:20px; padding:15px; font-size:10px; } #output { border:1px solid red; border-radius:5px; width:100%; font-size:14px; padding:5px; } </style> <script> function formatText(tag) { var Field = document.getElementById('comment'); var val = Field.value; var selected_txt = val.substring(Field.selectionStart, Field.selectionEnd); var before_txt = val.substring(0, Field.selectionStart); var after_txt = val.substring(Field.selectionEnd, val.length); Field.value += '[' + tag + ']' + '[/' + tag + ']'; } </script> <body> <div id="parser"> <div id="functions"> <input type="button" value="Bold" onclick="formatText ('b');" /> <input type="button" value="Italic" onclick="formatText ('i');" /> <input type="button" value="Underline" onclick="formatText ('u');" /> <input type="button" value="Code" onclick="formatText ('quote');" /> <input type="button" value="URL" onclick="formatText ('url');" /> <input type="button" value="IMG" onclick="formatText ('img');" /> </div> <form method="post"> <textarea name="comment" id="comment"></textarea> <br> <button>Parse</button> </form> </div> </body>