Renkli Blogger Css Menü Eklentisi

Blogger renkli menü yapımından bahsedeceğim sizlere... Aslında pek fazla kullanılmayan bir eklenti olarak düşünüyorum bloglarında bu eklentiye yer vermek isteyenler illaki olacaktır bu yüzden arşivde bulunması gereken kurulumu basit olan bir eklenti.

Kurulum için: Blogger - Kumanda Paneli - Yerleşim - Gadget Ekle - Html Javascript bölümüne aşağıdaki kodları eklemeniz yeterli olacaktır. Kodlarda renkli olan kısımları kendinize göre düzenleyiniz.

<style>

        #multicolor-bar {
            background: #;
            width: 100%;
                 color: #FFF;
                margin: 10px 0;
                padding: 0;
                position: relative;
                border-top:0px solid #0099FF;
                height:35px;

        }

        #multicolor-nav {
            margin: 0;
            padding: 0;
        }
        #multicolor-nav ul {
            float: left;
            list-style: none;
            margin: 0;
            padding: 0;
        }
        #multicolor-nav li {
            list-style: none;
            margin: 10px;
            padding: 0;
        }
        #multicolor-nav li a, #multicolor-nav li a:link, #multicolor-nav li a:visited {
            color: #FFF;
            display: block;
            font:bold 12px Helvetica, sans-serif;
            margin: 0;
            padding: 9px 12px 11px 12px;
            text-decoration: none;

        }
        #multicolor-nav li a:hover, #multicolor-nav li a:active {
            background: #ee7d07;
            color: #FFF;
            display: block;
            text-decoration: none;
             margin: 0;
            padding: 9px 12px 11px 12px;
        }

        #multicolor-nav li {
            float: left;
            padding: 0;
        }
        .color-1
       {
       background:#0b5394;
       }

         .color-4
       {
       background:#990000;
       }

        .color-5
       {
       background:#d6253a;
       }

        .color-7
       {
       background:#274e13;
       }

         .color-11
       {
       background:#b45f06;
       }

        .color-14
       {
       background:#741b47;
       }

    </style>

        <div id='multicolor-bar'>
                  <ul id='multicolor-nav'>
                   <li class="color-1"><a href='#'>Facebook</a></li>
                   <li class="color-4"><a href='#'>Pinterest</a></li>
                   <li class="color-5"><a href='#'>Google+</a></li>
                   <li class="color-7"><a href='#'>Youtube</a></li>
                   <li class="color-11"><a href='#'>Hakkımda</a></li>
                   <li class="color-14"><a href='#'>İletişim</a></li>
    </ul></div>