PDA

View Full Version : Forum Display Enhancements - Add backround image to quickreply and reply boxes (using Inline CSS,Template Edits)

brvheart
09-27-2007, 10:00 PM
Brvheart's - Add backround image to quickreply and reply boxes
-----------------------------------------------------------------------------------------------------------------
This is a few simple template edits, I have seen this done via CSS but could not get it to work without the
image scrolling out of view, so I decided to play around and see if I could get it to work in a different manner. I was not able to find the original thread that I saw this in with the CSS edits etc, if I find it I will gladly give credit for the original idea to the author.

EDIT - Original hack here by Ev!L ErN!E (https://vborg.vbsupport.ru/showthread.php?t=129962)

See Directions below.

The image should be uploaded to your images directory and be around 330 x 89 in size. I will upload the one I am using as a base.

**************note*************
the "background:#262626 in the below code needs to be change to fit your backround color, this is mine that I used,
make sure to change it for your style on your board.
**************end note*********
-----------------------------------------------------------------------------------------------------------------

Details:

Files to upload:
1 - to images folder

Template edits:

Editor Templates
editor_toolbar_off
editor_toolbar_on
Show Thread Templates
showthread_quickreply

Live Demo - here (www.mmaworld.org)

please click install (javascript: vborg_doinstall(158937,true))
---------------------------------------------------------

Instructions:

in editor_toolbar_off find:

<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60"

After place:
<!-- start brvhearts backround image -->
style="background:#262626 url(images/imagename.gif); background-repeat: no-repeat; background-position: center center;
<!-- end brvhearts backround image -->

---------------------------------------------------------

in editor_toolbar_on find (towards bottom of template):

<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60"

After place:
<!-- start brvhearts backround image -->
style="background:#262626 url(forumpath/imagename.gif); background-repeat: no-repeat; background-position: center center;
<!-- end brvhearts backround image -->
---------------------------------------------------------

in showthread_quickreply find (towards bottom of template):

There will be 2 instances of the below at the end of the template, you are looking for the second one

<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60"

After place:
<!-- start brvhearts backround image -->
style="background:#262626 url(forumpath/imagename.gif); background-repeat: no-repeat; background-position: center center;
<!-- end brvhearts backround image -->
brvheart
09-28-2007, 03:47 AM
*reserved*
PoetJA-1975
09-28-2007, 09:51 AM
Looks good - Thanx for the share ;)

Jacquii.
brvheart
09-28-2007, 01:10 PM
Looks good - Thanx for the share ;)

Jacquii.

My pleasure :)
Magnumutz
09-28-2007, 07:15 PM
It's kinda the same thing as editing the Main CSS.
brvheart
09-28-2007, 07:44 PM
without editing the CSS, and without running in to the scrolling issue that some were running in to....
Merrillizer
09-29-2007, 02:54 AM
Cool idea. Cant get it to work with my template though. :mad:

Would be cool if there were a way to make the images rotate, like 3 or 4 random images.
brvheart
09-29-2007, 09:54 AM
why wont it work with your template? What was the issue?
Wayne Luke
10-02-2007, 04:41 PM
This is still CSS... Just inline CSS.

TO fix the scrolling issue, you just have to apply the style to the appropriate element, which you did inline. It can be handled in MainCSS as well but you would probably need to add your own inline class.
brvheart
10-02-2007, 06:30 PM
This is still CSS... Just inline CSS.

TO fix the scrolling issue, you just have to apply the style to the appropriate element, which you did inline. It can be handled in MainCSS as well but you would probably need to add your own inline class.

hmm...I was not able to get it with the original....so I did this one and it seemed to work fine, can be deleted if it is not found to be useful...
TCE Killa
01-09-2008, 10:21 AM
Thanks but I can't get it to work. I've done the Main CSS, done the templates edits but I don't get anything in my Quick Reply box and this is what I get in the normal box:


style="background:#000099 url(images/bluebg.bmp); background-repeat: no-repeat; background-position: center center;
<!-- end brvhearts backround image -->
style="display:block; width:540px; height:250px" tabindex="1" dir="ltr">

Any ideas, where I am going wrong? I've tried the full image address as well with still no luck. And I have changed the colors to my actual main css color. Thanks.
brvheart
01-10-2008, 01:23 AM
if you can give me a admin login for temp use I can have a look for you. PM if you want.
TCE Killa
01-10-2008, 08:50 AM
I'll just show you my templates instead and hopefully you can correct them.

Here is my Main CSS WYSIWYG edit:

Background: #000000 url(images/hiphop.jpg) repeat-x center fixed

Extra CSS: background-repeat: no-repeat;
background-position: center center;

Here is my editor_toolbar_off template:

<!-- START NORMAL TEXT AREA -->
$vBeditTemplate[clientscript]

<div style="text-align:$stylevar[left]" style="padding-right:8px">
<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60"

<!-- start brvhearts backround image -->
style="background:#000000 url(images/hiphop.jpg); background-repeat: no-repeat; background-position: center center;
<!-- end brvhearts backround image -->

style="width:100%; height:{$editor_height}px" tabindex="1">$newpost[message]</textarea>
<!--width:$stylevar[messagewidth]-->
</div>

<script type="text/javascript">
<!--
vB_Editor['$editorid'] = new vB_Text_Editor('$editorid', $editortype, '$forumid', '$parsesmilie');
//-->
</script>
<!-- END NORMAL TEXT AREA -->

Here is my edit_toolbar_on template:

$vBeditTemplate[clientscript]

