wbb3 to phpbb3 [posting buttons] - (V1.1.5)

[Daniel_Knecht]

Hello,
Here is my newest Modification for the phpbb3 Forum.

Information:
This is for the "Absolution" Theme U can use ur Own Images if u want.

V1.1
Demonstration:
Posting Layout:

Profile New Message Layout:

Details:

• Complete New Posting Buttons Layout
• wbb3 Button Layout (Not pinched!)
• Include my "wbb3 to phpbb3 [BBCodes]"
  • [bbcode] wbb3 to phpbb3 - Infoboxes
  • [bbcode] wbb3 to phpbb3 - Progressbar
  • [bbcode] wbb3 to phpbb3 - Spoiler
  • [bbcode] wbb3 to phpbb3 - Headline

V1.1- What´s New?

• Strikeout
• Text Align left, center, right
• List "[ * ]" Icon
• "wbb3 to phpbb3 Headline" BBCode included

[spoiler=Installation (Include V1.1)]Installation:
1. [important!]
Please make a Backup of the following Files:
styles/[Your Style]/template/posting_buttons.html
styles/[Your Style]/theme/forms.css
styles/[Your Style]/theme/colours.css
styles/[Your Style]/theme/images (If you want.)

2.
Open the forms.css and find:

Code: Select all

/* Buttons used in the editor */
#format-buttons {
	margin: 15px 0 2px 0;
}

and replace with this:

Code: Select all

/* Buttons used in the editor */
/*#format-buttons {
	margin: 15px 0 2px 0;
}*/
#format-buttons {
	background: url("{T_THEME_PATH}/images/posting_buttons_hg.png") repeat-x;
	height: 23px;
	width: 724px;
	padding: 4px 4px 4px 4px;
	border-top: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
}
#format-buttons2 {
	background: #184d6c;
	height: 23px;
	width: 724px;
	margin-top: -3px;
	padding: 4px 4px 4px 4px;
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
}

3.
Open the colours.css and find:

Code: Select all

/* Form button styles
---------------------------------------- */

and Add After:

Code: Select all

.bold {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/bold.png") no-repeat !important;
border: 0 !important;
}
.bold:hover {
background: url("{T_THEME_PATH}/images/bold.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.italic {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/italic.png") no-repeat !important;
border: 0 !important;
}
.italic:hover {
background: url("{T_THEME_PATH}/images/italic.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.underline {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/underline.png") no-repeat !important;
border: 0 !important;
}
.underline:hover {
background: url("{T_THEME_PATH}/images/underline.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.strikeout {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/strikeout.png") no-repeat !important;
border: 0 !important;
}
.strikeout:hover {
background: url("{T_THEME_PATH}/images/strikeout.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.align_left {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/align_left.png") no-repeat !important;
border: 0 !important;
}
.align_left:hover {
background: url("{T_THEME_PATH}/images/align_left.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.align_center {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/align_center.png") no-repeat !important;
border: 0 !important;
}
.align_center:hover {
background: url("{T_THEME_PATH}/images/align_center.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.align_right {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/align_right.png") no-repeat !important;
border: 0 !important;
}
.align_right:hover {
background: url("{T_THEME_PATH}/images/align_right.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.list {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/list.png") no-repeat !important;
border: 0 !important;
}
.list:hover {
background: url("{T_THEME_PATH}/images/list.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.list_num {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/list_num.png") no-repeat !important;
border: 0 !important;
}
.list_num:hover {
background: url("{T_THEME_PATH}/images/list_num.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.list_dot {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/list_dot.png") no-repeat !important;
border: 0 !important;
}
.list_dot:hover {
background: url("{T_THEME_PATH}/images/list_dot.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.colorplatte {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/colorplatte.jpg") no-repeat !important;
border: 0 !important;
}
.colorplatte:hover {
background: url("{T_THEME_PATH}/images/colorplatte_hover.jpg") no-repeat !important;
border: 0 !important;
}

