FAQ Search Memberlist Usergroups Profile Log in to check your private messages Join! (free) Log in
Current Time
Log in
   Username:
   Password:
   Log me on automatically each visit
  
Welcome
Guest
Links Menu
Home
Endiah - MYFF
Endiah - IF
Man United
Anything Forums
Support Forum
Techland
The Fun Forum
Chill Pill
Game Lounge
Dagun
LUA Links
Ultimate Forum
Football is the word Forum
Top posters
comkidwizzer3 156
linh6496 42
sinky911 30
ammi2501 20
Warren 20
Andrew(AP) 18
Naruto 15
sam 7
shellbell1471 5
Nivizoit 3
Recently online
Forum Articles
No Limits - Where Almost Anything Goes
No Limits - Where Almost Anything Goes
Say hello and goodbyes
All In One Forums - Where everything is under one roof!
Hello
Funtastic Forum
Chill Lounge
Yahoo!
Yahoo! Linh
Runescape?
News

Please don't post in other peoples private chat forums as they may want privacy. You may only go in there if you are an administrator. We have 14 users and 228 articles.

Our Top poster is Comkidwizzer3.

We now have up to 1250 points.


Start | Stop

BBCode Box

 
Post new topic   Reply to topic    Center of Me and you Forum Index -> Howtodoit Help
View previous topic :: View next topic  
Author Message
comkidwizzer3

Level: 1
XP: 0/50
Coins: 500

Joined: 03 Jun 2007
Points: 1560
Posts: 156
Name: Michael
Birthday: 2 March 1997
Warnings: 0
Admin Rank: Web & Design
Elite Member: Yes
Country: Australia



PostPosted: Thu Jul 05, 2007 7:19 pm    Post subject: BBCode Box Reply with quote

Please remember to use the Editor account before making any template changes, If you have not made an editor account yet please read HERE

Secondly you must have all ready made a template you can edit.

If you have not done this please read HOWTODOIT

PLEASE read this post before you do any editing for this code.

http://howtodoit.myfreeforum.org/...component=content&topicid=673


Ok all that done now goto

admin panel -- 3. Styles -- Edit Templates/Logos

Now open up your template using the drop box marked Choose Template to Edit for example myff_howtodoit1 and using the top drop box called Choose Forum template/javascript/css File to Edit find

posting_body.tpl

Now you need to find a block of code that will look something like this

Spoiler:

Code:
<script language="JavaScript" type="text/javascript">
<!--
// bbCode control by
// subBlue design
// www.subBlue.com

// Startup variables
var imageTag = false;
var theSelection = false;

// Check for Browser & Platform for PC & IE specific bits
// More details from: http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html
var clientPC = navigator.userAgent.toLowerCase(); // Get client info
var clientVer = parseInt(navigator.appVersion); // Get browser version

var is_ie = ((clientPC.indexOf("msie") != -1) && (clientPC.indexOf("opera") == -1));
var is_nav = ((clientPC.indexOf('mozilla')!=-1) && (clientPC.indexOf('spoofer')==-1)
                && (clientPC.indexOf('compatible') == -1) && (clientPC.indexOf('opera')==-1)
                && (clientPC.indexOf('webtv')==-1) && (clientPC.indexOf('hotjava')==-1));
var is_moz = 0;

var is_win = ((clientPC.indexOf("win")!=-1) || (clientPC.indexOf("16bit") != -1));
var is_mac = (clientPC.indexOf("mac")!=-1);

// Helpline messages
b_help = "{L_BBCODE_B_HELP}";
i_help = "{L_BBCODE_I_HELP}";
u_help = "{L_BBCODE_U_HELP}";
q_help = "{L_BBCODE_Q_HELP}";
c_help = "{L_BBCODE_C_HELP}";
l_help = "{L_BBCODE_L_HELP}";
o_help = "{L_BBCODE_O_HELP}";
p_help = "{L_BBCODE_P_HELP}";
w_help = "{L_BBCODE_W_HELP}";
a_help = "{L_BBCODE_A_HELP}";
s_help = "{L_BBCODE_S_HELP}";
f_help = "{L_BBCODE_F_HELP}";

// Define the bbCode tags
bbcode = new Array();
bbtags = new Array('[b]','[/b]','[i]','[/i]','[u]','[/u]','[quote]','[/quote]','[code]','[/code]','[list]','[/list]','[list=]','[/list]','[img]','[/img]','[url]','[/url]');
imageTag = false;

// Shows the help messages in the helpline window
function helpline(help) {
   document.post.helpbox.value = eval(help + "_help");
}


