Nov 21, 2009
Pages: 1, 2

How To #3: Custom BBCdes For This Board (Note)

free web hosting

Read Latest Entries..: (Post #15) by mastercomputers on Apr 29 2006, 03:27 AM.
Notice from mastercomputers: I have updated my Notice BBCode site Just would like to point out the site now, which has instructions to get it working under IPB (not tested though), also fixes to work with IE, except I need to work on alpha-transparency, which I may remove since it would require server-side scripting, which won't do for this, so maybe revert back to normal images without transparency, but makes changing the colour easy.The link is http://mastercompute...
read more.
Read the FIRST post of this Topic. - Express your Opinion! Contribute Knowledge :-).

Open Discussion & Free Web Hosting > Computers & Tech > How-To's and Tutorials > Programming > HTML, XML and other Markup Languages

How To #3: Custom BBCdes For This Board (Note)

miCRoSCoPiC^eaRthLinG
Hi,
    Here I am with yet a third tutorial on the NOTE tag. Most of the mods would have noticed a drastic change in it's appearance over the past few days - bit by bit... I'm going to put up the code today and do a little bit of explaining as to how it works.

    This code's script is quite long and winding though and has got 2 parts - first a JavaScript that defines a function which is reponsible for the Expand/Collapse button of the note - and the second part constitutes of the actual <DIV> layers which give the note it's shape/size/color/graphics. First here's the code:
CODE

<script>
function toggle(toggleId, e)
{
if (!e) {
e = window.event;
}
if (!document.getElementById) {
return false;
}
var body = document.getElementById(toggleId);
if (!body) {
return false;
}
var im = toggleId + "_toggle";
if (body.style.display == 'none') {
body.style.display = 'block';
if (document.images[im]) {
document.images[im].src = "close.png";
}
} else {
body.style.display = 'none';
if (document.images[im]) {
document.images[im].src = "open.png";
}
}
if (e) {
// Stop the event from propagating, which
// would cause the regular HREF link to
// be followed, ruining our hard work.
e.cancelBubble = true;
if (e.stopPropagation) {
e.stopPropagation();
}
}
}
</script>
<div id="notice" style="width: 505px; border: solid 2px #FF0000; background-color: #FFFFCE;">
<div id="header" style="width: 505px; color: #FFFFCE;">
<div id="rightbox" onClick="toggle('notemsg', event)" style="width: 15px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/closebutton.jpg); color: #FFFFCE; float: right; cursor: pointer; font-family: Tahoma; font-size: 9px; font-weight:bold;"></div>
<div id="leftbox" style="width: 20px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/topleft.jpg); color: #FFFFCE; float: left; padding-top: 0px; padding-bottom: 0px;"></div>
<div id="middlebar" style="padding-left: 5px; width: 475px; height: 16px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/notetitle.jpg); color: #FFFFCE; float: center; font-family: Tahoma; font-size: 12px; font-weight: bold;"><b><center>Notice from {option}:</center></b></div>
</div>
<div id="notemsg" style="width: 475px; padding-top: 10px; padding-bottom: 10px; padding-left: 15px; padding-right: 15px; background-color: #FFFFCE; font-family: Tahoma; font-size: 12px;">{content}</div>
</div>



    I wouldn't go into explaining the JavaScript - it's something I got off the web, though I've lost the link. Just google for it and you'd find it for sure. But here's the arrangement of nested <DIV> tags that create the note.
CODE
<div id="notice" style="width: 505px; border: solid 2px #FF0000; background-color: #FFFFCE;">

   <div id="header" style="width: 505px; color: #FFFFCE;">

       <div id="rightbox" onClick="toggle('notemsg', event)" style="width: 15px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/closebutton.jpg); color: #FFFFCE; float: right; cursor: pointer; font-family: Tahoma; font-size: 9px; font-weight:bold;"></div>
       
       <div id="leftbox" style="width: 20px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/topleft.jpg); color: #FFFFCE; float: left; padding-top: 0px; padding-bottom: 0px;"></div>

       <div id="middlebar" style="padding-left: 5px; width: 475px; height: 16px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/notetitle.jpg); color: #FFFFCE; float: center; font-family: Tahoma; font-size: 12px; font-weight: bold;"><b><center>Notice from {option}:</center></b></div>
   
   </div>

   <div id="notemsg" style="width: 475px; padding-top: 10px; padding-bottom: 10px; padding-left: 15px; padding-right: 15px; background-color: #FFFFCE; font-family: Tahoma; font-size: 12px;">{content}</div>

