Menu de navegação MF para Blogger

Olá amigos Mult-focos, temos mais um lindo menu para vocês, é o menu de navegação MF para Blogger.
Com nove cores para sua escolha, este menu é facílimo de adicionar em seu blog.

Veja um demo clicando no botão abaixo

DEMO   Como adicionar em seu blog?

Copie o código HTML no Box de códigos abaixo se optar pela cor azul ou copiar o código JS se optar por outra cor, configure e adicione em um gadget, se não sabe como aprenda AQUI.

OBS: Se optar por outra cor é só copiar a URL correspondente a cor da sua preferência e colocar onde este escrito AQUI A URL DA COR ESCOLHIDA,no código JS do Box e está pronto.
Isto é tudo.

---

<style>

#tab_menu {
 background:url(AQUI A URL DA COR ESCOLHIDA) no-repeat;
 height:50px;
 width:960px;
 line-height:50px;
 list-style:none;
 margin-top:10px;
 font-size:14px;
 font-family:Verdana, Geneva, sans-serif;
 font-weight:bold;
 overflow:hidden;
}

#tab_menu li {
 float:left;
 border-right:1px solid #FFA722;
 border-left:1px solid #CC5200;
}

#tab_menu li:first-child {
 border-left:none;
}

#tab_menu li:last-child {
 border-right:none;
}

#tab_menu li a{
 text-decoration:none;
 float:left;
 display:block;
 height:50px;
 padding:0 20px;
 color:#FFF;
}

#tab_menu li a.current, #tab_menu li a:hover, #tab_menu li a.tool:hover {
 color:#622900;
 text-shadow:1px 1px 0px #E8964B;
}

#tab_menu li a.tool{
 color:#000;
 text-shadow:1px 1px 0px #E8964B;
}

</style>


<ul id='tab_menu'>
<li ><a href='URL'>Home</a></li>
<li ><a href='URL'>PRODUTO 1</a></li>
<li ><a href='URL'>PRODUTO 2</a></li>
<li ><a href='URL'>PRODUTO 3</a></li>
<li ><a href='URL'>PRODUTO 4</a></li>
<li ><a href='URL'>PRODUTO 5</a></li>
<li ><a href='URL'>PRODUTO 6</a></li>
<li ><a href='URL'>PRODUTO 7</a></li>
<li ><a href='URL'>PRODUTO 8</a></li>
</ul>

See the Pen owBie by Mairink (@Oemes) on CodePen.

---

Escolha a cor para o seu menu, abaixo da cor está a URL correspondente.

https://lh6.googleusercontent.com/-M3ZflCRdH48/VB4mLmmiNyI/AAAAAAAAHLo/kZ-lUQiLheQ/w960-h50-no/menu_bg_6.png

---

https://lh6.googleusercontent.com/-4dmsnhuxraw/VB4msfa3a-I/AAAAAAAAHMA/bAH7CLSR11w/w960-h50-no/menu_bg_amarcverd.png

---

https://lh5.googleusercontent.com/-HKHeS6UNnf4/VB4m6gNLP8I/AAAAAAAAHMY/M0oGMxaPbeI/w960-h50-no/menu_bg_amarel.png

---

https://lh3.googleusercontent.com/-TT0nFwDnVUw/VB4nIL1zfjI/AAAAAAAAHMw/UTSoadXVDYk/w960-h50-no/menu_bg_cinzaesc.png

---

https://lh3.googleusercontent.com/-nJGogYkmfDk/VB4nV4jeerI/AAAAAAAAHNI/-XGdACuOhGQ/w960-h50-no/menu_bg_czclar.png

---

https://lh3.googleusercontent.com/-DvSZUrtUIgo/VB4nju4t7eI/AAAAAAAAHNg/w_BNX9EeZxg/w960-h50-no/menu_bg_czmed.png

---

https://lh4.googleusercontent.com/-ujfCOqVCq4A/VB4nyjkwG3I/AAAAAAAAHN4/HSbxfzR89Cg/w960-h50-no/menu_bg_verde.png

---

https://lh4.googleusercontent.com/-_9i0GyeGYzw/VB4oBQ6_gKI/AAAAAAAAHOQ/G7d00bAXfoM/w960-h50-no/menu_bglaraj.png

---

https://lh4.googleusercontent.com/-ofb6Hp11EZc/VB4oNqk0vTI/AAAAAAAAHOo/VS8z0EVDgns/w960-h50-no/menu_bgverdepisc.png

---