// Replacement for arrayname.length property
function getarraysize(thearray) {
   for (i = 0; i < thearray.length; i++) {
      if ((thearray[i] == "undefined") || (thearray[i] == "") || (thearray[i] == null))
         return i;
      }
   return thearray.length;
}

// Replacement for arrayname.push(value) not implemented in IE until version 5.5
// Appends element to the array
function arraypush(thearray,value) {
   thearray[ getarraysize(thearray) ] = value;
}

// Replacement for arrayname.pop() not implemented in IE until version 5.5
// Removes and returns the last element of an array
function arraypop(thearray) {
   thearraysize = getarraysize(thearray);
   retval = thearray[thearraysize - 1];
   delete thearray[thearraysize - 1];
   return retval;
}


function checkForm() {

   formErrors = false;   

   if (document.post.message.value.length < 2) {
      formErrors = "{L_EMPTY_MESSAGE}";
   }

   if (formErrors) {
      alert(formErrors);
      return false;
   } else {
      bbstyle(-1);
      //formObj.preview.disabled = true;
      //formObj.submit.disabled = true;
      return true;
   }
}

function emoticon(text) {
   var txtarea = document.post.message;
   text = ' ' + text + ' ';
   if (txtarea.createTextRange && txtarea.caretPos) {
      var caretPos = txtarea.caretPos;
      caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? caretPos.text + text + ' ' : caretPos.text + text;
      txtarea.focus();
   } else {
      txtarea.value  += text;
      txtarea.focus();
   }
}

function bbfontstyle(bbopen, bbclose) {
   var txtarea = document.post.message;

   if ((clientVer >= 4) && is_ie && is_win) {
      theSelection = document.selection.createRange().text;
      if (!theSelection) {
         txtarea.value += bbopen + bbclose;
         txtarea.focus();
         return;
      }
      document.selection.createRange().text = bbopen + theSelection + bbclose;
      txtarea.focus();
      return;
   }
   else if (txtarea.selectionEnd && (txtarea.selectionEnd - txtarea.selectionStart > 0))
   {
      mozWrap(txtarea, bbopen, bbclose);
      return;
   }
   else
   {
      txtarea.value += bbopen + bbclose;
      txtarea.focus();
   }
   storeCaret(txtarea);
}


function bbstyle(bbnumber) {
   var txtarea = document.post.message;

   txtarea.focus();
   donotinsert = false;
   theSelection = false;
   bblast = 0;

   if (bbnumber == -1) { // Close all open tags & default button names
      while (bbcode[0]) {
         butnumber = arraypop(bbcode) - 1;
         txtarea.value += bbtags[butnumber + 1];
         buttext = eval('document.post.addbbcode' + butnumber + '.value');
         eval('document.post.addbbcode' + butnumber + '.value ="' + buttext.substr(0,(buttext.length - 1)) + '"');
      }
      imageTag = false; // All tags are closed including image tags :D
      txtarea.focus();
      return;
   }

   if ((clientVer >= 4) && is_ie && is_win)
   {
      theSelection = document.selection.createRange().text; // Get text selection
      if (theSelection) {
         // Add tags around selection
         document.selection.createRange().text = bbtags[bbnumber] + theSelection + bbtags[bbnumber+1];
         txtarea.focus();
         theSelection = '';
         return;
      }
   }
   else if (txtarea.selectionEnd && (txtarea.selectionEnd - txtarea.selectionStart > 0))
   {
      mozWrap(txtarea, bbtags[bbnumber], bbtags[bbnumber+1]);
      return;
   }
   
   // Find last occurance of an open tag the same as the one just clicked
   for (i = 0; i < bbcode.length; i++) {
      if (bbcode[i] == bbnumber+1) {
         bblast = i;
         donotinsert = true;
      }
   }

   if (donotinsert) {      // Close all open tags up to the one just clicked & default button names
      while (bbcode[bblast]) {
            butnumber = arraypop(bbcode) - 1;
            txtarea.value += bbtags[butnumber + 1];
            buttext = eval('document.post.addbbcode' + butnumber + '.value');
            eval('document.post.addbbcode' + butnumber + '.value ="' + buttext.substr(0,(buttext.length - 1)) + '"');
            imageTag = false;
         }
         txtarea.focus();
         return;
   } else { // Open tags
   
      if (imageTag && (bbnumber != 14)) {      // Close image tag before adding another
         txtarea.value += bbtags[15];
         lastValue = arraypop(bbcode) - 1;   // Remove the close image tag from the list
         document.post.addbbcode14.value = "Img";   // Return button back to normal state
         imageTag = false;
      }
     
      // Open tag
      txtarea.value += bbtags[bbnumber];
      if ((bbnumber == 14) && (imageTag == false)) imageTag = 1; // Check to stop additional tags after an unclosed image tag
      arraypush(bbcode,bbnumber+1);
      eval('document.post.addbbcode'+bbnumber+'.value += "*"');
      txtarea.focus();
      return;
   }
   storeCaret(txtarea);
}

