Menu Rolante no topo do Blog

Neste tutorial, vamos aprender como adicionar um menu no topo do blog.
O diferencial deste menu é que ele se move conforme rolamos a página para cima ou para baixo, porém, permanece sempre fixo no topo.

Veja a Demo
Essa imagem ou no site da demo "os pontos amarelados do lado dos links no menu e da template nao do menu".

Para implementar este menu no seu blog, basta apenas a inserção de CSS e HTML no código do template.

Antes de iniciarmos, para evitar quaisquer transtornos, caso algo saia errado, recomendo que você faça um Backup do seu template antes de prosseguir.

1º passo - Aplicar estilos CSS:

Vá na aba "design", entre na edição HTML do seu template, não precisa clicar em "expandir modelos de widgets" e procure pela tag
e cole o seguinte código logo ACIMA dela:

Veja o codigo aqui!

dite as cores do menu de acordo com seu gosto. Os campos que você pode e deve editar já estão destacados no código acima.

2º passo - Inserir o código html:

Agora devemos inserir o código html do menu para que ele fique visível no topo do blog.
Procure por:
e cole o seguinte código logo ABAIXO dele:

Veja o codigo aqui!

Insira seus links nos locais destacados, e inclua também o titulo de seus links.

Se estiver usando algum modelo de template do "designer de modelo do blogger", cole o código html do menu logo ACIMA da tag