Demó:

• Menüpont01
• Menüpont02
• Menüpont03

HTML:
Ezt a kódot kell abba a modulba tenned, ahová szeretnéd a menüdet rakni. Értelemszerűen az URL helyére megy a menüpontod URL-je, a Menüpont helyére pedig a menüpont neve.

<ul class="bevelmenu">
    <li><a href="http://www.URL">Menüpont</a></li>
    <li><a href="http://www.URL">Menüpont</a></li>
    <li><a href="http://www.URL">Menüpont</a></li>
</ul>

Amennyi menüpontot szeretnél, annyiszor rakd egymás alá a
    <li><a href="http://www.URL">Menüpont</a></li>
sort, de arra ügyelj, hogy az elején maradjon az <ul class sor, s a végét a </ul> zárja.

CSS:
Itt adhatod meg a menü színét, méretét. A legfontosabb részeket jelöltük a kódban, ezt nem kell kitörölnöd belőle. Ha csak egyszer használod ezt a menüt az oldaladon, akkor a CSS mehet nyugodtan abba a modulba, amelyikben a menüd van; de ha többször használnád, akkor bal/jobb oldali modulba rakd.

<style type="text/css">
.bevelmenu{
list-style-type: none;
margin: 0;
padding: 0;
width: 150px;    /* menü szélessége */
}
.bevelmenu li a{
display: block;
width: 100%;
padding: 2px 4px;
text-decoration: none;
font-weight: bold;
background-color: #e3ffbf;    /* menü színe */
border: 2px solid #e3ffbf;    /* menü keretszín */
text-decoration:none;
}
.bevelmenu li a:active, a:link, a:visited{
color: #4e7f08;    /* menüpont színe */
}
.bevelmenu li a:hover{
color: #000000;    /* menüpont színe, ha ráviszed az egeret */
background-color: #b1e567;    /* menüpont háttérszíne, ha ráviszed az egeret */
text-decoration: none;
border-style: outset;
}
</style>