[vB 3.7] How to Make Notices Stand-out More… at Your vBulletin Resource The Staff Lounge

You are here: Home » vBulletin Tips » [vB 3.7] How to Make Notices Stand-out More…

[vB 3.7] How to Make Notices Stand-out More…

80 Views Published 5 months ago in vBulletin Tips

Instead of your users seeing nothing more than a boring old box, with maybe a few coloured words in it, you have the option of livening-up your Notices box by simply alterning one template and making your notices in a specific way.

1. Modify a template:

Admin CP -> Styles & Templates -> Style Manager -> <STYLE NAME> -> Template Options -> Edit Templates

Once you're at the templates list, expand:

Code:

Navigation/Breadcrumb Templates

and find the navbar template.

Look for the part of the template containing:

HTML Code:

<if condition="$show['notices']">

 <table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">

 <tr>

  <td class="thead">$vbphrase[notices]</td>

 </tr>

 <tr>

  <td class="alt1">$notices</td>

 </tr>

 </table>

 <br />

</if>

...and where it says:

HTML Code:

<td class="alt1">$notices</td>

...replace it with:

HTML Code:

<td class="alt1" style="background-color:#FFFFCC;">$notices</td>

You can replace the hex colour code #FFFFCC with a colour of your choice, although a subtle colour is recommended.

Save the template.

2. Create a Notice:

Admin CP -> Notices -> Add New Notice

For a short and basic informative notice, for something like an event you wish to make people aware of, the following will be appropriate:

Start the Notice HTML with:

HTML Code:

<table border=0><tr><td><img src="http://www.somewebsite.com/forum/images/icons/silk/information.png" /></td><td>

After this, you can add whatever you wish, and once done, you need to close with:

HTML Code:

</td></tr></table>

So, your Notice HTML should look something like:

HTML Code:

<table border=0><tr><td><img src="http://www.somewebsite.com/forum/images/icons/silk/information.png" /></td><td>The An event has occured! <a href="http://www.sgc-clan.com/forum/showthread.php?t=604">Click here for details...</a></td></tr></table>

The end result should look something like...

Attached are some common icons you can use for your notices bar. They came from the FamFam/Silk Icons pack.

Information: Attachment 27129

Notice: Attachment 27130

Warning: Attachment 27131

Attached Images