</div>


    As you can see there's a master div named noticewhich contains all the rest of the parts nested inside it. Under "notice" there are two more divs - the header that contains the icon, the titlebar and "X" button, and the notemsg div which contains the actual message body. I'm attaching a picture below. This might help you understand the layout better.


    The 'header" div as you can see from the picture binds three divs, leftbox, middlebar & rightbox - the cryptic paramters along with the divs, are CSS (StyleSheet) parameters which define the size, color, background-image etc - all attributes of these individual divs. Now, while adding these three divs into the header div, you might want to progress in a logical order, i.e. - first the leftbox, next middlebar and then rightbox.. But here's you'll notice something funny - I've added the rightbox FIRST and then added left & middle. WHY I had to do it this way ?? Don't ask me - I still haven't acquired full understanding of how the nested div positioning works - just that when I added the rightbox last it jumped out of the note box and got placed far below in the right bottom corner.. So I figured this out through experimentation..

    Don't think much more explanation is needed about the divs. With a little understanding of HTML and CSS2 you can figure it out yourself... Only point I'm going to mention is that notice this part in the "rightbox" div: onClick="toggle('notemsg', event)"
CODE
<div id="rightbox" onClick="toggle('notemsg', event)" style="width: 15px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/closebutton.jpg); color: #FFFFCE; float: right; cursor: pointer; font-family: Tahoma; font-size: 9px; font-weight:bold;"></div>


    This is the part that triggers the javascript collapsing routine and expands/collapses the "notemsg" div. The name (ID) of that div is being passed on to the function as an arguement. The event variable acts as a bi-state toggle switch. When expanded - it collapses and when collapsed it expands.. That's it I guess - I'll be back later and try spruce up the tut and put in some more explanations for the noobs.

Notice from microscopic^earthling:
Till then, have fun smile.gif Lol.. I came back and added this as an example of the NOTE tag. I'd completely forgotten about it. Thanks to vujsa for reminding me. Hope the bug gets fixed quick.

 

 

 


Comment/Reply (w/o sign-up)

vizskywalker
I think I came up with a fix for the expanding/collapsing every single note on the page.
Here's the code:
CODE
<?php

$param = {option};
list($name, $id) = split(" ", $param);

print <<<END

<script>
function toggle(toggleId, e)
{
if (!e) {
e = window.event;
}
if (!document.getElementById) {
return false;
}
var body = document.getElementById(toggleId.id);
if (!body) {
return false;
}
var im = toggleId + "_toggle";
if (body.style.display == 'none') {
body.style.display = 'block';
if (document.images[im]) {
document.images[im].src = "close.png";
}
} else {
body.style.display = 'none';
if (document.images[im]) {
document.images[im].src = "open.png";
}
}
if (e) {
// Stop the event from propagating, which
// would cause the regular HREF link to
// be followed, ruining our hard work.
e.cancelBubble = true;
if (e.stopPropagation) {
e.stopPropagation();
}
}
}
</script>
<div class="notice" style="width: 505px; border: solid 2px #FF0000; background-color: #FFFFCE;">
<div class="header" style="width: 505px; color: #FFFFCE;">
<div class="rightbox" onClick="toggle($id, event)" style="width: 15px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/closebutton.jpg); color: #FFFFCE; float: right; cursor: pointer; font-family: Tahoma; font-size: 9px; font-weight:bold;"></div>
<div class="leftbox" style="width: 20px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/topleft.jpg); color: #FFFFCE; float: left; padding-top: 0px; padding-bottom: 0px;"></div>
<div class="middlebar" style="padding-left: 5px; width: 475px; height: 16px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/notetitle.jpg); color: #FFFFCE; float: center; font-family: Tahoma; font-size: 12px; font-weight: bold;"><b><center>Notice from $name:</center></b></div>
</div>
<div class="notemsg" id="$id" style="width: 475px; padding-top: 10px; padding-bottom: 10px; padding-left: 15px; padding-right: 15px; background-color: #FFFFCE; font-family: Tahoma; font-size: 12px;">{content}</div>
</div>
END;
?>


