it's me soniclnd again......... I've been out for a while mostly because i've been more interested in PHP and stuff.... i read that other tutorial on BBcode and saw that people were interested on it, so i decided to cover more than just smilies......
In this tutorial I will try to teach you how to change a string into BBCode
For this tutorial you should have a background knowledge of PHP and Regular Expresions. Please Bear with me as I am new in this whole tutorial business :)
__________________________________________________ ___________________ Background and goals
So, you just made a new PHP website and you have made a Guestbook, Chatterbox, or anything else that requires user input... You think it looks plain and you want to give the user more choices, so you want to use the ever so famous(or not so) BBCode that you see on all those fancy forums... Well here's the plan to do it:
> You get a string of what you want to change
> You replace all occurences of BB formating with their HTML counterpart(ex: [ b]and[/ b] with and)
> You asign that new string a name which you can later use
How can we achieve this?: You can take advantage of PHP's PCRE functions, specifically preg_replace().
__________________________________________________ ___________________ Stablishing the Regex
Now that we've got our plan, you can start executing it.
First is to identify what preg_replace() needs: preg_replace() needs at least 3 arguments:
> mixed pattern
> mixed replacement
> mixed subject
Mixed pattern is the regex to find what we want to replace(it can be a string or an array), Mixed replacement is what we will replace it with(it can be a string or an array), and Mixed subject is where this replacement will take place(it can also be a string or an array).
So we need to create the Regex. We need to first take a look at a basic BBcode:
Code:
[ b ]bold[/b]
[ i ]italics[/i]
[ u ]underlined[/u]
[ url=h ttp://something.com]link to something[/url]
[ img ]image.png[/img]
Let's create a regex for the [ b ] tag:
There will always be the [ b ] part present so we can safely add "\[b\]" notice how I've scaped the brackets, this is because the brackets are used to define Character Classes in the regex engine
now there will be something that varies. we could but a dot "." but this won't match if there is a line break, we can also add something like "[^\[]" (anything that isn't an openig bracket) This would be a good choice, however it won't match things like [ b][ i][u ]something[/ u][/ i][/ b].... Whenever I want to match everything I use [\D\S] (it matches anything that isn't a digit or isn't a space, since nothing is both a digit and a space, it matches everything) so now we have "\[b\][\D\S]"
however we want to match more than one character so we add the plus sign "+" after the character class and we want it to be non-greedy so we have: "\[b\][\D\S]+?"
Now the [/b] part will always be present, so we can add it literally to the end "\[b\][\D\S]+?\[/b\]"
We will need to remember what's betwen the tags for later, so we'll add the parenthesis around it: "\[b\]([\D\S]+?)\[/b\]"
This is a good regex, however we have to format it for the PHP Regex engine, in it we need to specify a modifyer and escape all forward-slashes(/), so now our PHP regex will look like this: "/\[b\]([\D\S]+?)\[\/b\]/"
the [ i] and [ u ] tags are very similar so we can just change the b for the respective letter:
__________________________________________________ ___________________ The replacements
Now that you have your regex we'll need the replacements:
[ b ], [ i ], and [ u ]:
We'll replace the [ b ]something[/ b] matches with something. So we'll have the tag, whatever we remembered(what's inside parenthesis......) and the . so our replacement will look like the following: $1. The $1 is the pointer for the first group(the first stuff that's inside the parenthesis).
For the [i] and [u] it's the same so we have:
Well replace [ img ]something.png[/ im g] with [img]something.png[/img]. so we have [img], what we remembered, then [/img]. our replacement will be the following "[img]$1[/img]"
So you want smilies and quotes eh?.... No problem: Quotes
if you want quotes you can add "/\[quote]([\D\S]+?)\[\/quote\]/" to the regexes array and "<div class=\"quote\">Quote:
$1</div>" to the replacements array
NOTE: you must style class="quote" to your preferences in your stylesheet....
Smilies
smilies can be replaced using literal regexes, so i won't go into detail, remember that some smilies have certain characters that must be escaped in regular expressions. Here are some examples of smily regexes:
NOTE: i add my smilies with $regexes[]= which adds one more entry to the regexes array, i add the coresponding replacement with $replacement[]= which adds one more entry to the replacement array, i put them separate from the other BBCode so it's easier to edit them....
__________________________________________________ ___________________ Final words of wisdom
Wen used with arrays, preg_replace() looks for $regexes[0] and replaces it with $replacements[0], $regexes[1] with $replacements[1], etc... So it is extremely important that you have coresponding regexes and arrays in the same index number NOTE: some of the BBCode has been spaced out like [ b ] so it won't be parced by the forums
NOTE: Regular expressions can seem daunting at first, but if you're serious about programming you should be familiar with them sooner or later.....
__________________________________________________ ___________________
And that's it!
You now have a varible called $formated in which all the BBcode has been parsed... Let's take our first code and use it as an example:
First off - its nice to see ya' around on the boards I was wondering where you were at man. Long time no see.
Thanks for the BBCode code, thats pretty cool ;).
08-04-2005, 10:20 AM
soniclnd
yeah, thanx..... i've just been working on my site and learning about PHP and such.... also been vacationing, and i kinda stop doing gfx, but since there's a coding forum i thought i'd post something useful.....
08-24-2005, 04:16 PM
MajesticM00se
i good parser needs to parse individual characters also because the parser is supposed to stop people from creating messages or invaliad posts that could currupt the page so if your going to use this always remember to add something like:
