Add message above shoutbox for rules etc

[Former Member]

Want to add text above your shoutbox for rules etc
But haven't enough space using the show message above the shoutbox
Using the shoutbox admin panel

Screenshot


Go - admin - Themes - Layout Templates - Shoutbox

And Look for this line of code

<div class="title-bar"><h2>Shoutbox</h2></div>
<div class="content">

And directly under it add the line of code below

<br /><center><font size=2>
<font color="#000000">Add Content Here</font></font></center><br />

You can change the font size and colour


Steve

Reminder you can click to preview how it looks before saving any changes to your template
By clicking on the preview button before you click to save any changes

[?Leslie?]

Sorry if this is the wrong place to post this...but I was wondering how I can create a boarder around the text that I add...so that it looks like the bubbles that the messages are in. =) Thanks!

[Former Member]

Feb 8, 2014 6:53:12 GMT -8 ?Leslie? said:

Sorry if this is the wrong place to post this...but I was wondering how I can create a boarder around the text that I add...so that it looks like the bubbles that the messages are in. =) Thanks!

Hi  - you could try this - Transparent Background 


<center><div class="content"><div style="padding:2px;border:1px solid #000000;border-radius:5px; text-align:center;">Test Add Content Here</div></div></center><br />


If you want a different  background colour You can change background-color:white; the bold to any colour

<center><div class="content"><div style="padding:2px;border:1px solid #000000;border-radius:5px; background-color:white; text-align:center;">Add Content Here</div></div></center><br />


Or This where you can change the width: 700px - background-color: #F3E2A9 and height: 40px

<center>

<div style="width: 700px; height: 40px;border:3px solid #886A08; background-color: #F3E2A9; border-radius: 10px;"><center><font size=2>

<font color="#000000"><br />Add Content Here</font></font></center><br /></div> </center><br />


Screenshots

[Former Member]

Hi, ?Leslie?

If you want to change the width for first option the Transparent Background use this code
change width: 600px to the width you want

<center><div class="content"><div style="padding:2px;border:1px solid #000000;border-radius:5px;width: 600px; text-align:center;">Test Add Content Here</div></div></center><br />

[?Leslie?]

Thank you so much! I ended up combining the two and came up with this:

<div style="width: 760px; height: 58px; padding:3px; border:1px solid #111111; background-color: #; border-radius: 5px;"><center><font size=2><font color="#ffffff">TEXT HERE</font></font></center><br /></div></center><br />

[Former Member]

Feb 8, 2014 8:05:54 GMT -8 ?Leslie? said:

Thank you so much! I ended up combining the two and came up with this:

<div style="width: 760px; height: 58px; padding:3px; border:1px solid #111111; background-color: #; border-radius: 5px;"><center><font size=2><font color="#ffffff">TEXT HERE</font></font></center><br /></div></center><br />

you had a stray </center> tag

<center><div style="width: 760px; height: 58px; padding:3px; border:1px solid #111111; background-color: #; border-radius: 5px;"><center><font size=2><font color="#000000">TEXT HERE</font></font></center><br /></div></center><br />

[<{Txepster}>]

Thankyou This helped me alot Always wanted to add rules to the Shoutbox