There are three major changes form what you had (well four, but the fourth is obvious).
1) It is now all enclosed in PHP
2) {option} is really two parameters that are split in the beginning of the code
3) the ids have been changed to classes
4) The document.getElementById() now takes an ID like it is supposed to instead of an object

What I did was have the moderator give there not a unique ID as the second parameter, this ID becomes the ID for the message box that will be toggled. Whe document.getElementById() is called, it takes the unique ID and searches for it, and toggles only that one. Oh, and the "class=blah" can probably be removed from the div tag, the whole purpose of class=blah (and almost the whole purpose of id=blah) is to provide style from a style sheet. Since you provide the style in the tag, the sheet is overridden and thus useless.

For an example of this, goto http://www.mouseisle.com/BBCode.php
This page is also the new location for my [BLINK] Code, and I will be deleting the old html location of that shortly.

 

 

 


Comment/Reply (w/o sign-up)

vujsa
Without access to the IPB BBC parser, I can't say for sure as to how to code it, but the best way that I have come up with from a DHTML point of view is to use {content} to generate the id value.

The method I used was to get a hash of {content} with the md5() function. Time() or microtime() may produce two seperate values. Date isn't specific enough. Basically, you need a constant specific to each note and that is {content}.

The md5() function doesn't care about non-alpha-numeric characters and will produce the same hash every time for a specific string but is highly unlikely to produce the same hash for two different strings.

CODE

<script>
function toggle(toggleId, e){
if (!e) {
e = window.event;
}
if (!document.getElementById) {
return false;
}
var body = document.getElementById(toggleId);
if (!body) {
return false;
}
var im = toggleId + "_toggle";
if (body.style.display == 'none') {
body.style.display = 'block';
if (document.images[im]) {
document.images[im].src = "close.png";
}
} else {
body.style.display = 'none';
if (document.images[im]) {
document.images[im].src = "open.png";
}
}
if (e) { // Stop the event from propagating, which would cause the regular HREF link to be followed, ruining our hard work.
e.cancelBubble = true;
if (e.stopPropagation) {
e.stopPropagation();
}
}
}
</script>
<?php
function id_name($id){
$id = md5($id);
return $id;
}
?>

<div id="notice" style="width: 505px; border: solid 2px #FF0000; background-color: #FFFFCE;">
<div id="header" style="width: 505px; color: #FFFFCE;">
<div id="rightbox" onClick="toggle('notemsg', event)" style="width: 15px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/closebutton.jpg); color: #FFFFCE; float: right; cursor: pointer; font-family: Tahoma; font-size: 9px; font-weight:bold;"></div>
<div id="leftbox" style="width: 20px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/topleft.jpg); color: #FFFFCE; float: left; padding-top: 0px; padding-bottom: 0px;"></div>
<div id="middlebar" style="padding-left: 5px; width: 475px; height: 16px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/notetitle.jpg); color: #FFFFCE; float: center; font-family: Tahoma; font-size: 12px; font-weight: bold;"><b><center>Notice from beetleman:</center></b></div>
</div>
<div id="notemsg" style="width: 475px; padding-top: 10px; padding-bottom: 10px; padding-left: 15px; padding-right: 15px; background-color: #FFFFCE; font-family: Tahoma; font-size: 12px;">Note #1</div>
</div>