// From http://www.massless.org/mozedit/
function mozWrap(txtarea, open, close)
{
   var selLength = txtarea.textLength;
   var selStart = txtarea.selectionStart;
   var selEnd = txtarea.selectionEnd;
   if (selEnd == 1 || selEnd == 2)
      selEnd = selLength;

   var s1 = (txtarea.value).substring(0,selStart);
   var s2 = (txtarea.value).substring(selStart, selEnd)
   var s3 = (txtarea.value).substring(selEnd, selLength);
   txtarea.value = s1 + open + s2 + close + s3;
   return;
}

// Insert at Claret position. Code from
// http://www.faqts.com/knowledge_base/view.phtml/aid/1052/fid/130
function storeCaret(textEl) {
   if (textEl.createTextRange) textEl.caretPos = document.selection.createRange().duplicate();
}

//-->
</script>



Now you need to replace all of that block of code with the following code

Code:
<script language="javascript" type="text/javascript" src="templates/posting.js"></script>



Remember to ONLY remove the block of code not the whole of your posting body.tpl


Now you need to find something that looks like this

Code:
javascript:emoticon('{smilies_row.smilies_col.SMILEY_CODE}')


And replace it with

Code:
javascript:wemoticon('{smilies_row.smilies_col.SMILEY_CODE}','{smilies_row.smilies_col.SMILEY_IMG}')


So it may look like this

Before

Code:
<!-- BEGIN smilies_col -->
              <td><a href="javascript:emoticon('{smilies_row.smilies_col.SMILEY_CODE}')">


After

Code:
<td><a href="javascript:wemoticon('{smilies_row.smilies_col.SMILEY_CODE}','{smilies_row.smilies_col.SMILEY_IMG}') ">


Now you need to find this huge block of code that looks like this Or similar.


Spoiler:

Code:
</td>
     <td class="row2" valign="top"><span class="gen"> <span class="genmed"> </span>
      <table width="450" border="0" cellspacing="0" cellpadding="2">
        <tr align="center" valign="middle">
         <td><span class="genmed">
           <input type="button" class="button" accesskey="b" name="addbbcode0" value=" B " style="font-weight:bold; width: 30px" onClick="bbstyle(0)" onMouseOver="helpline('b')" />
           </span></td>
         <td><span class="genmed">
           <input type="button" class="button" accesskey="i" name="addbbcode2" value=" i " style="font-style:italic; width: 30px" onClick="bbstyle(2)" onMouseOver="helpline('i')" />
           </span></td>
         <td><span class="genmed">
           <input type="button" class="button" accesskey="u" name="addbbcode4" value=" u " style="text-decoration: underline; width: 30px" onClick="bbstyle(4)" onMouseOver="helpline('u')" />
           </span></td>
         <td><span class="genmed">
           <input type="button" class="button" accesskey="q" name="addbbcode6" value="Quote" style="width: 50px" onClick="bbstyle(6)" onMouseOver="helpline('q')" />
           </span></td>
         <td><span class="genmed">
           <input type="button" class="button" accesskey="c" name="addbbcode8" value="Code" style="width: 40px" onClick="bbstyle(8)" onMouseOver="helpline('c')" />
           </span></td>
         <td><span class="genmed">
           <input type="button" class="button" accesskey="l" name="addbbcode10" value="List" style="width: 40px" onClick="bbstyle(10)" onMouseOver="helpline('l')" />
           </span></td>
         <td><span class="genmed">
           <input type="button" class="button" accesskey="o" name="addbbcode12" value="List=" style="width: 40px" onClick="bbstyle(12)" onMouseOver="helpline('o')" />
           </span></td>
         <td><span class="genmed">
           <input type="button" class="button" accesskey="p" name="addbbcode14" value="Img" style="width: 40px"  onClick="bbstyle(14)" onMouseOver="helpline('p')" />
           </span></td>
         <td><span class="genmed">
           <input type="button" class="button" accesskey="w" name="addbbcode16" value="URL" style="text-decoration: underline; width: 40px" onClick="bbstyle(16)" onMouseOver="helpline('w')" />
           </span></td>
        </tr>
        <tr>
         <td colspan="9">
           <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td><span class="genmed"> &nbsp;{L_FONT_COLOR}:
               <select name="addbbcode18" onChange="bbfontstyle('[color=' + this.form.addbbcode18.options[this.form.addbbcode18.selectedIndex].value + ']', '[/color]');this.selectedIndex=0;" onMouseOver="helpline('s')">
                 <option style="color:black; background-color: {T_TD_COLOR1}" value="{T_FONTCOLOR1}" class="genmed">{L_COLOR_DEFAULT}</option>
                 <option style="color:darkred; background-color: {T_TD_COLOR1}" value="darkred" class="genmed">{L_COLOR_DARK_RED}</option>
                 <option style="color:red; background-color: {T_TD_COLOR1}" value="red" class="genmed">{L_COLOR_RED}</option>
                 <option style="color:orange; background-color: {T_TD_COLOR1}" value="orange" class="genmed">{L_COLOR_ORANGE}</option>
                 <option style="color:brown; background-color: {T_TD_COLOR1}" value="brown" class="genmed">{L_COLOR_BROWN}</option>
                 <option style="color:yellow; background-color: {T_TD_COLOR1}" value="yellow" class="genmed">{L_COLOR_YELLOW}</option>
                 <option style="color:green; background-color: {T_TD_COLOR1}" value="green" class="genmed">{L_COLOR_GREEN}</option>
                 <option style="color:olive; background-color: {T_TD_COLOR1}" value="olive" class="genmed">{L_COLOR_OLIVE}</option>
                 <option style="color:cyan; background-color: {T_TD_COLOR1}" value="cyan" class="genmed">{L_COLOR_CYAN}</option>
                 <option style="color:blue; background-color: {T_TD_COLOR1}" value="blue" class="genmed">{L_COLOR_BLUE}</option>
                 <option style="color:darkblue; background-color: {T_TD_COLOR1}" value="darkblue" class="genmed">{L_COLOR_DARK_BLUE}</option>
                 <option style="color:indigo; background-color: {T_TD_COLOR1}" value="indigo" class="genmed">{L_COLOR_INDIGO}</option>
                 <option style="color:violet; background-color: {T_TD_COLOR1}" value="violet" class="genmed">{L_COLOR_VIOLET}</option>
                 <option style="color:white; background-color: {T_TD_COLOR1}" value="white" class="genmed">{L_COLOR_WHITE}</option>
                 <option style="color:black; background-color: {T_TD_COLOR1}" value="black" class="genmed">{L_COLOR_BLACK}</option>
