Topic: Shoutbox Text Box Size

[newtoallthis]

Thanks for that. I have spent a lot of time looking at the CSS of the shoutbox in Firebug. No joy yet but I'll persevere.

[AngelinaBelle]

Then you have seen that the shoutbox input is

Code: [Select]

<input name="new_shout" class="shoutbox_input sp_float_left input_text" id="new_shout_1" type="text" />and that the css for .shoutbox_input is in portal.css, and that you can change the height for .shoutbox_intput to whatever you want?

[newtoallthis]

I have previously changed the text box height (and so have you if you read the earlier part of the thread). Problem is, the input remains as 'text' rather than 'textarea' and text can still only be added in one line.

I'm hoping to get the shout box text input box to behave (but of a smaller size) in the same way as the textarea into which I am typing this reply, the code I see being:-

Code: [Select]

<textarea style="width: 100%; height: 175px;" tabindex="2" onchange="storeCaret(this);" onkeyup="storeCaret(this);" onclick="storeCaret(this);" onselect="storeCaret(this);" cols="60" rows="12" id="message" name="message" class="editor"></textarea>
Where is the code to be found that you quoted in your last post?

[AngelinaBelle]

For

Code: [Select]

<div class="shoutbox_input smalltext">Look in PortalShoutbox.template.php.
On a test forum, test out using a textarea, to see if it works well for you.
If so, you can certainly use CSS to restyle it any way you want.

[AussieBill]

Sorry, but I don't understand why the edit I posted here is not working for you, newtoallthis. It's working just fine on my site in a variety of browsers (FF5, IE8, Chrome & Opera). I'm thinking it could be a cache problem? Have you tried emptying the file cache in Admin->Maintenance->Routine? Perhaps you could try disabling and then re-enabling the ShoutBox and ShoutBox block? Have you tried re-uploading PortalShoutbox.template.php in case there was a problem with your FTP client? Sometimes, the browser cache has to be cleared several times before a change will show.

Has anyone else tried this edit? If so, did it work?

Anyway, to clarify things, here is the important part of the edit. The part that make the one-line text field into a multi-line text 'box':
Find:

Code: [Select]

<input type="text" name="new_shout" id="new_shout_', $shoutbox['id'], '" class="shoutbox_input sp_float_left input_text"', $context['browser']['is_ie'] ? ' onkeypress="if (sp_catch_enter(event)) { sp_submit_shout(' . $shoutbox['id'] . ', \'' . $context['session_var'] . '\', \'' . $context['session_id'] . '\'); return false; }"' : '', ' />Replace With:

Code: [Select]

<textarea class="smalltext" name="new_shout" id="new_shout_', $shoutbox['id'], '" style="width: 96%; height: 60px;"', $context['browser']['is_ie'] ? ' onkeypress="if (sp_catch_enter(event)) { sp_submit_shout(' . $shoutbox['id'] . ', \'' . $context['session_var'] . '\', \'' . $context['session_id'] . '\'); return false; }"' : '', ' /></textarea>The rest is just 'styling' to center the text box and put the button underneath. Compare those two bits of code and you can see how I did it. It's quite simple really!

[AngelinaBelle]

Actually, even preserving

Code: [Select]

class="shoutbox_input in the textarea could be useful -- then it could be styled using CSS this way.

[newtoallthis]

I'll try that again, thanks. A larger text box would be an improvement, but it's a user stretchable 'textarea' that I ultimately want to achieve.

In fact, it seems a logical improvement to SP. It can be easily set at any size by users.

[AussieBill]

but it's a user stretchable 'textarea' that I ultimately want to achieve.

I just had a look with the browsers available to me. The textarea is stretchable (by dragging the 'handle' at bottom right with the mouse) in Firefox and Chrome, but not IE and Opera.

[newtoallthis]

Thanks for persevering.

Tried the edit again on my test forum. (Original files should be OK. Uploaded from PC through cPanel with no problems.)

Edit didn't work.

I emptied the file cache several times both before and after the edit.

Disabled and re-enabled the shoutbox several times.

Created a new shoutbox.

Tried viewing in FF5, IE8 & Chome.

No change at all to existing or new shoutbox default appearance and/or functionality.

[AussieBill]

Can you attach your PortalShoutbox.template.php file please?

[newtoallthis]

Can you attach your PortalShoutbox.template.php file please?

I really do very much appreciate your perseverance.

PortalShoutbox.template.php attached.

[AussieBill]

Strange... your file does not have the modified code in it. If that is the file you actually used it would explain why nothing changed!

Anyway, try the attached file, which is your file with my 'modification' (lines 159-164) included. Your file is now exactly the same as mine, so it should work! 

[AngelinaBelle]

newtoallthis -- have you been able to replace the textbox with a textarea?

[newtoallthis]

The file I uploaded didn't contain the amendment because I'd removed it when it didn't work. I just wanted you to see that it was as it should be (i.e. not corrupted).

I've tried the new file on my test forum. I've emptied the file cache several times, refreshed the page, disabled and re-enabled the shout box and cannot see any change at all.

I'm on SMF 2.0 Gold and you seem to be running SMF 2 RC 3. Could that be an issue?? Also, the file permission for the old and new files are both 0644.

[AngelinaBelle]

Once you start using the new file, you'll see that you've got a textarea for shoutbox entry.
Then, you can start fiddling with it using CSS.

[newtoallthis]

I've still got the amended PortalShoutbox.template.php file active and it does not make any difference to the appearance or functionality of the text input box on my test forum. No 'handle' is evident which can be grabbed and stretched.

If I understand AussieBill correctly, just that one edit to PortalBlocks.template.php will cause the desired change to occur without the need to tweak further in portal.css.

[AngelinaBelle]

Some browsers provide you a "handle" to resize the textarea. Safari does.  IE does not.
You can use CSS to set the size of the textarea to be 2 lines high, if you like.

[newtoallthis]

FF5 as it was, and now FF6, does support the rendering of a 'handle'.

FF is my default browser and no matter how I try, I cannot see a handle to the base of the SP shoutbox.

Thanks for your perseverance, chaps and chappeses, but the 'problem' remains open.

[AngelinaBelle]

What happens if you take out the explicit "width" or "height" parameters for the textarea? Does the handle return then?

[newtoallthis]

No it doesn't.

And, when I change the height from 60 px to 120 px, that makes no difference either.

It's almost as though the code content of Portal.Shoutbox.template.php has no bearing whatsoever on how the shoutbox behaves!