<div id="notice" style="width: 505px; border: solid 2px #FF0000; background-color: #FFFFCE;">
<div id="header" style="width: 505px; color: #FFFFCE;">
<div id="rightbox" onClick="toggle('<?php echo id_name("{content}"); ?>', event)" style="width: 15px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/closebutton.jpg); color: #FFFFCE; float: right; cursor: pointer; font-family: Tahoma; font-size: 9px; font-weight:bold;"></div>
<div id="leftbox" style="width: 20px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/topleft.jpg); color: #FFFFCE; float: left; padding-top: 0px; padding-bottom: 0px;"></div>
<div id="middlebar" style="padding-left: 5px; width: 475px; height: 16px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/notetitle.jpg); color: #FFFFCE; float: center; font-family: Tahoma; font-size: 12px; font-weight: bold;"><b><center>Notice from {option}:</center></b></div>
</div>
<div id="<?php echo id_name("{content}"); ?>" style="width: 475px; padding-top: 10px; padding-bottom: 10px; padding-left: 15px; padding-right: 15px; background-color: #FFFFCE; font-family: Tahoma; font-size: 12px;">{content}</div>
</div>


This worked in my browser stand alone with an actual string instead of {content}. I imagine something like vizskywalker's suggestion will need to be done where a variable is assigned the value of {content}.

Let me know if this helps at all.

vujsa

Notice from vujsa:
Thought that there should be a note tag actually used in the note tag tutorial.


Notice from vujsa:
This note is here to be used as a test note for the identification bug that is still being resolved.

Comment/Reply (w/o sign-up)

vizskywalker
That actually looks like a better method, but yeah, you need to save the id to a variable so that it can be passed to a function. So I would still stick the whole <div> in a php script to make that easier and use the print <<<END feature. Then you could do onClick = onClick="toggle($id, event).

Comment/Reply (w/o sign-up)

miCRoSCoPiC^eaRthLinG
Hey guys.. thanks for ur suggestions.. I'm trying them out now to see which one the BBCode parser will parse correctly.. I think we're seeing a solution quite soon smile.gif

Comment/Reply (w/o sign-up)

vizskywalker
QUOTE (microscopic^earthling @ Apr 6 2005, 05:48 AM)
Hey guys.. thanks for ur suggestions.. I'm trying them out now to see which one the BBCode parser will parse correctly.. I think we're seeing a solution quite soon smile.gif
*

Whichever one you tried didn't work. Right now what happens is that only one closes, but it is always the first one. (And please let us know which one does this so that we may learn smile.gif)

Comment/Reply (w/o sign-up)

X-Wes
Rather than using an MD5 hash or asking the poster to supply a unique ID, I would like to propose the idea of automatic sequential numbering of the NOTEs using a JavaScript global variable. My original reply still exists, but I have since been able to concrete my findings somewhat.

First, take a look at the sample (attached).

The one-time JavaScript code is still the same; the function toggle is still defined as before and such. However, the "nested divs" section is changed, with some JavaScript added. Here is the revised section:

CODE
<div id="notice" style="width: 505px; border: solid 2px #FF0000; background-color: #FFFFCE;">
 <div id="header" style="width: 505px; color: #FFFFCE;">
   <script>
     if (typeof noteCount == 'undefined')
     {
       var noteCount = 1;
     }
     
     else
     {
       noteCount++;
     }
     
     document.write("<div id=\"rightbox\" onClick=\"toggle('notemsg" + noteCount + "', event)\" style=\"width: 15px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/closebutton.jpg); color: #FFFFCE; float: right; cursor: pointer; font-family: Tahoma; font-size: 9px; font-weight:bold;\"></div>");
   </script>
   <div id="leftbox" style="width: 20px; height: 15px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/topleft.jpg); color: #FFFFCE; float: left; padding-top: 0px; padding-bottom: 0px;"></div>
   <div id="middlebar" style="padding-left: 5px; width: 475px; height: 16px; border: solid 2px #FFFFCE; background-image: url(http://astahost.com/misc/bbcode/notetitle.jpg); color: #FFFFCE; float: center; font-family: Tahoma; font-size: 12px; font-weight: bold;"><b><center>Notice from {option}:</center></b></div>
 </div>
 <script>
   document.write("<div id=\"notemsg" + noteCount + "\" style=\"width: 475px; padding-top: 10px; padding-bottom: 10px; padding-left: 15px; padding-right: 15px; background-color: #FFFFCE; font-family: Tahoma; font-size: 12px;\">{content}</div>");
 </script>