.link {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/link.png") no-repeat !important;
border: 0 !important;
}
.link:hover {
background: url("{T_THEME_PATH}/images/link.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.img {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/img.jpg") no-repeat !important;
border: 0 !important;
}
.img:hover {
background: url("{T_THEME_PATH}/images/img_hover.jpg") no-repeat !important;
border: 0 !important;
}
.quote {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/quote.png") no-repeat !important;
border: 0 !important;
}
.quote:hover {
background: url("{T_THEME_PATH}/images/quote.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.code {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/code.jpg") no-repeat !important;
border: 0 !important;
}
.code:hover {
background: url("{T_THEME_PATH}/images/code_hover.jpg") no-repeat !important;
border: 0 !important;
}
.infobox {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/infobox.jpg") no-repeat !important;
border: 0 !important;
}
.infobox:hover {
background: url("{T_THEME_PATH}/images/infobox_hover.jpg") no-repeat !important;
border: 0 !important;
}
.errorbox {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/errorbox.jpg") no-repeat !important;
border: 0 !important;
}
.errorbox:hover {
background: url("{T_THEME_PATH}/images/errorbox_hover.jpg") no-repeat !important;
border: 0 !important;
}
.warnbox {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/warnbox.jpg") no-repeat !important;
border: 0 !important;
}
.warnbox:hover {
background: url("{T_THEME_PATH}/images/warnbox_hover.jpg") no-repeat !important;
border: 0 !important;
}
.successbox {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/successbox.jpg") no-repeat !important;
border: 0 !important;
}
.successbox:hover {
background: url("{T_THEME_PATH}/images/successbox_hover.jpg") no-repeat !important;
border: 0 !important;
}
.headline {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/headline.png") no-repeat !important;
border: 0 !important;
}
.headline:hover {
background: url("{T_THEME_PATH}/images/headline.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.progressbar {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/progressbar.png") no-repeat !important;
border: 0 !important;
}
.progressbar:hover {
background: url("{T_THEME_PATH}/images/progressbar.png") no-repeat !important;
background-position: center !important; 
background-repeat: no-repeat !important;
background-color: #184d6c !important;
border: 1px solid #bbbbbb !important;
}
.spoiler {
width: 24px !important; 
height: 24px !important; 
background: url("{T_THEME_PATH}/images/spoiler.jpg") no-repeat !important;
border: 0 !important;
}
.spoiler:hover {
background: url("{T_THEME_PATH}/images/spoiler_hover.jpg") no-repeat !important;
border: 0 !important;
}

4.
Open the posting_buttons.html and find:

Code: Select all

<script type="text/javascript">
		// <![CDATA[
			function change_palette()
			{
				dE('colour_palette');
				e = document.getElementById('colour_palette');
				
				if (e.style.display == 'block')
				{
					document.getElementById('bbpalette').value = '{LA_FONT_COLOR_HIDE}';
				}
				else
				{
					document.getElementById('bbpalette').value = '{LA_FONT_COLOR}';
				}
			}

			colorPalette('h', 15, 10);
		// ]]>
		</script>

and replace with this:

Code: Select all

<script type="text/javascript">
		// <![CDATA[
			function change_palette()
			{
				dE('colour_palette');
				e = document.getElementById('colour_palette');
				
				if (e.style.display == 'block')
				{
					document.getElementById('bbpalette').value = '';
				}
				else
				{
					document.getElementById('bbpalette').value = '';
				}
			}

			colorPalette('h', 15, 10);
		// ]]>
		</script>

find:

Code: Select all