</select> &nbsp;{L_FONT_SIZE}:<select name="addbbcode20" onChange="bbfontstyle('[size=' + this.form.addbbcode20.options[this.form.addbbcode20.selectedIndex].value + ']', '[/size]');this.selectedIndex=0;" onMouseOver="helpline('f')">
                 <option value="0" class="genmed">{L_FONT_SIZE}</option>
                 <option value="7" class="genmed">{L_FONT_TINY}</option>
                 <option value="9" class="genmed">{L_FONT_SMALL}</option>
                 <option value="12" selected class="genmed">{L_FONT_NORMAL}</option>
                 <option value="18" class="genmed">{L_FONT_LARGE}</option>
                 <option  value="24" class="genmed">{L_FONT_HUGE}</option>
               </select>
               </span></td>
              <td nowrap="nowrap" align="right"><span class="gensmall"><a href="javascript:bbstyle(-1)" class="genmed" onMouseOver="helpline('a')">{L_BBCODE_CLOSE_TAGS}</a></span></td>
            </tr>
           </table>
         </td>
        </tr>
        <tr>
         <td colspan="9"> <span class="gensmall">
           <input type="text" name="helpbox" size="45" maxlength="100" style="width:450px; font-size:10px" class="helpline" value="{L_STYLES_TIP}" />
           </span></td>
        </tr>
        <tr>
         <td colspan="9"><span class="gen">
           <textarea name="message" rows="15" cols="35" wrap="virtual" style="width:450px" tabindex="3" class="post" onselect="storeCaret(this);" onclick="storeCaret(this);" onkeyup="storeCaret(this);">{MESSAGE}</textarea>
<br />{MYFF.ATTACHMENT}
           </span></td>
        </tr>
      </table>
      </span></td>
   </tr>
   <tr>
     <td class="row1" valign="top"><span class="gen"><b>{L_OPTIONS}</b></span><br /><span class="gensmall">{HTML_STATUS}<br />{BBCODE_STATUS}<br />{SMILIES_STATUS}</span></td>



Now replace the whole of that code with

Code:
 </td>
{MYFF.BBCODE}
</tr>
<tr>
<td class="row1" valign="top"><span class="gen"><b>{L_OPTIONS}</b></span><br /><span class="gensmall">{HTML_STATUS}<br />{BBCODE_STATUS}<br />{SMILIES_STATUS}</span></td>