</div>


Again, it will be necessary for this entire section to be created when the NOTE tags are replaced.

My primary worry at the moment is whether the {content} tag will operate properly inside the document.write function. Right now, I see no problem, but I can't be sure without consulting with someone who is familiar with PHP. However, the working HTML file seems to represent a step in the right direction.

Hope this helps! (And if it doesn't, thanks for forcing me to brush up on my JavaScript!)

Comment/Reply (w/o sign-up)

miCRoSCoPiC^eaRthLinG
Okay.. sorry to say but NONE of the above codes worked. I tried them all out today, tried tweaking around with the ideas too - but couldn't get them to work at all.

Comment/Reply (w/o sign-up)

vizskywalker
QUOTE (microscopic^earthling @ Apr 17 2005, 06:37 AM)
Okay.. sorry to say but NONE of the above codes worked. I tried them all out today, tried tweaking around with the ideas too - but couldn't get them to work at all.
*

That's because they all relied on php. We learned last night that php, unlike what you originally said, doen't work. I'm going to try a new javascript version, but it will take time.

Comment/Reply (w/o sign-up)

miCRoSCoPiC^eaRthLinG
Hey all smile.gif
    FINALLY the problem with collapse/expand of multiple notes is SOLVED. Time to make a minor update to the NOTE BBCode. Earlier on there was a big problem with the design, such that, if you had multiple notes on the same page or post, clicking on one would collapse/expand all others. Mastercomputers fixed the problem at Antilost, with a very subtle and clever trick, bypassing the need for that huge collapse/expand javascript totally. As a result the BBCode stands much shorter and smoother wink.gif

Here's the code update:
CODE

<link rel="stylesheet" type="text/css" href="LINK.TO.YOUR.NOTICE.CSS" />

<div id="notice" class="notice">
    <div id="header" class="header" onClick="java script:this.nextSibling.nextSibling.style.display = (this.nextSibling.nextSibling.style.display == 'block') ? 'none' : 'block';">
        <div id="middlebar" class="middlebar">Notice from {option}:
        </div>
    </div>
    <div id="notemsg" class="messagebody">{content}</div>
</div>


That's the whole of it wink.gif Remember that lengthy JS code.. it's entirely gone

Comment/Reply (w/o sign-up)

Latest Entries

mastercomputers
Notice from mastercomputers:
I have updated my Notice BBCode site


Just would like to point out the site now, which has instructions to get it working under IPB (not tested though), also fixes to work with IE, except I need to work on alpha-transparency, which I may remove since it would require server-side scripting, which won't do for this, so maybe revert back to normal images without transparency, but makes changing the colour easy.

The link is http://mastercomputers.uni.cc/bbcode/notice.html

Cheers,


MC

Comment/Reply (w/o sign-up)

mastercomputers
QUOTE(miCRoSCoPiC^eaRthLinG @ Apr 6 2006, 09:44 PM) *

Cool - am all up for it. I think I'd posted the note files at Anti.. if not, I'll post them - so you can have a go at the CSS.


OK, well, while you were away I created this:

http://mastercomputers.uni.cc/bbcode/notice.html (you may also notice in the parent directory bbcode I'm also working on a book/article type means, it's basically quickly done, with inline styling, but I will seperate everything and make it easier to make changes).

and if you view the source, I have the seperation of CSS/Javascript and the HTML in quite a basic/simple look. I didn't use your background-image (I prefer png instead of jpg too, unless it's a photo) or rounded corners and kept it quite box shape looking.

I'm sure anyone if they wanted to, could jazz this up more, all I ask though is keep it W3C valid, it's what I aim for in all my web work.

Cheers,


