GTSmiliebox - Move Below Editing Area

Sites with a lot of simlies and fixed-width layouts occasionally run into the "smilie-box-stretch-outside-box" problem.

View attachment image to see what I mean.

With this template modification the smilie toolbar box will now display below the editing area NOT beside it.

PayPal Donations Accepted

FIND IN editor_toolbar_on template:

    <tr valign="top">
        <td class="controlbar"><textarea name="message" id="{$editorid}_textarea" rows="10" cols="60" style="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>

REPLACE WITH:

    <tr valign="top">
        <td class="controlbar"><textarea name="message" id="{$editorid}_textarea" rows="10" cols="60" style="width:$stylevar[messagewidth]; height:{$editor_height}px" tabindex="1" dir="$stylevar[textdirection]">$newpost[message]</textarea></td>
    </tr>
    <if condition="$smiliebox">
    <tr>
        <td class="controlbar">$smiliebox</td></td>
    </tr>
    </if>

OPTIONAL
This template edit moves the "More" link.
REPLACE editor_smilibox TEMPLATE WITH:

<if condition="$show['smiliebox']">
<fieldset class="fieldset" id="{$editorid}_smiliebox" title="$vbphrase[smilies]">
    <legend>$vbphrase[smilies] 
    <if condition="$show['moresmilieslink']">
    [<a href="#" onclick="vB_Editor['$editorid'].open_smilie_window(smiliewindow_x, smiliewindow_y); return false" title="<phrase 1="$vboptions[smtotal]" 2="$totalsmilies">$vbphrase[showing_x_smilies_of_y_total]</phrase>">$vbphrase[more]</a>]
    </if>
    </legend>
    <table cellpadding="2" cellspacing="0" border="0" align="center">
    $smiliebits
    </table>
</fieldset>
<else />
<div id="smiliebox" style="display:none"></div>
</if>

Edit your vboptions / Message Posting Interface Options to change the number of smilies displayed per row.

Click for updates.

[CoreIssue]

Sweet.

I think it looks way better than the default and allows a better text posting area!:nervous:

[Princeton]

thanks for the feedback!

[Doc.Blade]

nice work Princeton, this is a great help on my site, thank you :nervous:

>>Installed<<

[Princeton]

feedback appreciated .. thank you :up:

[FARMER]

Greatest Idea!!

Thank you!

[|oR|Greg]

Installed, however I wanted the Message Area Width at 100%, but it doesn't seem to accept percent as a value, just px. Anyone know how to fill the Message Area Width completely regarding width?

[Princeton]

table/editor width is based on the value that you enter in STYLES / STYLEVAR

[|oR|Greg]

Right but it doesn't accept %, only px, do you know a way to have it accept either %, or some other way to fill the space?

[JJR512]

If you like your smilies below your message editing box, here's something else you might want to do. If you just move the smilies to below the edit box, the More link will still be left-aligned under the smilies. To center it, make the following change to the template editor_smiliebox:

Find:

<td class="smallfont" colspan="$vboptions[smcolumns]">

Change to:

<td align="center" class="smallfont" colspan="$vboptions[smcolumns]">

Save it and you're done.

[quang188]

Thanx a lot man. APpreciate it greatly