<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="$editorid" class="vBulletin_editor" width="100%">
<div id="{$editorid}_controls" class="controlbar">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="imagebutton" id="{$editorid}_cmd_removeformat"><img src="$stylevar[imgdir_editor]/removeformat.gif" width="21" height="20" alt="$vbphrase[remove_text_formatting]" /></div></td>
<if condition="$show['font_bbcode'] OR $show['size_bbcode']">
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
</if>
<if condition="$show['font_bbcode']">
<td><div class="imagebutton" id="{$editorid}_popup_fontname" title="$vbphrase[fonts]">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="popup_feedback"><div id="{$editorid}_font_out" style="width:91px">&nbsp;</div></td>
<td class="popup_pickbutton"><img src="$stylevar[imgdir_editor]/menupop.gif" width="11" height="16" alt="" /></td>
</tr>
</table>
</div></td>
</if>
<if condition="$show['size_bbcode']">
<td><div class="imagebutton" id="{$editorid}_popup_fontsize" title="$vbphrase[sizes]">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="popup_feedback"><div id="{$editorid}_size_out" style="width:25px">&nbsp;</div></td>
<td class="popup_pickbutton"><img src="$stylevar[imgdir_editor]/menupop.gif" width="11" height="16" alt="" /></td>
</tr>
</table>
</div></td>
</if>
<if condition="$show['color_bbcode']">
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="{$editorid}_popup_forecolor" title="$vbphrase[colors]">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="{$editorid}_color_out"><img src="$stylevar[imgdir_editor]/color.gif" width="21" height="16" alt="" /><br /><img src="$vboptions[cleargifurl]" id="{$editorid}_color_bar" alt="" style="background-color:black" width="21" height="4" /></td>
<td class="alt_pickbutton"><img src="$stylevar[imgdir_editor]/menupop.gif" width="11" height="16" alt="" /></td>
</tr>
</table>
</div></td>
</if>
<if condition="$show['wysiwygsmilies']">
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="{$editorid}_popup_smilie" title="$vbphrase[smilies]">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td><img src="$stylevar[imgdir_editor]/smilie.gif" alt="" width="21" height="20" /></td>
<td class="alt_pickbutton"><img src="$stylevar[imgdir_editor]/menupop.gif" width="11" height="16" alt="" /></td>
</tr>
</table>
</div></td>
</if>
<if condition="$show['attach']">
<td><div class="imagebutton" id="{$editorid}_popup_attach" title="$vbphrase[attachments]">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td><img src="$stylevar[imgdir_editor]/attach.gif" alt="" width="21" height="20" /></td>
<td class="alt_pickbutton"><img src="$stylevar[imgdir_editor]/menupop.gif" width="11" height="16" alt="" /></td>
</tr>
</table>
</div></td>
</if>
<!--
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="{$editorid}_cmd_cut"><img src="$stylevar[imgdir_editor]/cut.gif" width="21" height="20" alt="$vbphrase[cut]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_copy"><img src="$stylevar[imgdir_editor]/copy.gif" width="21" height="20" alt="$vbphrase[copy]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_paste"><img src="$stylevar[imgdir_editor]/paste.gif" width="21" height="20" alt="$vbphrase[paste]" /></div></td>
-->
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="{$editorid}_cmd_undo"><img src="$stylevar[imgdir_editor]/undo.gif" width="21" height="20" alt="$vbphrase[undo]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_redo"><img src="$stylevar[imgdir_editor]/redo.gif" width="21" height="20" alt="$vbphrase[redo]" /></div></td>
<td width="100%">&nbsp;</td>
<if condition="is_browser('ie') AND !is_browser('mac')">
<td><div class="imagebutton" id="{$editorid}_cmd_spelling"><img src="$stylevar[imgdir_editor]/spelling.gif" width="21" height="20" alt="$vbphrase[check_spelling]" /></div></td>
</if>
<td>
<div class="imagebutton" id="{$editorid}_cmd_resize_0_100"><img src="$stylevar[imgdir_editor]/resize_0.gif" width="21" height="9" alt="$vbphrase[decrease_size]" /></div>
<div class="imagebutton" id="{$editorid}_cmd_resize_1_100"><img src="$stylevar[imgdir_editor]/resize_1.gif" width="21" height="9" alt="$vbphrase[increase_size]" /></div>
</td>
<if condition="$show['wysiwyg_compatible']">
<td><div class="imagebutton" id="{$editorid}_cmd_switchmode"><img src="$stylevar[imgdir_editor]/switchmode.gif" width="21" height="20" alt="$vbphrase[switch_editor_mode]" /></div></td>
</if>
</tr>
</table>
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<if condition="$show['basic_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_bold"><img src="$stylevar[imgdir_editor]/bold.gif" width="21" height="20" alt="$vbphrase[bold]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_italic"><img src="$stylevar[imgdir_editor]/italic.gif" width="21" height="20" alt="$vbphrase[italic]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_underline"><img src="$stylevar[imgdir_editor]/underline.gif" width="21" height="20" alt="$vbphrase[underline]" /></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
</if>
<if condition="$show['align_bbcode']">
<if condition="$stylevar['textdirection'] == 'ltr'">
<td><div class="imagebutton" id="{$editorid}_cmd_justifyleft"><img src="$stylevar[imgdir_editor]/justifyleft.gif" width="21" height="20" alt="$vbphrase[align_left]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_justifycenter"><img src="$stylevar[imgdir_editor]/justifycenter.gif" width="21" height="20" alt="$vbphrase[align_center]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_justifyright"><img src="$stylevar[imgdir_editor]/justifyright.gif" width="21" height="20" alt="$vbphrase[align_right]" /></div></td>
<else />
<td><div class="imagebutton" id="{$editorid}_cmd_justifyright"><img src="$stylevar[imgdir_editor]/justifyright.gif" width="21" height="20" alt="$vbphrase[align_right]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_justifycenter"><img src="$stylevar[imgdir_editor]/justifycenter.gif" width="21" height="20" alt="$vbphrase[align_center]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_justifyleft"><img src="$stylevar[imgdir_editor]/justifyleft.gif" width="21" height="20" alt="$vbphrase[align_left]" /></div></td>
</if>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
</if>
<if condition="$show['list_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_insertorderedlist"><img src="$stylevar[imgdir_editor]/insertorderedlist.gif" width="21" height="20" alt="$vbphrase[ordered_list]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_insertunorderedlist"><img src="$stylevar[imgdir_editor]/insertunorderedlist.gif" width="21" height="20" alt="$vbphrase[unordered_list]" /></div></td>
</if>
<if condition="$show['align_bbcode'] OR $show['list_bbcode']">
<if condition="$stylevar['textdirection'] == 'ltr'">
<td><div class="imagebutton" id="{$editorid}_cmd_outdent"><img src="$stylevar[imgdir_editor]/outdent.gif" width="21" height="20" alt="$vbphrase[decrease_indent]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_indent"><img src="$stylevar[imgdir_editor]/indent.gif" width="21" height="20" alt="$vbphrase[increase_indent]" /></div></td>
<else />
<td><div class="imagebutton" id="{$editorid}_cmd_outdent"><img src="$stylevar[imgdir_editor]/indent.gif" width="21" height="20" alt="$vbphrase[decrease_indent]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_indent"><img src="$stylevar[imgdir_editor]/outdent.gif" width="21" height="20" alt="$vbphrase[increase_indent]" /></div></td>
</if>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
</if>
<if condition="$show['url_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_createlink"><img src="$stylevar[imgdir_editor]/createlink.gif" width="21" height="20" alt="$vbphrase[insert_link]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_unlink"><img src="$stylevar[imgdir_editor]/unlink.gif" width="21" height="20" alt="$vbphrase[remove_link]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_email"><img src="$stylevar[imgdir_editor]/email.gif" width="21" height="20" alt="$vbphrase[insert_email_link]" /></div></td>
</if>
<if condition="$show['img_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_insertimage"><img src="$stylevar[imgdir_editor]/insertimage.gif" width="21" height="20" alt="$vbphrase[insert_image]" /></div></td>
</if>
<if condition="$show['quote_bbcode']">
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="{$editorid}_cmd_wrap0_quote"><img src="$stylevar[imgdir_editor]/quote.gif" width="21" height="20" alt="$vbphrase[wrap_quote_tags]" /></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
</if>
<if condition="$show['code_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_wrap0_code"><img src="$stylevar[imgdir_editor]/code.gif" width="21" height="20" alt="$vbphrase[wrap_code_tags]" /></div></td>
</if>
<if condition="$show['html_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_wrap0_html"><img src="$stylevar[imgdir_editor]/html.gif" width="21" height="20" alt="$vbphrase[wrap_html_tags]" /></div></td>
</if>
<if condition="$show['php_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_wrap0_php"><img src="$stylevar[imgdir_editor]/php.gif" width="21" height="20" alt="$vbphrase[wrap_php_tags]" /></div></td>
</if>
$vBeditTemplate[extrabuttons]
</tr>
</table>
</div>