MC

Comment/Reply (w/o sign-up)

miCRoSCoPiC^eaRthLinG
Cool - am all up for it. I think I'd posted the note files at Anti.. if not, I'll post them - so you can have a go at the CSS.

Comment/Reply (w/o sign-up)

mastercomputers
Make it look like this and you've solved the 1 click misread, when actually it works as intended if you say it like this:

At present this.nextSibling.nextSibling.style.display = NULL, we never set a style and we can't read user/browser defaults. So (shortening the code) display = (test if display == 'block' it returns NULL) ? if true display = 'none' : Well it was false/NULL or at least != to 'block' so display = 'block';

We've now set a value, display now equals block, so the second click results in true and then display = none; Understandable? I hope so, I didn't want to go too much into this.


CODE

<div class="notice">
    <div class="header" onClick="java script:this.nextSibling.nextSibling.style.display = (this.nextSibling.nextSibling.style.display == 'block') ? 'none' : 'block';">
        <div class="middlebar">Notice from {option}:
        </div>
    </div>
    <div class="messagebody" style="display:block;">{content}</div>
</div>


I have updated here, you can do antilost tongue.gif. I also want to help clean the CSS, though are rounded corners neccessary, looks good but unless W3C supported it's not really things I would go out of.

What I'm proposing to do is clean up the HTML and CSS, eliminate the over use of div blocks if possible and use more semantic like means of displaying it. Also requires renaming the class names, due to reason that they could conflict especially using "header" which is too common.

Cheers,


MC

Comment/Reply (w/o sign-up)

miCRoSCoPiC^eaRthLinG
Yep - I noticed that misclick too - but happens only first time you click the header.

I get what you mean - now there's no reason to have the ID's - since we're using the sibling iterator.

Am off to make the changes smile.gif

Done updating..

The new code, stripped of the div id's looks like this:
CODE

<div class="notice">
    <div class="header" onClick="java script:this.nextSibling.nextSibling.style.display = (this.nextSibling.nextSibling.style.display == 'block') ? 'none' : 'block';">
        <div class="middlebar">Notice from {option}:
        </div>
    </div>
    <div class="messagebody">{content}</div>
</div>


I updated it on Anitlost too.

Comment/Reply (w/o sign-up)


Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

This textarea will convert to Rich-Text automatically (IE, Firefox, Chrome)

Pages: 1, 2
Similar Topics

Keywords : Custom Bbcdes

  1. How To #4: Custom BBCodes For This Board (Pptions) - More than one of them (2)
  2. How To #2: Custom BBCodes For IPB (Marquee) - (4)
    MARQUEE Tag Hi,     I'm back with yet a second tutorial on how I created the MARQUEE tag.
    It's working well - but at first it'll seem that the tag has caused your browser to freeze.
    I guess depending on the different ways that IE and Mozilla Compliant Browsers parse HTML tags - the
    outputs are a little different. While using FireFox, the Marquee wouldn't start scrolling till
    all the page elements & the page itself has FULLY LOADED . Till then, it might seem that the
    browser's on the verge of freezing. On the other hand, in IE the Marquee start...
  3. How To #1: Custom BBCodes For IPB (Console) - (2)
    Custom BBCodes for Forums -------------------------- Hi all,     I came up with this article to
    share what I learnt of designing Custom BBCodes for various forum softwares while trying to come up
    with some useful one's for AstaHost. Most of you are by now familiar with the new ones like
    CONSOLE, NOTE, TABL etc. which I introduced a few days back. So how do these BBCodes work ? And how
    does the forum softwares parse them.     BBCodes, as you know, usually takes a Text Stuff
    format. The "Text Stuff" in the textual content on which you want your bbcode to wor...



Looking for howto, 3, custom, bbcodes, board, note

See Also,

*SIMILAR VIDEOS*
Searching Video's for howto, 3, custom, bbcodes, board, note
advertisement



How To #3: Custom BBCdes For This Board (Note)

Affordable Web Hosting, Low cost Web Hosting - ComputingHost.com