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

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

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

please click install
---------------------------------------------------------

Instructions:

in editor_toolbar_off find:

PHP Code:

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


After place:

PHP Code:

<!-- 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):

PHP Code:

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


After place:

PHP Code:

<!-- 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

PHP Code:

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


After place:

PHP Code:

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


[rwoscott]

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]

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]

Originally Posted by TCE Killa

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]

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]

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]

Ok, this hasn't been posted in for a while. I used a combo of this and Ev!L ErN!E's mod.

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]

how do i get it so it shows in shoutbox ?

[blazinchuck]

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]

ok, i figured it out