<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr valign="top">
<td class="controlbar">
<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60"
<!-- start brvhearts backround image -->
style="background:#000000 url(images/hiphop.jpg); background-repeat: no-repeat; background-position: center center;
<!-- end brvhearts backround image -->

style="display:block; width:$stylevar[messagewidth]; height:{$editor_height}px" tabindex="1" dir="$stylevar[textdirection]">$newpost[message]</textarea>
</td>
<if condition="$smiliebox"><td class="controlbar">$smiliebox</td></if>
</tr>
</table>
</td>
</tr>
</table>

<input type="hidden" name="wysiwyg" id="{$editorid}_mode" value="$editortype" />

<script type="text/javascript">
<!--
vB_Editor['$editorid'] = new vB_Text_Editor('$editorid', $editortype, '$forumid', '$parsesmilie', undefined, '$ajax_extra');
//-->
</script>
TCE Killa
01-10-2008, 08:51 AM
And here is my showthread_quickreply template:

<if condition="$show['editor_toolbar']">
<div id="{$editorid}_controls" class="controlbar">
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td><div class="imagebutton" id="{$editorid}_cmd_removeformat"><img src="$stylevar[imgdir_editor]/removeformat.gif" width="21" height="20" alt="$vbphrase[remove_text_formatting]" /></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<if condition="$show['basic_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_bold"><img src="$stylevar[imgdir_editor]/bold.gif" width="21" height="20" alt="$vbphrase[bold]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_italic"><img src="$stylevar[imgdir_editor]/italic.gif" width="21" height="20" alt="$vbphrase[italic]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_underline"><img src="$stylevar[imgdir_editor]/underline.gif" width="21" height="20" alt="$vbphrase[underline]" /></div></td>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
</if>
<if condition="$show['font_bbcode']">
<td><div class="imagebutton" id="{$editorid}_popup_fontname" title="$vbphrase[fonts]">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="popup_feedback"><div id="{$editorid}_font_out" style="width:91px">&nbsp;</div></td>
<td class="popup_pickbutton"><img src="$stylevar[imgdir_editor]/menupop.gif" width="11" height="16" alt="" /></td>
</tr>
</table>
</div></td>
</if>
<if condition="$show['size_bbcode']">
<td><div class="imagebutton" id="{$editorid}_popup_fontsize" title="$vbphrase[sizes]">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="popup_feedback"><div id="{$editorid}_size_out" style="width:25px">&nbsp;</div></td>
<td class="popup_pickbutton"><img src="$stylevar[imgdir_editor]/menupop.gif" width="11" height="16" alt="" /></td>
</tr>
</table>
</div></td>
</if>
<if condition="$show['align_bbcode']">
<if condition="$stylevar['textdirection'] == 'ltr'">
<td><div class="imagebutton" id="{$editorid}_cmd_justifyleft"><img src="$stylevar[imgdir_editor]/justifyleft.gif" width="21" height="20" alt="$vbphrase[align_left]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_justifycenter"><img src="$stylevar[imgdir_editor]/justifycenter.gif" width="21" height="20" alt="$vbphrase[align_center]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_justifyright"><img src="$stylevar[imgdir_editor]/justifyright.gif" width="21" height="20" alt="$vbphrase[align_right]" /></div></td>
<else />
<td><div class="imagebutton" id="{$editorid}_cmd_justifyright"><img src="$stylevar[imgdir_editor]/justifyright.gif" width="21" height="20" alt="$vbphrase[align_right]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_justifycenter"><img src="$stylevar[imgdir_editor]/justifycenter.gif" width="21" height="20" alt="$vbphrase[align_center]" /></div></td>
<td><div class="imagebutton" id="{$editorid}_cmd_justifyleft"><img src="$stylevar[imgdir_editor]/justifyleft.gif" width="21" height="20" alt="$vbphrase[align_left]" /></div></td>
</if>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
</if>
<if condition="$show['color_bbcode']">
<td><div class="imagebutton" id="{$editorid}_popup_forecolor" title="$vbphrase[colors]">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="{$editorid}_color_out"><img src="$stylevar[imgdir_editor]/color.gif" width="21" height="16" alt="" /><br /><img src="$vboptions[cleargifurl]" id="{$editorid}_color_bar" alt="" style="background-color:black" width="21" height="4" /></td>
<td class="alt_pickbutton"><img src="$stylevar[imgdir_editor]/menupop.gif" alt="" width="11" height="16" /></td>
</tr>
</table>
</div></td>
</if>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<if condition="$show['url_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_createlink"><img src="$stylevar[imgdir_editor]/createlink.gif" width="21" height="20" alt="$vbphrase[insert_link]" /></div></td>
</if>
<if condition="$show['img_bbcode']">
<td><div class="imagebutton" id="{$editorid}_cmd_insertimage"><img src="$stylevar[imgdir_editor]/insertimage.gif" width="21" height="20" alt="$vbphrase[insert_image]" /></div></td>
</if>
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="{$editorid}_cmd_wrap0_quote"><img src="$stylevar[imgdir_editor]/quote.gif" width="21" height="20" alt="$vbphrase[wrap_quote_tags]" /></div></td>
<td width="100%">&nbsp;</td>
<if condition="is_browser('ie')">
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="{$editorid}_cmd_spelling"><img src="$stylevar[imgdir_editor]/spelling.gif" width="21" height="20" alt="$vbphrase[check_spelling]" /></div></td>
</if>
<td>
<div class="imagebutton" id="{$editorid}_cmd_resize_0_99"><img src="$stylevar[imgdir_editor]/resize_0.gif" width="21" height="9" alt="$vbphrase[decrease_size]" /></div>
<div class="imagebutton" id="{$editorid}_cmd_resize_1_99"><img src="$stylevar[imgdir_editor]/resize_1.gif" width="21" height="9" alt="$vbphrase[increase_size]" /></div>
</td>
<if condition="$show['wysiwyg_compatible']">
<td><img src="$stylevar[imgdir_editor]/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="{$editorid}_cmd_switchmode"><img src="$stylevar[imgdir_editor]/switchmode.gif" width="21" height="20" alt="$vbphrase[switch_editor_mode]" /></div></td>
</if>
<!-- [START HACK='Magic Tool Box' AUTHOR='Alawi Ba3qeel & Alyassi' VERSION='3.0' CHANGEID= 3 ] -->
<if condition="$vboptions['mtool_quickreply_setting_active']">
$vBeditTemplate[extrabuttons]
</if>
<!-- [END HACK='Magic Tool Box' AUTHOR='Alawi Ba3qeel & Alyassi' VERSION='3.0' CHANGEID= 3 ] -->
</tr>
</table>
</div>
</if>
<div class="controlbar" style="padding-right:8px">
<fieldset style="border:0px; padding:0px; margin:0px">
<if condition="$show['qr_require_click']">
<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60" style="width:100%; height:{$editor_height}px" tabindex="1" dir="$stylevar[textdirection]" disabled="disabled">$vbphrase[click_quick_reply_icon]</textarea>
<else />
<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60"
<!-- start brvhearts backround image -->
style="background:#000000 url(images/hiphop.jpg); background-repeat: no-repeat; background-position: center center;
<!-- end brvhearts backround image -->