<div id="format-buttons">
	<input type="button" class="button2" accesskey="b" name="addbbcode0" value=" B " style="font-weight:bold; width: 30px" onclick="bbstyle(0)" title="{L_BBCODE_B_HELP}" />
	<input type="button" class="button2" accesskey="i" name="addbbcode2" value=" i " style="font-style:italic; width: 30px" onclick="bbstyle(2)" title="{L_BBCODE_I_HELP}" />
	<input type="button" class="button2" accesskey="u" name="addbbcode4" value=" u " style="text-decoration: underline; width: 30px" onclick="bbstyle(4)" title="{L_BBCODE_U_HELP}" />
	<!-- IF S_BBCODE_QUOTE -->
		<input type="button" class="button2" accesskey="q" name="addbbcode6" value="Quote" style="width: 50px" onclick="bbstyle(6)" title="{L_BBCODE_Q_HELP}" />
	<!-- ENDIF -->
	<input type="button" class="button2" accesskey="c" name="addbbcode8" value="Code" style="width: 40px" onclick="bbstyle(8)" title="{L_BBCODE_C_HELP}" />
	<input type="button" class="button2" accesskey="l" name="addbbcode10" value="List" style="width: 40px" onclick="bbstyle(10)" title="{L_BBCODE_L_HELP}" />
	<input type="button" class="button2" accesskey="o" name="addbbcode12" value="List=" style="width: 40px" onclick="bbstyle(12)" title="{L_BBCODE_O_HELP}" />
	<input type="button" class="button2" accesskey="t" name="addlitsitem" value="[*]" style="width: 40px" onclick="bbstyle(-1)" title="{L_BBCODE_LISTITEM_HELP}" />
	<!-- IF S_BBCODE_IMG -->
		<input type="button" class="button2" accesskey="p" name="addbbcode14" value="Img" style="width: 40px" onclick="bbstyle(14)" title="{L_BBCODE_P_HELP}" />
	<!-- ENDIF -->
	<!-- IF S_LINKS_ALLOWED -->
		<input type="button" class="button2" accesskey="w" name="addbbcode16" value="URL" style="text-decoration: underline; width: 40px" onclick="bbstyle(16)" title="{L_BBCODE_W_HELP}" />
	<!-- ENDIF -->
	<!-- IF S_BBCODE_FLASH -->
		<input type="button" class="button2" accesskey="d" name="addbbcode18" value="Flash" onclick="bbstyle(18)" title="{L_BBCODE_D_HELP}" />
	<!-- ENDIF -->
	<select name="addbbcode20" onchange="bbfontstyle('[size=' + this.form.addbbcode20.options[this.form.addbbcode20.selectedIndex].value + ']', '[/size]');this.form.addbbcode20.selectedIndex = 2;" title="{L_BBCODE_F_HELP}">
		<option value="50">{L_FONT_TINY}</option>
		<option value="85">{L_FONT_SMALL}</option>
		<option value="100" selected="selected">{L_FONT_NORMAL}</option>
		<!-- IF not MAX_FONT_SIZE or MAX_FONT_SIZE >= 150 -->
			<option value="150">{L_FONT_LARGE}</option>
			<!-- IF not MAX_FONT_SIZE or MAX_FONT_SIZE >= 200 -->
				<option value="200">{L_FONT_HUGE}</option>
			<!-- ENDIF -->
		<!-- ENDIF -->
	</select>
	<input type="button" class="button2" name="bbpalette" id="bbpalette" value="{L_FONT_COLOR}" onclick="change_palette();" title="{L_BBCODE_S_HELP}" />
	<!-- BEGIN custom_tags -->
		<input type="button" class="button2" name="addbbcode{custom_tags.BBCODE_ID}" value="{custom_tags.BBCODE_TAG}" onclick="bbstyle({custom_tags.BBCODE_ID})" title="{custom_tags.BBCODE_HELPLINE}" />
	<!-- END custom_tags -->
</div>

and replace with this:

Code: Select all

