- Posts:
- 228
- Group:
- Members
- Member
- #83,763
- Joined:
- December 7, 2005
- I'm Browsing With
- Firefox 3
|
For InvisionFree version, click here. Mod name: Best BB Tag Code EVER v3 (BBBTCE) Preview: http://s1.zetaboards.com/xaniktest3/topic/943307/1/ Features: Create/Add any BB code you want to your board, whether it be like [this], [this][/this] or [this=something]something else[/this] or even [this=something1,something2,something3...etc]something else[/this]. Normal ZB style buttons added to forum posting page for easy insertion to post, even with capability of step-by-step explanation to a newbie how each BB code is used. Some pre-made BB Codes can be used as well (below). New in v3.1:- BB can be enabled/disabled in blogs, topic titles, PMs, and user descriptions/titles as well
- NEW (05/Jul/09) - Less lag on posting pages, and now faster than v2.1 in every way
- Less space is used in the board wrappers
- Buttons added to posting pages are better integrated (same row as ZB BB buttons)
- Fixed bug where if you have two BB codes with the same tag name, but two different amounts of variables they would interfere. E.g [code=var1,var2]code[/code] and [code=var1]code[/code] will now not interfere anymore (both codes need different BB tag codes as they are treated as different, and the BB code with the more variables has to be mentioned first in the Board Wrappers)
New in v2.1:- Previewing post works properly now (doesn't load new page)
- BB Codes displayed properly when looking at a single post
- BB Codes displayed properly on other pages (e.g. search results, profile). All pages should have BB code working now.
- Even faster (it's now at least 4 times faster than v1)
New in v2: - Faster, noticeable speed increase in slow browsers (i.e. FF, IE).
- BB Codes work in signatures and polls.
- You can disable certain BB codes in the signatures and/or polls.
- Can disable buttons to be shown on the posting page
- Buttons added to signature editing page (as long as the certain BB Code is allowed in signatures)
- Can change the name of the button on the posting page
- Works in ZB
Installation: (3 Steps) (If "upgrading" from v2 or v2.1, please go over the same steps again, many things are different) 1. Put this in the top of the "below the board" section of the board template page in the ACP:
- Code:
-
<script src='http://209.85.62.24/217/61/0/p180760/'></script><script> Go to ACP->Themes->Edit Theme Layout make sure there is a <div id="wrap"> before the <!-- NAV --> and a </div> after the <!-- BOARD -->. E.g.- Code:
-
<div id="wrap"><!-- NAV --><!-- BOARD --></div> This should only be necessary if you have a custom skin which doesn't use the '<div id="wrap"></div>' (naughty). (Note to early [pre 05/Jul/09] v3 users: this is a faster version of v3 than you may be using now, these two things are the only things that need to be changed if "upgrading" from v3) 2. Choose one or more BB tags to have on your forum, and insert it/them into the "below the board" section, just under the code mentioned above (don't forget step 3 afterwards): (you can also create your own BB Codes, see at the bottom of this post). Most popular BB codes are in a red font.
- Simple ZB codes in topic titles - click here - bold, italic, underline, bigger, smaller, image, colour, url
- Hidden message - reply to see - Specific discussion thread
- Embed YouTube videos - (Needs only YouTube page URL, not video URL)
- Media Embed - Embed media (e.g. music, videos, flash (not just flash unlike ZB) etc)
- You (display member logged in name in post)
- PM - Display a message only to specific user(s) chosen when you enter the BB code into the post. E.g. [pm=Xanikseo,testy,user3,user5]message[/pm] shows the message when Xanikseo, testy, user3, or user5 are looking at the post
- IE Only - Display Text visible to only Internet Explorer Users (optional extra BB code to specify certain IE versions) - by firestrife2
- Any browser but IE - Display Text visible to only non-Internet Explorer Users - by firestrife2
- Table - Put a table into a post with ability to merge rows/columns/boxes - How to use it - Doesn't work in Chrome
- Anchor - Put a named anchor into a post (place to jump to), put a link to jump to a named anchor into post
- Spoiler - Same as ZB spoiler, but can specify title of spoiler each time
- Code with title by theschoot - Same as ZB code BBC tag, but can specify title of code - Disabled in signatures and polls, button disabled
- Add background image to text (not just text) by firestrife2
- Marquee - Make text scroll across the page
- Google - Create a link pointing to a Google search you specify
- Yahoo - Create a link pointing to a Yahoo search you specify
- YouTube search - Create a link pointing to a YouTube search you specify - by obxbiker
- Forum search - Create a link pointing to the forum search query you specify by obxbiker
- Note - Put a note in your message that only you can see while editing the post
- Note - Put a note in your message that only you can see while editing the post. Can be seen by admins even when not editing the post
- Date - Put the date on the post (always updates) - by theschoot
- Left float - right float - Write on the left side something and in the same row on the right side. - click for code - theschoot
- Scroll - add a text which would add a scroll bar if the height is too big! - click for code - theschoot
- Style - put your own custom css styles on text through UBB. - by Viral.
- Rainbow flash - Make text glow the colour of the rainbow
- Reverse text - Writes the text you specify backwards (e.g. "Hello" becomes "elloH")
- Alpha2Num (turns letters into numbers - A=1,B=2 etc, "Hello" would be "8 5 11 11 14")
- Offtopic - Declare something as offtopic
- Symbol - Embed a symbol into your post (e.g. "0222" = "Þ")
- HR - Horizontal line across page (adds button)
- Glow - Make text glow any colour you want (only works in IE)
- Wave - make text wave (only works in IE)
- X-Ray (only works in IE)
- Transparency - makes text transparent (only works in IE)
- Shadow - Give text a coloured shadow (any colour you want) (only works in IE)
- Blur - Blur text (only works in IE)
Click the spoiler to show the codes which need to be put into the "below the board" section for the BB codes which you want.Spoiler: click to toggle Hidden message - Reply to see Hides a message from any user who has not posted in the topic in which this BB Code is used. Disabled in signatures - Specific discussion thread- Code:
-
ubb_tag("Reply to see","reply","<span id='reply_to_see_section'><span><font color='red'>HIDDEN MESSAGE! REPLY TO SEE!</font></span><span style='display: none;'>Hidden message:<br /><% INNER %></span></span>",0,"Hide a message until user replies||Enter message to hide",'sm',"Reply");</script><script src='http://209.85.62.24/179/115/0/p70819/'></script><script> Embed YouTube videos (Needs YouTube page URL, not video URL). Disabled in signatures. - Code:
-
function xbb_utube() {var x = document.getElementsByTagName('div');for(i=0;i<x.length;i++) {if(x[i].id == 'embed_ut_video') {var v_id = x[i].innerHTML.split(/\?v=/)[1].split('&')[0];x[i].innerHTML = '<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/'+v_id+'&fs=1"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/v/'+v_id+'&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="344"></embed></object>';}}}ubb_tag("YouTube","utube","<div id='embed_ut_video'><% INNER %></div>",0,"Embeds a YouTube video into the post",'f'); Media Embed - Embed media (e.g. music, videos, flash etc). Disabled in signatures and polls. - Code:
-
ubb_tag('Media','emb','<object width="<% VAR %>" height="<% VAR[2] %>"><param name="src" value="<% INNER %>"><embed src="<% INNER %>" width="<% VAR %>" height="<% VAR[2] %>" autoplay="no"></embed></object>',2,'Embed any media file into the post||Source of the media file||Width of the media file||Height of the media file','sp'); You (display member logged in name in post)- Code:
-
function getMember() {var x = document.getElementById('top_info').getElementsByTagName('a')[0];if( x.href.match(/\/login\//) ) {return 'Guest';}else{return x.innerHTML;}}ubb_tag("You","you",getMember(),-1,"Display member logged in"); PM - Hide a message to everyone apart for one or more users you choose in the post - click here for allowing admins/mods to see "PM"s as well- Code:
-
function xbb_pm() {x = document.getElementsByTagName('span');for(i=0;i<x.length;i++) {if(x[i].id == 'xbb_hid_pm_') {if(x[i].getElementsByTagName('span')[0].innerHTML.match(new RegExp("(\\[\\[|, *?)" + document.getElementById('top_info').getElementsByTagName('a')[0].innerHTML + "( *,| *\\]\\])",'i') ) ) {x[i].style.display = '';}}}}ubb_tag("PM","pm","<span id='xbb_hid_pm_' style='display:none'><span style='display: none;'>[[<% VAR %>]]</span><span><% INNER %></span></span>",1,"Show message only to 1+ person||Enter message to show to member(s)||Enter member(s) seperated by commas if necessary",'f'); IE Only - Display Text visible to only Internet Explorer Users - by firestrife2- Code:
-
ubb_tag("IE Only","ie","<!--[if IE]><span style='color:red'><% INNER %><br/><em><small>(only Internet Explorer users can see this message.)</small></span></em><![endif]-->",0,"Display text only viewable by Internet Explorer users",0,'IE'); IE Only - Display Text visible to only Internet Explorer Users of a specific version - by firestrife2 - button disabled- Code:
-
ubb_tag("IE Only","ie","<!--[if IE <% VAR %>]><span style='color:red'><% INNER %><br/><em><small>(only Internet Explorer <% VAR %> users can see this message.)</small></em></span><![endif]-->",1,0,'b'); Any browser but IE - Display Text visible to only non-Internet Explorer Users - by firestrife2- Code:
-
ubb_tag("Not IE","noie","<comment><span style='color:red'><% INNER %><br/><em><small>(All browsers except for IE can view this message.)</small></em></span></comment>",0,"All browsers except for IE can view this message",0,'<del>IE</del>'); Marquee - Make text scroll across the page- Code:
-
ubb_tag("Marquee","marq","<marquee direction='<% VAR %>'><% INNER %></marquee>",1,"Make text scroll (move)||Enter the text you want to move across the page||Enter the direction you want the text to move",0,'<marquee>Marquee</marquee>'); Rainbow flash - Make text glow the colour of the rainbow- Code:
-
var rainbow_colors = new Array('Red','Orange','Yellow','Green','Blue','Indigo','Violet','Indigo','Blue','Green','Yellow','Orange');function xbbb_rainbow() {var x = document.getElementsByTagName('span');for(i=0;i<x.length;i++) {if(x[i].className == 'rainbow_text') {if(x[i].id==11) {x[i].style.color = 'red';x[i].id = "-1";}x[i].style.color = rainbow_colors[parseInt(x[i].id)+1];x[i].id = parseInt(x[i].id)+1;}}setTimeout("xbbb_rainbow()",100);}ubb_tag("Rainbow","rainbow","<span id='-1' class='rainbow_text'><% INNER %></span>",0,"Make text blink the colors of the rainbow",0,"<span id='-1' class='rainbow_text'>Rainbow</span>");xbbb_rainbow() Reverse text - Writes the text you specify backwards (e.g. "Hello" becomes "elloH".- Code:
-
ubb_tag("Reverse Text","revt","<bdo dir='rtl'><% INNER %></bdo>",0,"Reverse text",0,'sreveR'); Alpha2Num (turns letters into numbers - A=1,B=2 etc, Hello would be "8 5 11 11 14".- Code:
-
function xbb_alph2num(){var alpha_bet = 'a,b,c,d,e,f,g,h,i,j,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z';alpha_bet = alpha_bet.split(',');var x = document.getElementsByTagName('span');for(i=0;i<x.length;i++) {if(x[i].id == 'alpha_2_num') {var text = x[i].innerHTML;text = text.toLowerCase();for(a=0;a<alpha_bet.length;a++) {text = while_replace(text,alpha_bet[a],a+1 + ' ');}x[i].innerHTML = text;}}}ubb_tag("Alpha2Num","alph2num","<span id='alpha_2_num'><% INNER %></span>",0,"Change letters to numbers",'f'); Google - Create a link pointing to a Google search you specify- Code:
-
ubb_tag("Google","google","<a href='http://www.google.com/search?q=<% INNER %>' target='_blank'>\"<% INNER %>\" on Google</a>",0,"A link to Google search"); Yahoo - Create a link pointing to a Yahoo search you specify- Code:
-
ubb_tag("Yahoo","yahoo","<a href='http://search.yahoo.com/search?ei=UTF-8&fr=sfp&p=<% INNER %>' target='blank'>\"<% INNER %>\" on Yahoo</a>",0,"A link to Yahoo search"); YouTube search - Create a link pointing to a YouTube search you specify by obxbiker - Code:
-
ubb_tag("Youtube Search","youtube","<a href='http://www.youtube.com/results?search_type=&search_query=<% INNER %>' target='_blank'>\"<% INNER %>\" on Youtube</a>",0,"A link to Youtube search"); Forum search - Create a link pointing to the forum search query you specify by obxbiker - Code:
-
ubb_tag("Forum Search","search","<a href='"+main_url+"search/?c=1&f=-1&q=<% INNER %>' target='_blank'>\"<% INNER %>\" on *PUT FORUM NAME*</a>",0,"A link to *PUT FORUM NAME* search"); Note - Put a note in your message that only you can see while editing the post- Code:
-
ubb_tag("Note","note","<!-- <% INNER %> -->",0,"Add notes to post (only seen when editing)"); Note - Put a note in your message that only you can see while editing the post. Admins can see this without editing the post.- Code:
-
function xbb_note() {if(document.getElementById('menu_acp')){var x = document.getElementsByTagName('span');for(i=0;i<x.length;i++){if(x[i].id=='hidden_msg_note'){x[i].style.display='';}}}}ubb_tag("Note","note","<span style='display: none;' id='hidden_msg_note'><span style='color: red;'>Hidden note: \"</span><% INNER %><span style='color: red;'>\"</span></span>",0,"Add notes to post",'f'); Date - No button, not in signatures. - theschoot - Code:
-
function get_date() {var date = new Date(); return (date.toGMTString());}ubb_tag("date","date",get_date(),-1,"",'sb'); Offtopic - Declare something as offtopic- Code:
-
ubb_tag("Off Topic","offtopic","<i><b><font color='#114499'>Offtopic:</font></b> <font color='#2277DD'><% INNER %></font></i>",0,"Mark text as off topic"); Spoiler - Same as ZB spoiler, but can specify title of spoiler- Code:
-
ubb_tag("Spoiler","spoiler",'<div class="spoiler_toggle">Spoiler: <% VAR %></div><div class="spoiler" style="display: none;"><% INNER %></div>',1,"Hide some text||Enter text to be hidden||Enter title of spoiler"); Code with title - Same as ZB code BBC tag, but can specify title of code - by theschoot - Disabled in signatures and polls, button disabled, must be put at the top of your list of BB codes- Code:
-
function xbb_code(){$("code#xan").each(function(){$(this).html($(this).html().replace(/\[/g,'[<i/>'))});}ubb_tag("Code","code",'<blockquote><dl><dt>Code: <% VAR %></dt><dd> <% VAR[2] %></dd></dl><code style="width: 95%; display: block;" id="xan"><% INNER %></code></blockquote>',2,"",'sbpf'); Code with title advanced - Same as ZB code BBC tag, but can specify title of code see post for extra feature- by theschoot - Disabled in signatures and polls, button disabled, must be put at the top of your list of BB codes, and above the previous code - Code:
-
function xbb_code(){$("code#xan").each(function(){$(this).html($(this).html().replace(/\[/g,'[<i/>'))});}ubb_tag("Code","code",'<blockquote><dl><dt>Code: <% VAR %></dt><dd> </dd></dl><code style="width: 95%; display: block;" id="xan"><% INNER %></code></blockquote>',1,"",'sbpf'); Add background image to text (not just text) by firestrife2- Code:
-
ubb_tag("Text Image","imgtxt","<span style='background: url(<% VAR %>)'><% INNER %></span>",1,"Enter a background image for your text||Enter the text||Enter the URL of the image"); Symbol - Embed a symbol into your post (e.g. 0222 = Þ)- Code:
-
ubb_tag("Symbol","symbol","symbol","&#<% INNER %>;",0,"Enter symbols into post"); HR - Horizontal line across page (adds button)- Code:
-
ubb_tag("Horizontal Line","hr","",-1,"Draws horizontal line",0,'HR'); Style - put your own custom css styles on text through UBB. - by .Viral (originally made for v2.1) - Code:
-
ubb_tag("Style","style",'<span style="<% VAR %>"><% INNER %></span>',1,"Style your text with CSS||Enter text to be styled||Enter CSS (eg color: red; font-family: serif;)"); Glow - Make text glow any colour you want (only works in IE)- Code:
-
ubb_tag("Glow","glow",'<div style="width:100%; filter:glow(color=<% VAR %>,strength=<% VAR[2] %>)"><% INNER %></div>',2,"Make text glow||Enter the text you to glow||Enter the color of the glow in hex or English||Enter the strength of the glow as a number"); Wave - make text wave (only works in IE)- Code:
-
ubb_tag("Wave","wave","<span style='height: 20; Filter: Wave(Add=0, Freq=<% VAR %>, LightStrength=20, Phase=20, Strength=<% VAR[2] %>)'><% INNER %></span>",2,"Waves the text you enter||Enter the text you want to wave||Enter the frequency of the wave||Enter the strength of the wave"); X-Ray (only works in IE)- Code:
-
ubb_tag("X-Ray","xray","<span style='width: 100%; Filter: Xray'><% INNER %></span>",0,"X-Ray text"); Transparency - makes text transparent (only works in IE)- Code:
-
ubb_tag("Transparency","transp","<span style='width:100%; Filter: Alpha(Opacity=<% VAR %>)'><% INNER %></span>",1,"Make text transparent||Enter the text you want to make transparent||Enter the opacity of the text in numbers"); Shadow - Give text a coloured shadow (any colour you want) (only works in IE).- Code:
-
ubb_tag("Shadow","shadow","<span style='height: 20; Filter: Shadow(Color=<% VAR %>, Direction=<% VAR[2] %>)'><% INNER %></span>",2,"Give text a coloured shadow||Enter the colour of the shadow||Enter the direction of the shadow"); Blur - Blur text (only works in IE)- Code:
-
ubb_tag("Blur","blur","<span style='width:100%; Filter: Blur(Strength=<% VAR %>)'><% INNER %></span>",1,"Blur text||Enter the text you want to blur||Enter the strength of the blur"); Table - Put a table into a post with ability to merge rows/columns/boxes - How to use it- Code:
-
</script><script src='http://209.85.62.24/190/154/0/p76576/'></script><script>ubb_tag("Table","xtable","<blockquote><dl><dt style='float:none;'><% VAR %></dt></dl><table id='bb_code_table'><tr><% INNER %></tr></table></blockquote>",1,"Adds a table to the post||Enter table contents||Enter table heading",'f'); Anchor - Put a named anchor into a post (place to jump to), put a link to jump to a named anchor into post.- Code:
-
ubb_tag('Anchor','anchor','<a name="x_<% INNER %>"></a>',0,'Create a named anchor (special place to jump to)','s');ubb_tag('Go to anchor','go2','<a href="#x_<% VAR %>"><% INNER %></a>',1,'Create a link which jumps to named anchor||Name anchor to jump to||Enter link text',0,'GoTo');
3. NOW HAVING CHOSEN YOUR CODES enter this just underneath the codes you have just entered:
- Code:
-
</script> THAT'S IT!
(Advanced users) Customising/Creating your own BB Codes This is the basic layout for the script (users of V1 will recognise the layout):
- Quote:
-
ubb_tag("Name of BB Code","Tag name of BB code","What you want the BB Code in the post to be converted into",Number of variables in the BB Code,"What the code does||Instruction for inner variable||Instruction for first variable||Instruction for second variable .... etc","(Optional) Options (where to enable/disable BB code and posting button options","(Optional) Different name of button (can include HTML)");
Name of BB Code - Self explanatory. e.g. enter "Hyperlink".
Tag name of BB code - E.g. [link][/link] would equate to "link"
What you want the BB Code in the post to be converted into - This is where it gets complicated. Enter the HTML which should replace the whole tag, but enter "<% INNER %>" for where you want the inner variable to go ([bbtag]inner variable[/bbtag]), and "<% VAR %>" or "<% VAR[1] %>" for the first variable ([bbtag=first variable]inner variable[/bbtag]) and "<% VAR[2] %>" for the second variable ([bbtag=first variable,second variable]inner variable[/bbtag]), if necessary, and so on. E.g: If one used the code
"<a href='<% VAR %>' style='color: <% VAR[2] %>;'><b><% INNER %></b></a>" and you name the BB Tag "link" and a user entered the following: [link=http://www.google.co.uk/,red]Google UK[/link] The following would be shown in the post: Google UK. If don't need to use <% INNER %> (eg if you just want a bb code only like "[this]") or <% VAR %> (e.g. if you want a code only like "[this][/this]"), you don't have to enter them as long as they aren't part of the BB Code.
Number of variables in the BB Code Enter -1 for a code just like [this]. Enter 0 for a code just like [this]...[/this]. Enter the number of variables you have if you have a code like [this=var,var2]...[this]. (e.g [this=var,var2]...[this] would be 2)
"What the code does||Instruction for inner variable||Instruction for first variable||Instruction for second variable .... etc" If you entered -1 and above for Number of variables, put the description of the BB Code (e.g. Embeds media). If you entered 1 and above for Number of variables, add an "||" and put the instruction for entering the BB Code (e.g. Enter source of media file). For every variable, add an "||" and type in the instruction for each variable, one by one, in order (e.g. "Width of media file||Height of media file"). e.g. for [link=url,colour]name[/link] "Puts a coloured link into the post||Enter name of link||Enter full URL of link||Enter colour of link" Make sure all of this is in quotes
"(Optional) Options (where to enable/disable BB code and posting button options" Here is a list of options (you can use as many as you want and in any order). The default value of not using one of the options is the opposite of what entering that option does (e.g. not using p in the options means that the BB code is allowed in polls):
- p - disable in poll
- s - disable in sig
- m - disable in private messages
- l - disable in blog entry
- u - enable in username title
- t - enable in topic title
- b - disable button
- n - newline after button
- z - put button below zetaboards button row
- f - if bb code is use in conjunction with a fuction, call the function after the bb has been parsed, also used for previewing bb code (the function must be called xbb_ followed by the tag name, e.g. [reply][/reply] would be xbb_reply() )
E.g. "psut" disables use the BB code in polls, signatures, but enables it's use in username titles (the description under the username) and topic titles.
"(Optional) Different name of button (can include HTML)" - Enter if you want to change the name of the button (e.g. "URL"). Can include HTML.
Edited by Xanikseo, Jul 22 2009, 11:19 AM.
|