.

Colocar um submenu no blog é um pouco mais complicado que um menu normal. Para não deixar duvidas um submenu é quando você passa o mouse pelo menu e sobre algum item aparecem mais opções, por exemplo, um menu de um blog de downloads tem musica, jogos, filmes, games e outros itens, quando você coloca o mouse sobre o item filmes aparece um novo menu ao lado com os itens suspense, terror, comédia, adulto...
Agora que já explicamos como funciona o submenu vamos começar a dizer como colocar um no seu blog. Entre na pagina layout, adicionar gadget, html/javascript e coloque o código abaixo, por ser um código grande pode haver algum problema com o código em copiar e colar direito do blog, então temos aqui o mesmo Click Aqui para pegar o Codigo

• Item 1
  
  
  • Item 1.1
  • Item 1.2
  • Item 1.3
  
  
• Item 2
• Item 3
  
  
  • Item 3.1
  • Item 3.2
  • Item 3.3
  
  
• Item 4

Na parte final tem os itens, veja nesta pagina o menu com submenu em funcionamento e ficará mais fácil entender como colocar os títulos que quiser no menu do seu blog e nos submenus. Vamos falar sobre o item 1, isso é o texto que vai aparecer no seu blog, o link dele é daquele jeito mesmo só um sinal de jogo da velha, os subitens é só trocar onde está Item 1.1 pelo titulo que desejar e colocar a url no lugar indicado na mesma linha, e assim por diante em todos os outros links.

Você deve colocar esse código onde aparecerá o menu horizontal com submenu, lembre-se que se o espaço (largura) do seu blog não for suficiente para o menu completo um ou mais itens vão para linha debaixo, portanto é preciso ter cuidado com o numero de itens e a largura do botão para alterar a largura de cada botão mude o valor 150px, veja no código ele aparece 4 vezes width: 150px; você deve mudar esse numero em todos, ou seja, se colocar 130px tem que alterar nos 4 lugares que aparece o 150.

Para mudar as cores, letras, fundo e tudo mais dos botões é nesta parte do código:

Click Aqui para pegar Codigo 2

E o estilo quando o mouse está sobre ele é aqui:

ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{background-color: #FFCC99;background-image: url(http://img16.imageshack.us/img16/122/overc.gif);
color: #000000;letter-spacing: normal;word-spacing: normal;border-top: 1px solid #FFFF00;
border-right: 1px solid #CC0000;
border-bottom: 1px solid #CC0000;
border-left: 1px solid #FFFF00;
}