style="width:100%; height:{$editor_height}px" tabindex="1" dir="$stylevar[textdirection]"></textarea>
</if>
</fieldset>
<!--width:$stylevar[messagewidth]-->
</div>

<input type="hidden" name="wysiwyg" id="{$editorid}_mode" value="$editortype" />
<input type="hidden" name="styleid" value="$session[styleid]" />

<script type="text/javascript">
<!--
vB_Editor['$editorid'] = new vB_Text_Editor('$editorid', $editortype, '$forumid', '$parsesmilie');
var QR_EditorID = '$editorid';
//-->
</script>

Can you see what I am doing wrong? Thanks.
PoetJA-1975
01-10-2008, 11:45 AM
OK- just tried this template edit this morning...
How do I get the editor to extend to length of the editor box?

Thanx,

Jacquii.

https://vborg.vbsupport.ru/external/2008/01/440.gif
trickfly
01-11-2008, 08:02 PM
hmm... I really want to try this but alot of people are having problems.

Also the size of the quick reply box and normal sized reply box are different sizes so how can the same 330 x 89 image fit both ?

Please help
brvheart
01-14-2008, 12:32 AM
OK- just tried this template edit this morning...
How do I get the editor to extend to length of the editor box?

Thanx,

Jacquii.

https://vborg.vbsupport.ru/external/2008/01/440.gif