Ok now save and submit

Now goto your

posting_smilies.tpl

And replace all the code with the code below.

Code:
<script language="javascript" type="text/javascript" src="templates/posting.js"></script>


<table width="100%" border="0" cellspacing="0" cellpadding="10">
<tr>
<td><table width="100%" border="0" cellspacing="1" cellpadding="4" class="forumline">
<tr>
<th class="thHead" height="25">{L_EMOTICONS}</th>
</tr>
<tr>
<td><table width="100" border="0" cellspacing="0" cellpadding="5">
<!-- BEGIN smilies_row -->
<tr align="center" valign="middle">
<!-- BEGIN smilies_col -->
<td><a href="javascript:pemoticon('{smilies_row.smilies_col.SMILEY_CODE}','{smilies_row.smilies_col.SMILEY_IMG}')"><img src="{smilies_row.smilies_col.SMILEY_IMG}" border="0" alt="{smilies_row.smilies_col.SMILEY_DESC}" title="{smilies_row.smilies_col.SMILEY_DESC}" /></a></td>
<!-- END smilies_col -->
</tr>
<!-- END smilies_row -->
<!-- BEGIN switch_smilies_extra -->
<tr align="center">
<td colspan="{S_SMILIES_COLSPAN}"><span class="nav"><a href="{U_MORE_SMILIES}" onclick="open_window('{U_MORE_SMILIES}', 250, 300);return false" target="_smilies" class="nav">{L_MORE_SMILIES}</a></td>
</tr>
<!-- END switch_smilies_extra -->
</table></td>
</tr>
<tr>
<td align="center"><br /><span class="genmed"><a href="javascript:window.close();" class="genmed">{L_CLOSE_WINDOW}</a></span></td>
</tr>
</table></td>
</tr>
</table>


Save and submit


Ok now open up your .css (you will find this in the same area as your .tpl files for example posting_body.tpl) it will have a name like

myff_howtodoit1.css




Find a block of code that looks similar to the code below.

Code:

/* General page style. The scroll bar colours only visible in IE5.5+ */
body {
   background-color: #E5E5E5;
   scrollbar-face-color: #DEE3E7;
   scrollbar-highlight-color: #FFFFFF;
   scrollbar-shadow-color: #DEE3E7;
   scrollbar-3dlight-color: #D1D7DC;
   scrollbar-arrow-color:  #006699;
   scrollbar-track-color: #EFEFEF;
   scrollbar-darkshadow-color: #98AAB1;
}


And add to that code

Code:
 font-size: 11px ;font-family: Verdana, Arial, Helvetica, sans-serif ;


So it would look similar to this


Code:

/* General page style. The scroll bar colours only visible in IE5.5+ */
body {
   background-color: #E5E5E5;
   scrollbar-face-color: #DEE3E7;
   scrollbar-highlight-color: #FFFFFF;
   scrollbar-shadow-color: #DEE3E7;
   scrollbar-3dlight-color: #D1D7DC;
   scrollbar-arrow-color:  #006699;
   scrollbar-track-color: #EFEFEF;
   scrollbar-darkshadow-color: #98AAB1;
font-size: 11px ;font-family: Verdana, Arial, Helvetica, sans-serif ;
}


Now find a block of code that may look like this or similar

Code:
/* General font families for common tags */
font,th,td,p { font-family: Verdana, Arial, Helvetica, sans-serif }


And remove the word font

So it may look like this

Code:
/* General font families for common tags */
th,td,p { font-family: Verdana, Arial, Helvetica, sans-serif }



Now goto

admin - panel -- 2. General Configuration

Now find the

Code:
Allowed HTML tags
Separate tags with commas


In that box add

Code:
*
And REMOVE all Ohter Tags

So it may look like this (this depends on the allowed tags all ready DO not just copy this example.)

Code:
*



This will allow all security safe tags, but note that it does mean that table tags and other tags that may disrupt the appearance of posts will be allowed. You might want to experiment with the setting here. e.g. just allowing the tags you want.



And that`s HOWTODOIT

p.s

wysiwyg = What You See Is What You Get

Guide courstesy Of HOWTODOIT © Symon Field


Back to top
View user's profile Send private message
Display posts from previous:   
Post new topic   Reply to topic    Center of Me and you Forum Index -> Howtodoit Help All times are GMT + 10 Hours
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum

Card File  Gallery  Forum Archive
Powered by phpBB © 2001, 2005 phpBB Group
Free Domain Name - www.YOU.co.nr!
Create your own free forum | Buy a domain to use with your forum