<div id="format-buttons">
  <select name="addbbcode20" onchange="bbfontstyle('[size=' + this.form.addbbcode20.options[this.form.addbbcode20.selectedIndex].value + ']', '[/size]');this.form.addbbcode20.selectedIndex = 2;" title="{L_BBCODE_F_HELP}">
		<option selected="selected">Schriftgr&ouml;&szlig;e</option>
        <option value="50">{L_FONT_TINY}</option>
		<option value="85">{L_FONT_SMALL}</option>
		<option value="100">{L_FONT_NORMAL}</option>
		<!-- IF not MAX_FONT_SIZE or MAX_FONT_SIZE >= 150 -->
			<option value="150">{L_FONT_LARGE}</option>
			<!-- IF not MAX_FONT_SIZE or MAX_FONT_SIZE >= 200 -->
				<option value="200">{L_FONT_HUGE}</option>
			<!-- ENDIF -->
		<!-- ENDIF -->
	</select>
    <img src="{T_THEME_PATH}/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
    <input type="button" class="bold" accesskey="b" name="addbbcode0" value="" style="font-weight:bold; width: 30px" onclick="bbstyle(0)" title="{L_BBCODE_B_HELP}" />
	<input type="button" class="italic" accesskey="i" name="addbbcode2" value="" style="font-style:italic; width: 30px" onclick="bbstyle(2)" title="{L_BBCODE_I_HELP}" />
	<input type="button" class="underline" accesskey="u" name="addbbcode4" value="" style="text-decoration: underline; width: 30px" onclick="bbstyle(4)" title="{L_BBCODE_U_HELP}" />
    <!-- BEGIN custom_tags -->
    	<!-- IF custom_tags.BBCODE_TAG eq 's' -->
    	<input type="button" class="strikeout" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Durchstreichen: [s]Text[/s]" />
    	<!-- ENDIF -->
    <!-- END custom_tags -->
    <img src="http://home-of-stolle.de/board/styles/absolution/theme/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
    <!-- BEGIN custom_tags -->
    	<!-- IF custom_tags.BBCODE_TAG eq 'left' -->
    	<input type="button" class="align_left" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Linksb&uuml;ndig" />
    	<!-- ENDIF -->
    	<!-- IF custom_tags.BBCODE_TAG eq 'center' -->
    	<input type="button" class="align_center" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Zentriert" />
    	<!-- ENDIF -->
    	<!-- IF custom_tags.BBCODE_TAG eq 'right' -->
    	<input type="button" class="align_right" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Rechtsb&uuml;ndig" />
    	<!-- ENDIF -->
    <!-- END custom_tags -->
    <img src="http://home-of-stolle.de/board/styles/absolution/theme/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
	<input type="button" class="list" accesskey="l" name="addbbcode10" value="" style="width: 40px" onclick="bbstyle(10)" title="{L_BBCODE_L_HELP}" />
	<!--<input type="button" class="list_num" accesskey="o" name="addbbcode12" value="" style="width: 40px" onclick="bbstyle(12)" title="{L_BBCODE_O_HELP}" />-->
	<input type="button" class="list_dot" accesskey="t" name="addlitsitem" value="" style="width: 40px" onclick="bbstyle(-1)" title="{L_BBCODE_LISTITEM_HELP}" />
    <img src="http://home-of-stolle.de/board/styles/absolution/theme/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
	<!-- IF S_BBCODE_FLASH -->
		<input type="button" class="button2" accesskey="d" name="addbbcode18" value="Flash" onclick="bbstyle(18)" title="{L_BBCODE_D_HELP}" />
	<!-- ENDIF -->
	<input type="button" class="colorplatte" name="bbpalette" id="bbpalette" value="" onclick="change_palette();" title="{L_BBCODE_S_HELP}" />
</div>
<div id="format-buttons2">
	<img src="{T_THEME_PATH}/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
    <!-- IF S_LINKS_ALLOWED -->
		<input type="button" class="link" accesskey="w" name="addbbcode16" value="" style="text-decoration: underline; width: 40px" onclick="bbstyle(16)" title="{L_BBCODE_W_HELP}" />
	<!-- ENDIF -->
	<img src="{T_THEME_PATH}/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
    <!-- IF S_BBCODE_IMG -->
		<input type="button" class="img" accesskey="p" name="addbbcode14" value="" style="width: 40px" onclick="bbstyle(14)" title="{L_BBCODE_P_HELP}" />
	<!-- ENDIF -->
    <img src="{T_THEME_PATH}/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
    <!-- IF S_BBCODE_QUOTE -->
		<input type="button" class="quote" accesskey="q" name="addbbcode6" value="" style="width: 50px" onclick="bbstyle(6)" title="{L_BBCODE_Q_HELP}" />
	<!-- ENDIF -->
	<input type="button" class="code" accesskey="c" name="addbbcode8" value="" style="width: 40px" onclick="bbstyle(8)" title="{L_BBCODE_C_HELP}" />
    <img src="{T_THEME_PATH}/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
	<!-- BEGIN custom_tags -->
		<!-- <input type="button" class="button2" name="addbbcode{custom_tags.BBCODE_ID}" value="{custom_tags.BBCODE_TAG}" onclick="bbstyle({custom_tags.BBCODE_ID})" title="{custom_tags.BBCODE_HELPLINE}" /> -->
        <!-- IF custom_tags.BBCODE_TAG eq 'infobox' -->
        <input type="button" class="infobox" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Box: [infobox]...[/infobox]" />
        <!-- ENDIF -->
        <!-- IF custom_tags.BBCODE_TAG eq 'errorbox' -->
        <input type="button" class="errorbox" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Box: [errorbox]...[/errorbox]" />
        <!-- ENDIF -->
        <!-- IF custom_tags.BBCODE_TAG eq 'warnbox' -->
        <input type="button" class="warnbox" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Box: [warnbox]...[/warnbox]" />
        <!-- ENDIF -->
        <!-- IF custom_tags.BBCODE_TAG eq 'successbox' -->
        <input type="button" class="successbox" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Box: [successbox]...[/successbox]" />
        <!-- ENDIF -->
	<!-- END custom_tags -->
    <img src="{T_THEME_PATH}/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
    <!-- BEGIN custom_tags -->
        <!-- IF custom_tags.BBCODE_TAG eq 'headline=' -->
        <input type="button" class="headline" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Headline: [headline=farbe]&uuml;berschrifttext[/headline]" />
        <!-- ENDIF -->
        <!-- IF custom_tags.BBCODE_TAG eq 'progress=' -->
        <input type="button" class="progressbar" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Progressbar: [progress=prozent,balkenfarbe,textfarbe]text (optional)[/progress]" />
        <!-- ENDIF -->
    <!-- END custom_tags -->
    <img src="{T_THEME_PATH}/images/ph.png" width="2" height="24" style="vertical-align:middle;" />
    <!-- BEGIN custom_tags -->
        <!-- IF custom_tags.BBCODE_TAG eq 'spoiler=' -->
        <input type="button" class="spoiler" name="addbbcode{custom_tags.BBCODE_ID}" value="" onclick="bbstyle({custom_tags.BBCODE_ID})" title="Spoiler: [spoiler=titel des spoilers]inhalt des spoilers[/spoiler]" />
        <!-- ENDIF -->
	<!-- END custom_tags -->