You need to adjust the editor size via admincp/styles & templates/style manager/all style options (for each style you have installed)/Size and Dimensions
brvheart
01-14-2008, 12:34 AM
hmm... I really want to try this but alot of people are having problems.

Also the size of the quick reply box and normal sized reply box are different sizes so how can the same 330 x 89 image fit both ?

Please help


I actually trimmed down my "Full Reply" box, I have not tried it on a standard size...I will try it and see how it works.
PoetJA-1975
01-14-2008, 07:05 AM
Thanx for responding BRVHEART - I actually do have the setting set for 588px in the AdminCP - but when I make the edits - it seems like that setting is ignored?!?

Any suggestions? ALSO Thanx again for sharing the modification ;)

Jacquii.
brvheart
01-21-2008, 12:29 AM
hmmmm...not sure Poet to be honest. I will have a look and see what I can come up with....
rwoscott
02-13-2008, 12:48 AM
I liked this and had it installed, but I removed it from reply, as it was not allowing to increase/decrease the size of the message text area.
Is there a way to get that too work?

I kept it in quick reply.
brvheart
10-16-2008, 05:35 PM
Let me see if I can replicate the problem - sorry for the delayed response, I was in a leave of absence state - sorry about that.
csoroner
03-07-2009, 04:49 PM
Thanks but I can't get it to work. I've done the Main CSS, done the templates edits but I don't get anything in my Quick Reply box and this is what I get in the normal box:


