This modification allow you make a simple slide-in custom board via CSS. You can create an announcement, warning, advertiment or forum directory (menu).

https://vborg.vbsupport.ru/external/2011/06/8.gifhttps://vborg.vbsupport.ru/external/2011/06/9.gifhttps://vborg.vbsupport.ru/external/2011/06/10.gifhttps://vborg.vbsupport.ru/external/2011/06/11.gif
https://vborg.vbsupport.ru/external/2011/06/12.gif : margin (with icon), transition, transition-delay.

1. Download attachment file, unzip, and upload images folder via FTP.
2. Insert CSS code to additional.css template :
   AdminCP -> Styles & Templates -> Style Manager -> Edit Templates -> CSS Templates -> additional.css : insert at top or bottom of this template !
   
   Code:

   ---

   /* Slide-in Custom Board - Getamped 1404 */
#infoPanel  {
    position: fixed;
    background-color: #fff;
    width: 330px;
    height: auto;
    padding: 4px 4px 4px 4px;
    font-size: 12px;
    font-weight: 700;
    color: #000;
    -moz-box-shadow: 0 0 20px #111;
    -webkit-box-shadow: 0 0 20px #111;
    box-shadow: 0 0 20px #111;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    opacity: 0.7;
    -moz-opacity:0.7;
    -khtml-opacity: 0.7;
    filter: alpha(opacity=70);
    -moz-transition: all 4s ease;
    -webkit-transition: all 4s ease;
    -o-transition: all 4s ease;
    transition: all 4s ease;
    -moz-transition-delay: 2s;
    -webkit-transition-delay: 2s;
    -o-transition-delay: 2s;
    transition-delay: 2s;
    left: -300px;
    z-index: 9999;
}
#infoPanel:hover {
    -moz-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    opacity: 0.9;
    -moz-opacity:0.9;
    -khtml-opacity: 0.9;
    filter: alpha(opacity=90);
    left: 10px;
}
img.infoIcon {
    float: right;
    margin: -20px -20px 0px 0px;
}

   ---

3. Insert HTML code to navbar template :
   ... -> Edit Templates -> Navigation / Breadcrumb Templates -> navbar : insert to bottom of this template !
   
   HTML Code:

   ---

   <div id="infoPanel"> <!-- Slide-in Custom Board - Getamped 1404 -->
    <img src="images/misc/information.png" class="infoIcon" />
    <table width="100%">
        <tr>
            <td width="90%" style="padding-left:50px;">Announcement ! Announcement !<br />Announcement ! Announcement !</br />Announcement ! Announcement !<br />Announcement ! Announcement !</td>
            <td style="text-align:center;" width="10%">A<br>N<br>N<br>O<br>U<br>N<br>C<br>E<br>M<br>E<br>N<br>T</td>
        </tr>
    </table>
</div>

   ---

4. Custom for yourself !
   Using your CSS knowledge to do ! Quick guide :
   • Change your location
     1. Show at right :
        In CSS code, search for :
        
        Code:

        ---

            left: -300px;

... and ...

    left: 10px;

        ---

        change "left" to "right", and custom your pixel !
     2. Show at left corner :
        In CSS code, search for :
        
        Code:

        ---

            left: -300px;

... and ...

    left: 10px;

        ---

        add below with each :
        
        Code:

        ---

            bottom: -160px;

... and ...

    bottom: 10px;

        ---

     3. Show at right corner : same left corner, change "left" to "right" !
   • Change your icon : I provide 4 icons in .zip packed to upload, see and choose.
     In HTML code, search for :
     
     HTML Code:

     ---

     <img src="images/misc/information.png" class="infoIcon" />

     ---

     Change your icon name !
   • Change your delay time : time when mouse un-hover and slide-in board will be collapse.
     In CSS code, search for :
     
     Code:

     ---

         -moz-transition-delay: 2s;
    -webkit-transition-delay: 2s;
    -o-transition-delay: 2s;
    transition-delay: 2s;

     ---

     Change your number with "2", unit is second.
   • Change your width & height : size of slide-in custom board, recommends using the default size if you do not add much to the content.
     In CSS code, search for :
     
     Code:

     ---

         width: 330px;
    height: auto;

     ---

     Change it for you !
   • Change your background color : change the background color to match your forum style.
     In CSS code, search for :
     
     Code:

     ---

         background-color: #fff;

     ---

     Get more color code at here : http://w3schools.com/html/html_colornames.asp
   • Change your transition time : change your time when mouse hover and un-hover.
     In CSS code, search for :
     
     Code:

     ---

         -moz-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;

     ---

     and, when mouse un-hover :
     
     Code:

     ---

         -moz-transition: all 4s ease;
    -webkit-transition: all 4s ease;
    -o-transition: all 4s ease;
    transition: all 4s ease;

     ---

     change with your number !