</div>

Indication/Tip:
U need to Edit the "titel="..."" for the BBCode Helpline to English because I come from Germany.
And u need my "wbb3 to phpbb3 [BBCodes]" for 100% functionality or u need to delete the Custom bbcodes from the posting_buttons.html.

The Following BBCodes u need:
Strikeout...
BBCode:

Code: Select all

[s]{TEXT}[/s]

HTML Code:

Code: Select all

<STRIKE>{TEXT}</STRIKE>

Align-Left...
BBCode:

Code: Select all

[left]{TEXT}[/left]

HTML Code:

Code: Select all

<div align="left">{TEXT}</div>

Align-Center...
BBCode:

Code: Select all

[center]{TEXT}[/center]

HTML Code:

Code: Select all

<div align="center">{TEXT}</div>

Align-Right...
BBCode:

Code: Select all

[right]{TEXT}[/right]

HTML Code:

Code: Select all

<div align="right">{TEXT}</div>

Images: (U need for this Mod) - (V1.1 Images Included)

images.rar

Copy the images in to your "/theme/images" folder.

(134.37 KiB) Downloaded 283 times

Code: Select all

After this all Go to your ACP > Styles > and Clear the "Template" and "Theme" Cache from your Style.

[/spoiler]

V1.1.5
What´s New?

• Little Tab Div over the Main Posting Buttons without a function it´s only for better information

[spoiler=Upgrade to V1.1.5]Installation:
1.
Open the forms.css and find:

Code: Select all

#format-buttons {

and Add befor:

Code: Select all

#format-info {
	background: #091d28;
	height: 20px;
	width: 66px;
	text-align: center;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	margin-left: 10px;
	padding: 4px 0 0 0;
	border-top: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	color: #ffffff;
}

2.
Open the posting_buttons.html and find:

Code: Select all

<div id="format-buttons">

and Add befor:

Code: Select all

<div id="format-info">BBCodes</div>

Code: Select all

Go to your ACP > Styles > and Clear the "Template" and "Theme" Cache from your Style.

[/spoiler]

I hope it´s all correctly then this is my first BIG Mod

[Stoker]

Screenshot please

[Steve]

in the 1st post stoker
Demonstration:
Posting Layout: Screenshot
Profile New Message Layout: Screenshot

[Daniel_Knecht]

Yes. In the First Post under "Demonstration:" u can find 2 Screenshots Stroker

[Stoker]

Sorry, I didnt see.
Looks nice

[Daniel_Knecht]

So... I have make the first Update.
What´s New? See the First Post!

UPDATE #1 Screenshots:

[Daniel_Knecht]

Here is another little Update.

I have Include a little Tab Div over the Posting Buttons.
This Tab Div is without a function it´s only for better information

UPDATE #1.5 See first post version 1.1.5


EDITED BY CISCO AS PER REQUEST!

[cisco007]

why don't you just post this in the first post? just edit it and add the update number as you go!

[Daniel_Knecht]

Because it is better thus for the overview.
I put in the first contribution completely on top always a link to the updates

[cisco007]

if you say so!