style="background:#000099 url(images/bluebg.bmp); background-repeat: no-repeat; background-position: center center;
<!-- end brvhearts backround image -->
style="display:block; width:540px; height:250px" tabindex="1" dir="ltr">

Any ideas, where I am going wrong? I've tried the full image address as well with still no luck. And I have changed the colors to my actual main css color. Thanks.

This looked like a good thing but with my having the same issue as TCE Killa I'm pulling this one out.

Maybe this one needs to be moved to the grave yard?
brvheart
03-11-2009, 01:29 PM
I can login and do it for you if you like - when done properly it works perfect - so I would say no to moving it to the graveyard. If you want me to try it for you I will need a admincp login.
csoroner
03-12-2009, 03:22 PM
Thanks for the offer but I wound up using Ev!L ErN!E's and it's fine. I just need to figure out how to stop the image from scrolling in the quick reply box.

May you have an idea for that?
accludetuner
11-08-2009, 07:07 PM
Ok, this hasn't been posted in for a while. I used a combo of this and Ev!L ErN!E's mod (https://vborg.vbsupport.ru/showthread.php?t=129962).

I had an issue with the centering of the image, the fact that the increase/decrease box didn't work, and didn't like the image being shown in all input boxes. Here's what I did and this works great for me on 3.8.4 with all the major browsers.

3 template edits.

In Editor Templates > editor_toolbar_off

find:
<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60" style="

insert directly after the style="
background:#FFFFFF url(images/image.png); background-repeat: no-repeat; background-position: center center;
(note there is a space at the end. You want a space right after - center; )

Things in green should be changed to your forum stuff.



In Editor Templates > editor_toolbar_on

find:
<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60" style="

insert directly after the style="
background:#FFFFFF url(images/image.png); background-repeat: no-repeat; background-position: center center;
(note there is a space at the end. You want a space right after - center; )

Things in green should be changed to your forum stuff.



In Show Thread Templates > showthread_quickreply
find:
<textarea name="message" id="{$editorid}_textarea" rows="10" cols="60" style="

insert directly after the style="
background:#FFFFFF url(images/image.png); background-repeat: no-repeat; background-position: center center;
(note there is a space at the end. You want a space right after - center; )
(also note, this needs to be done TWICE in this template. There are two instances that need to be modified so make sure you do both. )

Things in green should be changed to your forum stuff.


That's it. Works perfect for me. Hope this helps some you struggling to get it to work, gripes about the display in all input boxes, or issues with the text box increase/decrease buttons.
ravenfaust
12-16-2009, 11:36 AM
how do i get it so it shows in shoutbox ?
blazinchuck
01-02-2011, 08:33 PM
hmm, ok ive done the edits to all 3 templates you listed, and i made to changes from this poster Ev!L ErN!E's mod....however, my image still not showing up at all. im using firefox, but was really hoping this would work, i like the idea...but not working 8-(


http://carolinabroncos.com
blazinchuck
01-03-2011, 08:31 PM
ok, i figured it out